v4.0.0

Welcome to v4!

This is, from a fair part, a rewrite. The basic usage remains the same, so migration should not be too hard. If you're using Flow or Typescript, that will make it even easier - both typings should be solid!

Improvements

✅Greater component reuse across screens:

Previously, if you used eg. <HiddenItem title="search" iconName="ios-search" onPress={() => alert('search')} /> in one screen, you couldn't really use it in another one. Now you can - just create a component that wraps it, eg. like this:

const ReusableHiddenItem = ({ onPress }) => <HiddenItem title="hidden2" onPress={onPress} />;

✅New overflow menu handler: Material dropdown menu

This is material dropdown menu adapted from react-native-paper, credit for amazing job goes to them. This Menu is bundled in this library (no dependency on react-native-paper).

To use it, pass overflowMenuPressHandlerDropdownMenu as onPress to OverflowMenu (this is the default for Android and Web)

✅Cleaner api:

• new OverflowMenu component
• some props have been moved to OverflowMenu

✅Experimental web support

• for overflow menu, you need to use the Material Menu (pass overflowMenuPressHandlerDropdownMenu as onPress to OverflowMenu)

✅CI improvements

• Flow, Jest tests and ESLint run in CI. I'd like to check TS validity too (by checking the example project) - please open a PR if you're using TS.

Breaking Changes

Because so much has changed, this may not be complete list. Let me know if I forgot something.

❌ changed

• show prop is removed -> use Item or HiddenItem component
• overflowButtonWrapperStyle -> pass style to OverflowMenu
• onOverflowMenuPress -> pass onPress to OverflowMenu
• overflowButtonTestID -> pass testID to OverflowMenu
• buttonWrapperStyle -> renamed to style
• if you want an Item or HiddenItem to be disabled, pass disabled={true} prop

Known Issues

see https://github.com/vonovak/react-navigation-header-buttons#known-issues