chore: release 4.0.9

As mentioned in https://reactnavigation.org/docs/en/switch-actions.html
the param which's name is 'key' of `SwitchActions.jumpTo()`  should be optional

.github/PULL_REQUEST_TEMPLATE.md

@@ -15,7 +15,3 @@ The code must pass tests.
 ## Code formatting
 
 Look around. Match the style of the rest of the codebase. Run `yarn format` before committing.
-
-## Changelog
-
-Add an entry under the "Unreleased" heading in [CHANGELOG.md](https://github.com/react-navigation/react-navigation/blob/master/CHANGELOG.md#unreleased) which explains your change.

CHANGELOG.md

@@ -1,336 +0,0 @@
-# Changelog
-
-All notable changes to this project will be documented in this file.
-
-The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
-and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
-
-## Unreleased
-
-- Add missing Flow type exports for `ScrollView` and `NavigationContext`
-
-## [3.11.1]
-
-## Fixes
-
-- Fix `navigationOptions` type from `NavigationScreenProp<NavigationRoute>` to `NavigationScreenConfig<Options>`.
-- Fix missing `isFirstRouteInParent` type in typescript and flow.
-- Add missing `backTitleVisible` for typescript, `disabled` and `backTitleVisible` for flow definitions in type `HeaderBackButtonProps`
-- Add missing `keyboardHidesTabBar` for TypeScript to `TabViewConfig.tabBarOptions`
-- Add missing `unmountInactiveRoutes` for TypeScript to `DrawerNavigatorConfig`
-
-## [3.11.0]
-
-## New Features
-
-- Export `SwitchActions`
-
-## [3.10.2]
-
-## Fixes
-
-- Update Flow types - Add `cardShadowEnabled` and `cardOverlayEnabled` to NavigationStackViewConfig
-- Upgrade react-navigation-tabs [#5914](https://github.com/react-navigation/react-navigation/issues/5914)
-
-## [3.10.0] - [2019-05-16](https://github.com/react-navigation/react-navigation/releases/tag/3.10.0)
-
-## Removed
-
-- `persistenceKey` no longer automatically saves and restores navigation state using AsyncStorage. Typically this would be a breaking change that would require a major version bump, but because this has always been marked as experimental in the documentation and it is unlikely to impact production apps, we are rolling it in a minor release. `persistenceKey` has been replaced with `persistNavigationState` and `loadNavigationState`. See the diff in docs: https://github.com/react-navigation/react-navigation.github.io/pull/425/files?short_path=b668b1a#diff-b668b1a4201e40b1378036dc012100fe
-
-## Changed
-
-- Removed animations from stack on web
-- Ensure that headerMode is float by default on web
-
-## Fixes
-
-- Prevent transitionConfig's useNativeDriver value being overwritten. (https://github.com/react-navigation/stack/commit/8b2af7d94209d4658abd8d799bc78744a1004b4e)
-- Update typescript with headerLeftContainerStyle and headerRightContainerStyle
-- Update typescript - Add `safeAreaInset` to `BottomTabBarProps`
-- Update typescript - `TabBarTop` is now `MaterialTopTabBar`
-- Update typescript - Remove `SwitchNavigator`, `TabNavigator` and `StackNavigator`. Added exports for `SceneView` and `SwitchRouter`
-- Update typescript - `getLabel` is now `getLabelText` in BottomTabProps and TopTabProps
-- Silence deprecated lifecycle warning in Stack Transitioner
-
-## [3.9.0] - [2019-04-23](https://github.com/react-navigation/react-navigation/releases/tag/3.9.0)
-
-## Fixes
-
-- Remove `createTabNavigator` from type definitions
-- Add missing types for `DrawerNavigatorConfig`
-- Use `preserveFocus` action param rather than matching on specific action types to determine if index needs to be updated if child router changes (https://github.com/react-navigation/react-navigation-core/pull/56)
-
-## [3.8.1] - [2019-04-12](https://github.com/react-navigation/react-navigation/releases/tag/3.8.1)
-
-## Changed
-
-- Add missing type for `enableURLHandling` to TypeScript definition (#5803)
-- Update Flow types (#5806)
-
-## [3.8.0] - [2019-04-12](https://github.com/react-navigation/react-navigation/releases/tag/3.8.0)
-
-## Fixes
-
-- `onRefresh` on exported lists `FlatList` and `SectionList` works as expected now (no need to add `refreshControl` prop explicitly)
-- On Android, the exported `ScrollView` is now same as the React Native ScrollView (but with scroll-to-top behavior added), whereas on iOS we still use react-native-gesture-handler ScrollView. We can change Android back to react-native-gesture-handler ScrollView when https://github.com/kmagiera/react-native-gesture-handler/issues/560 is resolved.
-- Look for `scrollResponderScrollTo` function in our ScrollView, in react-native 0.59 the interface appears to have changed for FlatList such that this is needed. (react-navigation-native#20)
-
-## Changed
-
-- Stack header style improvements for web (react-navigation-stack#104)
-
-## [3.7.1] - [2019-04-10](https://github.com/react-navigation/react-navigation/releases/tag/3.7.1)
-
-## Fixes
-
-- Update Flow types (#5800 and #5801)
-- More open `navigationOptions` types for bottom tab navigator config (#5796)
-- Fix hit slop for bottom tab bar (react-navigation-tabs#110)
-
-## Added
-
-- Add accessibility role and state to bottom bar (react-navigation-tabs#90)
-- Hide tab bar when keyboard is shown (react-navigation-tabs#112)
-- Specify default values for getAccessibilityX on tabs (react-navigation-tabs##116)
-- Add a isFirstRouteInParent method to navigation object (react-navigation-core#51)
-
-## [3.6.1] - [2019-04-02](https://github.com/react-navigation/react-navigation/releases/tag/3.6.1)
-
-## Fixed
-
-- Move event subscriptions to constructor in `withNavigationFocus` to ensure initial `didFocus` event is received.
-
-## [3.6.0] - [2019-03-31](https://github.com/react-navigation/react-navigation/releases/tag/3.6.0)
-
-## Added
-
-- Export TabBarIconProps, TabBarLabelProps, DrawerIconProps, DrawerLabelProps, ScreenProps and InitialLayout.
-- Add `disabled` prop to HeaderBackButton
-- Add `StackViewTransitionConfigs.NoAnimation`
-- Add `drawerContainerStyle` to navigator config for drawer navigator
-
-## [3.5.1] - [2019-03-19](https://github.com/react-navigation/react-navigation/releases/tag/3.5.1)
-
-## Added
-
-- Export StackGestureContext and DrawerGestureContext
-- Add missing type for withOrientation
-
-## Fixed
-
-- Fix header HeaderBackButton title TypeScript type
-
-## [3.5.0] - [2019-03-19](https://github.com/react-navigation/react-navigation/releases/tag/3.5.0)
-
-## Fixed
-
-- Fixed types for `BottomTabBar`
-- export `NavigationContext` type
-
-## Changed
-
-- Make 'react-native-gesture-handler' a peer dependency rather than a hard dependency
-
-## [3.4.1] - [2019-03-16](https://github.com/react-navigation/react-navigation/releases/tag/3.4.1)
-
-## Fixed
-
-- Fix missing TypeScript definitions file in release package
-
-## [3.4.0] - [2019-03-15](https://github.com/react-navigation/react-navigation/releases/tag/3.4.0)
-
-## Added
-
-- TypeScript type definition now included in the project.
-- Better support for react-native-web in core and stack.
-
-## Fixed
-
-- Default key to null in stack reset action (https://github.com/react-navigation/react-navigation-core/commit/59238160d86284a3353d53af10688fcf3f36004f)
-- Fix header back button label and title label scaling. Defaults to false. (https://github.com/react-navigation/react-navigation-stack/commit/c1f1dff465e9eebe274a08e274cf10570045fa23)
-
-## Changed
-
-- Remove react-lifecycles-compat from @react-navigation/core
-- NavigationPlayground uses TypeScript
-
-## [3.3.2] - [2019-02-25](https://github.com/react-navigation/react-navigation/releases/tag/3.3.2)
-
-## Fixed
-
-- Updated Flow types (https://github.com/react-navigation/react-navigation/commit/d3040e52b39bc8e91ffc1354d9c5f8c096baf597)
-
-## [3.3.1] - [2019-02-25](https://github.com/react-navigation/react-navigation/releases/tag/3.3.1)
-
-## Fixed
-
-- SafeAreaView bottom inset on iPhone XR and XS fixed. (https://github.com/react-navigation/react-navigation/issues/5625)
-
-## [3.3.0] - [2019-02-16](https://github.com/react-navigation/react-navigation/releases/tag/3.3.0)
-
-## Added
-
-- Pass through `drawerOpenProgress` to drawer content component (https://github.com/react-navigation/react-navigation-drawer/pull/40)
-
-## [3.2.3] - [2019-02-09](https://github.com/react-navigation/react-navigation/releases/tag/3.2.3)
-
-## Fixed
-
-- `await` the result of `onTransitionStart` before starting the transition (https://github.com/react-navigation/react-navigation-stack/pull/79)
-
-## [3.2.2]
-
-- Oops, I skipped it. Nothing here.
-
-## [3.2.1] - [2019-02-09](https://github.com/react-navigation/react-navigation/releases/tag/3.2.1)
-
-## Fixed
-
-- Remove accidental console.log
-
-## [3.2.0] - [2019-02-08](https://github.com/react-navigation/react-navigation/releases/tag/3.2.0)
-
-## Added
-
-- Add support for `backBehavior: history'` and `backBehavior: 'order'` to any navigator based on SwitchRouter (eg: tab navigators). (https://github.com/react-navigation/react-navigation-core/pull/31)
-
-## [3.1.5] - [2019-02-06](https://github.com/react-navigation/react-navigation/releases/tag/3.1.5)
-
-## Fixed
-
-- Revert "Transparent header measurement fix (https://github.com/react-navigation/react-navigation-stack/pull/71)"
-
-## [3.1.4] - [2019-02-05](https://github.com/react-navigation/react-navigation/releases/tag/3.1.4)
-
-## Fixed
-
-- Fix references to onGestureFinish in StackViewLayout, should be onGestureEnd
-
-## [3.1.3] - [2019-02-04](https://github.com/react-navigation/react-navigation/releases/tag/3.1.3)
-
-## Fixed
-
-- Stack navigator properly dismisses and restores keyboard when gesture starts and is cancelled
-- Transparent header measurement fix (https://github.com/react-navigation/react-navigation-stack/pull/71)
-
-## [3.1.2] - [2019-02-01](https://github.com/react-navigation/react-navigation/releases/tag/3.1.2)
-
-## Fixed
-
-- Update flow definition for `withNavigation` and `withNavigationFocus` to support `defaultProps`
-- Prevent onRef callback be called twice on withNavigationFocus components (https://github.com/react-navigation/react-navigation-core/pull/30)
-- Bump react-navigation-drawer version to improve performance - if you use Expo, you will need expo@^32.0.3 to update!
-
-## [3.0.9] - [2018-12-19](https://github.com/react-navigation/react-navigation/releases/tag/3.0.9)
-
-## Fixed
-
-- Intermittent flicker when changing tabs while using react-native-screens fixed by not changing opacity (https://github.com/react-navigation/react-navigation-tabs/pull/80)
-- Prevent fading the previous screen on push/pop on Android (https://github.com/react-navigation/react-navigation-stack/pull/73)
-
-## [3.0.8] - [2018-12-08](https://github.com/react-navigation/react-navigation/releases/tag/3.0.8)
-
-## Changed
-
-- Lock create-react-context to 0.2.2
-
-## [3.0.7] - [2018-12-08](https://github.com/react-navigation/react-navigation/releases/tag/3.0.7)
-
-## Changed
-
-- Optimize stack gesture to avoid a setState and reduce unnecessary Animated node creation (https://github.com/react-navigation/react-navigation-stack/pull/70)
-
-## [3.0.6] - [2018-12-06](https://github.com/react-navigation/react-navigation/releases/tag/3.0.6)
-
-## Fixes
-
-- Fix drawer accessibility label when drawer label is not a string
-
-## [3.0.5] - [2018-12-03](https://github.com/react-navigation/react-navigation/releases/tag/3.0.5)
-
-## Fixes
-
-- Fix crash in rare case where onNavigationStateChange on container leads to setState and container has screenProps (https://github.com/react-navigation/react-navigation/issues/5301)
-- Expose underlaying ScrollView methods to NavigationAwareScrollable (https://github.com/react-navigation/react-navigation-native/pull/8)
-
-## [3.0.4] - [2018-11-30](https://github.com/react-navigation/react-navigation/releases/tag/3.0.4)
-
-## Changed
-
-- Lock dependencies to exact versions
-
-## Fixes
-
-- Fix crash when screenInterpolator is null (https://github.com/react-navigation/react-navigation-stack/issues/64)
-- Fix renderPager override (https://github.com/react-navigation/react-navigation-tabs/pull/70)
-
-## Added
-
-- Accessibility labels on drawer items (https://github.com/react-navigation/react-navigation-drawer/pull/30)
-
-## [3.0.3] - [2018-11-30](https://github.com/react-navigation/react-navigation/releases/tag/3.0.3)
-
-## Fixes
-
-- Fix bug where if you navigate immediately when the navigator is first mounted the stack could get in an invalid state.
-- Transparent stack card factors in header height now, even though you probably won't want to use this.
-- Fix bug where shadow was still rendered on transparent stack
-- Fix gestureResponseDistance custom values being ignored for modal stack
-
-## [3.0.2] - [2018-11-27](https://github.com/react-navigation/react-navigation/releases/tag/3.0.2)
-
-## Fixes
-
-- Fix `drawerLockMode` on drawer navigator
-- Fix RTL support in drawer navigator
-
-## [3.0.1] - [2018-11-26](https://github.com/react-navigation/react-navigation/releases/tag/3.0.1)
-
-## Fixes
-
-- fix NavigationTestUtils.js deprecated file import.
-- Update `getParam` flow typings to check `key` and `fallback` arguments, as well as return the correct type automatically.
-- Fix regression in backgroundColor on cardStyle for stack navigator.
-
-## [3.0.0] - [2018-11-17](https://github.com/react-navigation/react-navigation/releases/tag/3.0.0)
-
-- Changes between the latest 2.x release and 3.0.0 are listed on the blog at https://reactnavigation.org/blog/2018/11/17/react-navigation-3.0.html
-
-# [Previous major versions]
-
-- [2.x](https://github.com/react-navigation/react-navigation/blob/2.x/CHANGELOG.md)
-
-[Unreleased]: Fixed NavigationStackScreenOptions types by adding headerTitleContainerStyle
-[Unreleased]: https://github.com/react-navigation/react-navigation/compare/3.10.0...HEAD
-[3.10.0]: https://github.com/react-navigation/react-navigation/compare/3.10.0...3.9.0
-[3.9.0]: https://github.com/react-navigation/react-navigation/compare/3.8.1...3.9.0
-[3.8.1]: https://github.com/react-navigation/react-navigation/compare/3.8.0...3.8.1
-[3.8.0]: https://github.com/react-navigation/react-navigation/compare/3.7.1...3.8.0
-[3.7.1]: https://github.com/react-navigation/react-navigation/compare/3.6.1...3.7.1
-[3.6.1]: https://github.com/react-navigation/react-navigation/compare/3.6.0...3.6.1
-[3.6.0]: https://github.com/react-navigation/react-navigation/compare/3.5.1...3.6.0
-[3.5.1]: https://github.com/react-navigation/react-navigation/compare/3.5.0...3.5.1
-[3.5.0]: https://github.com/react-navigation/react-navigation/compare/3.4.1...3.5.0
-[3.4.1]: https://github.com/react-navigation/react-navigation/compare/3.4.0...3.4.1
-[3.4.0]: https://github.com/react-navigation/react-navigation/compare/3.3.2...3.4.0
-[3.3.2]: https://github.com/react-navigation/react-navigation/compare/3.3.1...3.3.2
-[3.3.1]: https://github.com/react-navigation/react-navigation/compare/3.3.0...3.3.1
-[3.3.0]: https://github.com/react-navigation/react-navigation/compare/3.2.3...3.3.0
-[3.2.3]: https://github.com/react-navigation/react-navigation/compare/3.2.1...3.2.3
-[3.2.1]: https://github.com/react-navigation/react-navigation/compare/3.2.0...3.2.1
-[3.2.0]: https://github.com/react-navigation/react-navigation/compare/3.1.5...3.2.0
-[3.1.5]: https://github.com/react-navigation/react-navigation/compare/3.1.4...3.1.5
-[3.1.4]: https://github.com/react-navigation/react-navigation/compare/3.1.3...3.1.4
-[3.1.3]: https://github.com/react-navigation/react-navigation/compare/3.1.2...3.1.3
-[3.1.2]: https://github.com/react-navigation/react-navigation/compare/3.0.9...3.1.2
-[3.0.9]: https://github.com/react-navigation/react-navigation/compare/3.0.8...3.0.9
-[3.0.8]: https://github.com/react-navigation/react-navigation/compare/3.0.7...3.0.8
-[3.0.7]: https://github.com/react-navigation/react-navigation/compare/3.0.6...3.0.7
-[3.0.6]: https://github.com/react-navigation/react-navigation/compare/3.0.5...3.0.6
-[3.0.5]: https://github.com/react-navigation/react-navigation/compare/3.0.4...3.0.5
-[3.0.4]: https://github.com/react-navigation/react-navigation/compare/3.0.3...3.0.4
-[3.0.3]: https://github.com/react-navigation/react-navigation/compare/3.0.2...3.0.3
-[3.0.2]: https://github.com/react-navigation/react-navigation/compare/3.0.1...3.0.2
-[3.0.1]: https://github.com/react-navigation/react-navigation/compare/3.0.0...3.0.1
-[3.0.0]: https://github.com/react-navigation/react-navigation/compare/2.x...3.0.0

README.md

@@ -17,6 +17,10 @@ See: https://reactnavigation.org/docs/en/getting-started.html
 * The [Community Resources](https://github.com/react-navigation/react-navigation/blob/master/COMMUNITY_RESOURCES.md) document lists some other resources submitted to us by people who use React Navigation. Feel free to open a pull request to add your resource to the list.
 * You can contribute improvements to the documentation [in the website repository](https://github.com/react-navigation/react-navigation.github.io).
 
+## Changelog
+
+The changes for each release are outlined on [the Github releases page](https://github.com/react-navigation/react-navigation/releases).
+
 ## Try it out
 
 You can also try out the [Navigation Playground app](https://exp.host/@react-navigation/NavigationPlayground) to get a sense for some of the tools built in to React Navigation. The "Fundamentals" in the documentation also include examples you can play with.
@@ -45,4 +49,4 @@ This library has adopted a Code of Conduct that we expect project participants t
 
 ## License
 
-React Navigation is licensed under the [BSD 2-clause "Simplified" License](https://github.com/react-community/react-navigation/blob/master/LICENSE).
+React Navigation is licensed under the [MIT](https://github.com/react-community/react-navigation/blob/master/LICENSE).

example/.babelrc

@@ -1,3 +1,12 @@
 {
-  "presets": ["expo"]
+  "presets": [
+    "expo"
+  ],
+  "plugins": [
+    ["module-resolver", {
+      "alias": {
+        "react-navigation": "../src/react-navigation"
+      }
+    }]
+  ]
 }

example/README.md

@@ -0,0 +1,12 @@
+# Navigation Playground Example
+
+The NavigationPlayground example app includes a variety of patterns and is used as a simple way for contributors to manually integration test changes.
+
+## Usage
+
+```bash
+yarn bootstrap # in the react-navigation root directory
+yarn example start
+```
+
+You can view this example application directly on Android phones by visiting scanning the QR code on [this site](https://exp.host/@react-navigation/NavigationPlayground) with the [Expo app](https://play.google.com/store/apps/details?id=host.exp.exponent&hl=en).

example/app.json

@@ -5,10 +5,6 @@
     "slug": "react-navigation-stack-demo",
     "sdkVersion": "33.0.0",
     "version": "1.0.0",
-    "primaryColor": "#2196f3",
-    "packagerOpts": {
-      "config": "./metro.config.js",
-      "projectRoots": ""
-    }
+    "primaryColor": "#2196f3"
   }
 }

example/package.json

@@ -11,7 +11,7 @@
   "dependencies": {
     "@expo/vector-icons": "^10.0.0",
     "@react-native-community/masked-view": "^0.1.1",
-    "@react-navigation/core": "^3.5.0",
+    "@react-navigation/core": "^3.5.1",
     "@react-navigation/native": "^3.6.2",
     "expo": "^33.0.7",
     "expo-asset": "^5.0.1",
@@ -24,7 +24,7 @@
     "react-native-paper": "^2.15.2",
     "react-navigation-drawer": "^2.0.1",
     "react-navigation-header-buttons": "^3.0.2",
-    "react-navigation-stack": "^1.5.1",
+    "react-navigation-stack": "^1.7.2",
     "react-navigation-tabs": "^1.2.0"
   },
   "devDependencies": {

example/src/Drawer.tsx

@@ -7,7 +7,10 @@ import {
   NavigationScreenProp,
   NavigationState,
 } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import {
+  createStackNavigator,
+  NavigationStackScreenProps,
+} from 'react-navigation-stack';
 import { createDrawerNavigator } from 'react-navigation-drawer';
 import { Button } from './commonComponents/ButtonWithMargin';
 import SampleText from './SampleText';
@@ -42,17 +45,13 @@ InboxScreen.navigationOptions = {
   headerTitle: 'Inbox',
 };
 
-const EmailScreen = ({
-  navigation,
-}: {
-  navigation: NavigationScreenProp<NavigationState>;
-}) => <MyNavScreen banner="Email Screen" navigation={navigation} />;
+const EmailScreen = ({ navigation }: NavigationStackScreenProps) => (
+  <MyNavScreen banner="Email Screen" navigation={navigation} />
+);
 
-const DraftsScreen = ({
-  navigation,
-}: {
-  navigation: NavigationScreenProp<NavigationState>;
-}) => <MyNavScreen banner="Drafts Screen" navigation={navigation} />;
+const DraftsScreen = ({ navigation }: NavigationStackScreenProps) => (
+  <MyNavScreen banner="Drafts Screen" navigation={navigation} />
+);
 DraftsScreen.navigationOptions = {
   headerTitle: 'Drafts',
 };

example/src/ModalStack.tsx

@@ -6,7 +6,10 @@ import {
   SafeAreaView,
   NavigationState,
 } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import {
+  createStackNavigator,
+  NavigationStackScreenProps,
+} from 'react-navigation-stack';
 import { Button } from './commonComponents/ButtonWithMargin';
 import SampleText from './SampleText';
 
@@ -95,16 +98,13 @@ const ProfileNavigator = createStackNavigator(
   }
 );
 
-const MyHeaderTestScreen = ({
-  navigation,
-}: {
-  navigation: NavigationScreenProp<NavigationState>;
-}) => <MyNavScreen banner="Full screen view" navigation={navigation} />;
+const MyHeaderTestScreen = ({ navigation }: NavigationStackScreenProps) => (
+  <MyNavScreen banner="Full screen view" navigation={navigation} />
+);
+
 MyHeaderTestScreen.navigationOptions = ({
   navigation,
-}: {
-  navigation: NavigationScreenProp<NavigationState>;
-}) => {
+}: NavigationStackScreenProps) => {
   const headerVisible =
     navigation.state.params && navigation.state.params.headerVisible;
   return {

example/src/SimpleStack.tsx

@@ -5,15 +5,16 @@ import {
   NavigationActions,
   NavigationEventPayload,
   NavigationEventSubscription,
-  NavigationScreenProp,
-  NavigationState,
-  NavigationStateRoute,
   SafeAreaView,
   StackActions,
   Themed,
   withNavigation,
 } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import {
+  createStackNavigator,
+  NavigationStackProp,
+  NavigationStackScreenProps,
+} from 'react-navigation-stack';
 import { Button } from './commonComponents/ButtonWithMargin';
 import { HeaderButtons } from './commonComponents/HeaderButtons';
 import SampleText from './SampleText';
@@ -21,12 +22,12 @@ import SampleText from './SampleText';
 const DEBUG = false;
 
 interface MyNavScreenProps {
-  navigation: NavigationScreenProp<NavigationState>;
+  navigation: NavigationStackProp;
   banner: React.ReactNode;
 }
 
 interface BackButtonProps {
-  navigation: NavigationScreenProp<NavigationStateRoute<any>>;
+  navigation: NavigationStackProp;
 }
 
 class MyBackButton extends React.Component<BackButtonProps, any> {
@@ -99,11 +100,7 @@ class MyNavScreen extends React.Component<MyNavScreenProps> {
   }
 }
 
-interface MyHomeScreenProps {
-  navigation: NavigationScreenProp<NavigationState>;
-}
-
-class MyHomeScreen extends React.Component<MyHomeScreenProps> {
+class MyHomeScreen extends React.Component<NavigationStackScreenProps> {
   static navigationOptions = {
     title: 'Welcome',
   };
@@ -143,10 +140,7 @@ class MyHomeScreen extends React.Component<MyHomeScreenProps> {
   }
 }
 
-interface MyPhotosScreenProps {
-  navigation: NavigationScreenProp<NavigationState>;
-}
-class MyPhotosScreen extends React.Component<MyPhotosScreenProps> {
+class MyPhotosScreen extends React.Component<NavigationStackScreenProps> {
   static navigationOptions = {
     headerLeft: () => <MyBackButtonWithNavigation />,
     title: 'Photos',
@@ -195,7 +189,7 @@ class MyPhotosScreen extends React.Component<MyPhotosScreenProps> {
 const MyProfileScreen = ({
   navigation,
 }: {
-  navigation: NavigationScreenProp<NavigationState>;
+  navigation: NavigationStackProp;
 }) => (
   <MyNavScreen
     banner={`${
@@ -205,7 +199,7 @@ const MyProfileScreen = ({
   />
 );
 
-MyProfileScreen.navigationOptions = (props: MyHomeScreenProps) => {
+MyProfileScreen.navigationOptions = (props: NavigationStackScreenProps) => {
   const { navigation } = props;
   const { state, setParams } = navigation;
   const { params } = state;

example/src/StackWithCustomHeaderBackImage.tsx

@@ -3,11 +3,13 @@ import { Button, Image, StyleSheet } from 'react-native';
 import {
   NavigationScreenProp,
   NavigationState,
-  NavigationScreenConfigProps,
   Themed,
   SafeAreaView,
 } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import {
+  createStackNavigator,
+  NavigationStackScreenProps,
+} from 'react-navigation-stack';
 import SampleText from './SampleText';
 
 interface MyNavScreenProps {
@@ -124,8 +126,8 @@ const StackWithCustomHeaderBackImage = createStackNavigator(
     },
   },
   {
-    defaultNavigationOptions: ({ theme }: NavigationScreenConfigProps) => ({
-      headerBackImage: (
+    defaultNavigationOptions: ({ theme }: NavigationStackScreenProps) => ({
+      headerBackImage: () => (
         <MyCustomHeaderBackImage
           style={[
             styles.myCustomHeaderBackImageAlt,

example/src/StackWithHeaderPreset.tsx

@@ -1,19 +1,13 @@
 import * as React from 'react';
-import { StatusBar } from 'react-native';
+import { SafeAreaView, Themed } from 'react-navigation';
 import {
-  NavigationScreenProp,
-  NavigationState,
-  SafeAreaView,
-} from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+  createStackNavigator,
+  NavigationStackScreenProps,
+} from 'react-navigation-stack';
 
 import { Button } from './commonComponents/ButtonWithMargin';
 
-interface NavScreenProps {
-  navigation: NavigationScreenProp<NavigationState>;
-}
-
-class HomeScreen extends React.Component<NavScreenProps> {
+class HomeScreen extends React.Component<NavigationStackScreenProps> {
   static navigationOptions = {
     title: 'Welcome',
   };
@@ -30,13 +24,13 @@ class HomeScreen extends React.Component<NavScreenProps> {
           title="Push screen with no header"
         />
         <Button onPress={() => navigation.goBack(null)} title="Go Home" />
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </SafeAreaView>
     );
   }
 }
 
-class OtherScreen extends React.Component<NavScreenProps> {
+class OtherScreen extends React.Component<NavigationStackScreenProps> {
   static navigationOptions = {
     title: 'Your title here',
   };
@@ -57,13 +51,13 @@ class OtherScreen extends React.Component<NavScreenProps> {
         />
         <Button onPress={() => pop()} title="Pop" />
         <Button onPress={() => navigation.goBack(null)} title="Go back" />
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </SafeAreaView>
     );
   }
 }
 
-class ScreenWithLongTitle extends React.Component<NavScreenProps> {
+class ScreenWithLongTitle extends React.Component<NavigationStackScreenProps> {
   static navigationOptions = {
     title: "Another title that's kind of long",
   };
@@ -76,13 +70,13 @@ class ScreenWithLongTitle extends React.Component<NavScreenProps> {
       <SafeAreaView style={{ paddingTop: 30 }}>
         <Button onPress={() => pop()} title="Pop" />
         <Button onPress={() => navigation.goBack(null)} title="Go back" />
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </SafeAreaView>
     );
   }
 }
 
-class ScreenWithNoHeader extends React.Component<NavScreenProps> {
+class ScreenWithNoHeader extends React.Component<NavigationStackScreenProps> {
   static navigationOptions = {
     header: null,
     title: 'No Header',
@@ -97,7 +91,7 @@ class ScreenWithNoHeader extends React.Component<NavScreenProps> {
         <Button onPress={() => push('Other')} title="Push another screen" />
         <Button onPress={() => pop()} title="Pop" />
         <Button onPress={() => navigation.goBack(null)} title="Go back" />
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </SafeAreaView>
     );
   }

example/src/StackWithTranslucentHeader.tsx

@@ -5,8 +5,6 @@ import { isIphoneX } from 'react-native-iphone-x-helper';
 import {
   NavigationEventPayload,
   NavigationEventSubscription,
-  NavigationScreenProp,
-  NavigationState,
   Themed,
   SupportedThemes,
 } from 'react-navigation';
@@ -14,13 +12,15 @@ import {
   createStackNavigator,
   Header,
   HeaderStyleInterpolator,
+  NavigationStackScreenProps,
+  NavigationStackProp,
 } from 'react-navigation-stack';
 import { Button } from './commonComponents/ButtonWithMargin';
 import { HeaderButtons } from './commonComponents/HeaderButtons';
 import SampleText from './SampleText';
 
 interface MyNavScreenProps {
-  navigation: NavigationScreenProp<NavigationState>;
+  navigation: NavigationStackProp;
   banner: React.ReactNode;
 }
 
@@ -81,7 +81,7 @@ class MyNavScreen extends React.Component<MyNavScreenProps> {
 }
 
 interface MyHomeScreenProps {
-  navigation: NavigationScreenProp<NavigationState>;
+  navigation: NavigationStackProp;
 }
 
 class MyHomeScreen extends React.Component<MyHomeScreenProps> {
@@ -125,7 +125,7 @@ class MyHomeScreen extends React.Component<MyHomeScreenProps> {
 }
 
 interface MyPhotosScreenProps {
-  navigation: NavigationScreenProp<NavigationState>;
+  navigation: NavigationStackProp;
 }
 class MyPhotosScreen extends React.Component<MyPhotosScreenProps> {
   static navigationOptions = {
@@ -175,7 +175,7 @@ class MyPhotosScreen extends React.Component<MyPhotosScreenProps> {
 const MyProfileScreen = ({
   navigation,
 }: {
-  navigation: NavigationScreenProp<NavigationState>;
+  navigation: NavigationStackProp;
 }) => (
   <MyNavScreen
     banner={`${navigation.state.params!.mode === 'edit' ? 'Now Editing ' : ''}${
@@ -186,7 +186,7 @@ const MyProfileScreen = ({
 );
 
 MyProfileScreen.navigationOptions = (props: {
-  navigation: NavigationScreenProp<NavigationState>;
+  navigation: NavigationStackProp;
   theme: SupportedThemes;
 }) => {
   const { navigation, theme } = props;
@@ -226,7 +226,7 @@ const StackWithTranslucentHeader = createStackNavigator(
     },
   },
   {
-    defaultNavigationOptions: ({ theme }) => ({
+    defaultNavigationOptions: ({ theme }: NavigationStackScreenProps) => ({
       headerBackground:
         Platform.OS === 'ios' ? (
           <BlurView

example/src/StacksAndKeys.tsx

@@ -1,14 +1,13 @@
 import React from 'react';
-import { StatusBar, Text, View } from 'react-native';
-import { NavigationScreenProp, NavigationState } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import { Text, View } from 'react-native';
+import { Themed } from 'react-navigation';
+import {
+  createStackNavigator,
+  NavigationStackScreenProps,
+} from 'react-navigation-stack';
 import { Button } from './commonComponents/ButtonWithMargin';
 
-interface Props {
-  navigation: NavigationScreenProp<NavigationState & any>;
-}
-
-class HomeScreen extends React.Component<Props, any> {
+class HomeScreen extends React.Component<NavigationStackScreenProps> {
   render() {
     return (
       <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
@@ -27,15 +26,18 @@ class HomeScreen extends React.Component<Props, any> {
           title="Go back to other examples"
           onPress={() => this.props.navigation.goBack(null)}
         />
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </View>
     );
   }
 }
 
-class ProfileScreen extends React.Component<any, any> {
+class ProfileScreen extends React.Component<
+  NavigationStackScreenProps<{ homeKey: string }>
+> {
   render() {
-    const { homeKey } = this.props.navigation.state.params;
+    const homeKey = this.props.navigation.getParam('homeKey');
+
     return (
       <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
         <Text>Profile</Text>
@@ -60,7 +62,7 @@ class ProfileScreen extends React.Component<any, any> {
   }
 }
 
-class SettingsScreen extends React.Component<Props, any> {
+class SettingsScreen extends React.Component<NavigationStackScreenProps> {
   render() {
     const { homeKey } = this.props.navigation.state.params!;
 

example/src/StacksInTabs.tsx

@@ -1,12 +1,17 @@
 import React from 'react';
-import { StatusBar, Text } from 'react-native';
+import { Text } from 'react-native';
 import {
+  Themed,
   NavigationScreenProp,
   NavigationState,
   SafeAreaView,
   ScrollView,
 } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import {
+  createStackNavigator,
+  NavigationStackScreenProps,
+  NavigationStackProp,
+} from 'react-navigation-stack';
 import { createBottomTabNavigator } from 'react-navigation-tabs';
 import { Ionicons } from '@expo/vector-icons';
 import { Button } from './commonComponents/ButtonWithMargin';
@@ -18,7 +23,7 @@ Nulla convallis pulvinar hendrerit. Nulla mattis sem et aliquam ultrices. Nam eg
 Praesent lobortis elit sit amet mauris pulvinar, viverra condimentum massa pellentesque. Curabitur massa ex, dignissim eget neque at, fringilla consectetur justo. Cras sollicitudin vel ligula sed cursus. Aliquam porta sem hendrerit diam porta ultricies. Sed eu mi erat. Curabitur id justo vel tortor hendrerit vestibulum id eget est. Morbi eros magna, placerat id diam ut, varius sollicitudin mi. Curabitur pretium finibus accumsan.`;
 
 interface Props {
-  navigation: NavigationScreenProp<NavigationState>;
+  navigation: NavigationStackProp;
   banner: string;
 }
 
@@ -52,17 +57,13 @@ class MyNavScreen extends React.Component<Props> {
           ))}
         </SafeAreaView>
 
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </ScrollView>
     );
   }
 }
 
-const MyProfileScreen = ({
-  navigation,
-}: {
-  navigation: NavigationScreenProp<NavigationState>;
-}) => (
+const MyProfileScreen = ({ navigation }: NavigationStackScreenProps) => (
   <MyNavScreen
     banner={`${navigation.state.params!.name}s Profile`}
     navigation={navigation}

example/src/StacksOverTabs.tsx

@@ -7,7 +7,10 @@ import {
   NavigationState,
   SafeAreaView,
 } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import {
+  createStackNavigator,
+  NavigationStackScreenProps,
+} from 'react-navigation-stack';
 import { createBottomTabNavigator } from 'react-navigation-tabs';
 import { Button } from './commonComponents/ButtonWithMargin';
 import SampleText from './SampleText';
@@ -59,9 +62,9 @@ const MyProfileScreen = ({
 
 const MyNotificationsSettingsScreen = ({
   navigation,
-}: {
-  navigation: NavigationScreenProp<NavigationState>;
-}) => <MyNavScreen banner="Notifications Screen" navigation={navigation} />;
+}: NavigationStackScreenProps) => (
+  <MyNavScreen banner="Notifications Screen" navigation={navigation} />
+);
 
 const MySettingsScreen = ({
   navigation,
@@ -141,11 +144,7 @@ const StacksOverTabs = createStackNavigator({
     screen: MyNotificationsSettingsScreen,
   },
   Profile: {
-    navigationOptions: ({
-      navigation,
-    }: {
-      navigation: NavigationScreenProp<NavigationState>;
-    }) => ({
+    navigationOptions: ({ navigation }: NavigationStackScreenProps) => ({
       title: `${navigation.state.params!.name}'s Profile!`,
     }),
     path: '/people/:name',

example/src/StacksOverTopTabs.tsx

@@ -11,7 +11,10 @@ import {
   NavigationState,
   SafeAreaView,
 } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import {
+  createStackNavigator,
+  NavigationStackScreenProps,
+} from 'react-navigation-stack';
 import {
   createMaterialTopTabNavigator,
   MaterialTopTabBar,
@@ -64,11 +67,7 @@ const MyHomeScreen = ({
   />
 );
 
-const MyProfileScreen = ({
-  navigation,
-}: {
-  navigation: NavigationScreenProp<NavigationState>;
-}) => (
+const MyProfileScreen = ({ navigation }: NavigationStackScreenProps) => (
   <MyNavScreen
     banner={`${navigation.state.params!.name}s Profile`}
     navigation={navigation}
@@ -77,9 +76,9 @@ const MyProfileScreen = ({
 
 const MyNotificationsSettingsScreen = ({
   navigation,
-}: {
-  navigation: NavigationScreenProp<NavigationState>;
-}) => <MyNavScreen banner="Notifications Screen" navigation={navigation} />;
+}: NavigationStackScreenProps) => (
+  <MyNavScreen banner="Notifications Screen" navigation={navigation} />
+);
 
 const MySettingsScreen = ({
   navigation,
@@ -159,11 +158,7 @@ const StackNavigator = createStackNavigator(
     },
     Profile: {
       screen: MyProfileScreen,
-      navigationOptions: ({
-        navigation,
-      }: {
-        navigation: NavigationScreenProp<NavigationState>;
-      }) => ({
+      navigationOptions: ({ navigation }: NavigationStackScreenProps) => ({
         title: `${navigation.state.params!.name}'s Profile!`,
       }),
     },

example/src/SwitchWithStacks.tsx

@@ -2,16 +2,18 @@ import React from 'react';
 import {
   ActivityIndicator,
   AsyncStorage,
-  StatusBar,
   StyleSheet,
   View,
   Platform,
 } from 'react-native';
-import { createSwitchNavigator } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import { Themed, createSwitchNavigator } from 'react-navigation';
+import {
+  createStackNavigator,
+  NavigationStackScreenProps,
+} from 'react-navigation-stack';
 import { Button } from './commonComponents/ButtonWithMargin';
 
-class SignInScreen extends React.Component<any, any> {
+class SignInScreen extends React.Component<NavigationStackScreenProps> {
   static navigationOptions = {
     title: 'Please sign in',
   };
@@ -24,7 +26,7 @@ class SignInScreen extends React.Component<any, any> {
           title="Go back to other examples"
           onPress={() => this.props.navigation.goBack(null)}
         />
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </View>
     );
   }
@@ -35,7 +37,7 @@ class SignInScreen extends React.Component<any, any> {
   };
 }
 
-class HomeScreen extends React.Component<any, any> {
+class HomeScreen extends React.Component<NavigationStackScreenProps> {
   static navigationOptions = {
     title: 'Welcome to the app!',
   };
@@ -45,7 +47,7 @@ class HomeScreen extends React.Component<any, any> {
       <View style={styles.container}>
         <Button title="Show me more of the app" onPress={this.showMoreApp} />
         <Button title="Actually, sign me out :)" onPress={this.signOutAsync} />
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </View>
     );
   }
@@ -65,7 +67,7 @@ class HomeScreen extends React.Component<any, any> {
   };
 }
 
-class OtherScreen extends React.Component<any, any> {
+class OtherScreen extends React.Component<NavigationStackScreenProps> {
   static navigationOptions = {
     title: 'Lots of features here',
   };
@@ -74,7 +76,7 @@ class OtherScreen extends React.Component<any, any> {
     return (
       <View style={styles.container}>
         <Button title="I'm done, sign me out" onPress={this.signOutAsync} />
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </View>
     );
   }
@@ -105,7 +107,7 @@ class LoadingScreen extends React.Component<any, any> {
     return (
       <View style={styles.container}>
         <ActivityIndicator />
-        <StatusBar barStyle="default" />
+        <Themed.StatusBar />
       </View>
     );
   }

example/yarn.lock

@@ -918,10 +918,10 @@
   resolved "https://registry.yarnpkg.com/@react-native-community/netinfo/-/netinfo-2.0.10.tgz#d28a446352e75754b78509557988359133cdbcca"
   integrity sha512-NrIzyLe0eSbhgMnHl2QdSEhaA7yXh6p9jzMomfUa//hoTXE+xbObGDdiWWSQm2bnXnZJg8XCU3AB9qzvqcuLnA==
 
-"@react-navigation/core@^3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@react-navigation/core/-/core-3.5.0.tgz#73d1a12448e2bd71855e0080b95a7f51ede0cd9e"
-  integrity sha512-NLm24lA51R8o8c+iFnwtN9elqRzm4OJ8f1qPBCUNIYW1sb8M5yCD53vRP0fRcPFpr/6Xzs2TJMsWnnebwFp0Rw==
+"@react-navigation/core@^3.5.1":
+  version "3.5.1"
+  resolved "https://registry.yarnpkg.com/@react-navigation/core/-/core-3.5.1.tgz#7a2339fca3496979305fb3a8ab88c2ca8d8c214d"
+  integrity sha512-q7NyhWVYOhVIWqL2GZKa6G78YarXaVTTtOlSDkvy4ZIggo40wZzamlnrJRvsaQX46gsgw45FAWb5SriHh8o7eA==
   dependencies:
     hoist-non-react-statics "^3.3.0"
     path-to-regexp "^1.7.0"
@@ -4798,10 +4798,10 @@ react-navigation-header-buttons@^3.0.2:
   dependencies:
     react-native-platform-touchable "^1.1.1"
 
-react-navigation-stack@^1.5.1:
-  version "1.5.1"
-  resolved "https://registry.yarnpkg.com/react-navigation-stack/-/react-navigation-stack-1.5.1.tgz#8a8c0cd0b8498225f4e8e564f06043849961bede"
-  integrity sha512-VEMSsKvicaLlFu6+U4u5YkwFe4hnMTLu83bR15GumuqrpCVPPgl7Qt4fSZCRG/YtC5ZcUiy5EgCRu9MVIINV5w==
+react-navigation-stack@^1.7.2:
+  version "1.7.2"
+  resolved "https://registry.yarnpkg.com/react-navigation-stack/-/react-navigation-stack-1.7.2.tgz#d7cf7a7dc76c2390024be6358fc65461c848a034"
+  integrity sha512-72oL9rVXUFvFayoA7k+OgXcwP/6e5BAtCSpUXfKX+lZYrJe3BvuhZz2KDhEjdfbuP/sNok55ZRzc3/X1kh5mxQ==
   dependencies:
     prop-types "^15.7.2"
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-navigation",
-  "version": "4.0.0",
+  "version": "4.0.9",
   "description": "Routing and navigation for your React Native apps",
   "main": "src/react-navigation.js",
   "types": "typescript/react-navigation.d.ts",
@@ -31,7 +31,7 @@
     "react-native": "*"
   },
   "dependencies": {
-    "@react-navigation/core": "^3.5.0",
+    "@react-navigation/core": "^3.5.1",
     "@react-navigation/native": "^3.6.2"
   },
   "devDependencies": {

src/deprecations.js

@@ -52,7 +52,7 @@ module.exports = {
 
   get DrawerGestureContext() {
     throwError(
-      '`DrawerGestureContext` has been moved to `react-navigation-drawe`',
+      '`DrawerGestureContext` has been moved to `react-navigation-drawer`',
       'stack-navigator'
     );
   },
@@ -68,7 +68,7 @@ module.exports = {
 
   get DrawerActions() {
     throwError(
-      '`DrawerActions` has been moved to `react-navigation-drawe`',
+      '`DrawerActions` has been moved to `react-navigation-drawer`',
       'drawer-navigator'
     );
   },

src/react-navigation.js

@@ -1,4 +1,29 @@
 export * from '@react-navigation/core';
 export * from '@react-navigation/native';
 
-export * from './deprecations';
+// Export each item individually so that they can be evaluated lazily
+// https://babeljs.io/docs/en/babel-plugin-transform-modules-commonjs#lazy
+export {
+  createNavigationContainer,
+  createStackNavigator,
+  createBottomTabNavigator,
+  createMaterialTopTabNavigator,
+  createDrawerNavigator,
+  StackGestureContext,
+  DrawerGestureContext,
+  DrawerRouter,
+  DrawerActions,
+  Transitioner,
+  StackView,
+  StackViewCard,
+  StackViewTransitionConfigs,
+  Header,
+  HeaderTitle,
+  HeaderBackButton,
+  HeaderStyleInterpolator,
+  DrawerView,
+  DrawerItems,
+  DrawerSidebar,
+  BottomTabBar,
+  MaterialTopTabBar,
+} from './deprecations';

typescript/react-navigation.d.ts

@@ -33,7 +33,6 @@
 
 declare module 'react-navigation' {
   import * as React from 'react';
-  import { PanGestureHandler } from 'react-native-gesture-handler';
 
   import {
     Animated,
@@ -50,14 +49,10 @@ declare module 'react-navigation' {
   // @todo: should we re-export from RNGH? not currently exposed through it
   export { FlatList, SectionList, ScrollView } from 'react-native';
 
-  export type ScreenProps = {
-    [key: string]: any;
-  };
-
   // @todo - any..
   export function getActiveChildNavigationOptions<S>(
     navigation: NavigationProp<S>,
-    screenProps?: ScreenProps,
+    screenProps?: unknown,
     theme?: SupportedThemes
   ): NavigationParams;
 
@@ -86,7 +81,7 @@ declare module 'react-navigation' {
     routes: NavigationRoute[];
     isTransitioning: boolean;
     key: string;
-    params: NavigationParams | undefined;
+    params?: NavigationParams | undefined;
   }
 
   export interface DrawerNavigationState extends NavigationState {
@@ -138,7 +133,7 @@ declare module 'react-navigation' {
 
   export type NavigationScreenOptionsGetter<Options> = (
     navigation: NavigationScreenProp<NavigationRoute<any>>,
-    screenProps: ScreenProps | null,
+    screenProps: unknown | null,
     theme: SupportedThemes
   ) => Options;
 
@@ -169,9 +164,20 @@ declare module 'react-navigation' {
       params?: NavigationParams;
     };
 
-    getComponentForRouteName: (routeName: string) => NavigationComponent;
+    getComponentForRouteName: (
+      routeName: string
+    ) => NavigationComponent<{}, NavigationScreenProp<NavigationRoute>>;
 
-    getComponentForState: (state: State) => NavigationComponent;
+    getComponentForState: (
+      state: State
+    ) => NavigationComponent<{}, NavigationScreenProp<NavigationRoute>>;
+
+    getActionCreators: (
+      route: NavigationRoute,
+      key: string
+    ) => {
+      [key: string]: () => NavigationAction;
+    };
 
     /**
      * Gets the screen navigation options for a given screen.
@@ -184,54 +190,50 @@ declare module 'react-navigation' {
     getScreenOptions: NavigationScreenOptionsGetter<Options>;
   }
 
-  export type NavigationScreenOption<T> =
-    | T
-    | ((navigation: NavigationScreenProp<NavigationRoute>, config: T) => T);
+  export type NavigationScreenComponent<
+    Options,
+    NavigationScreenPropType
+  > = React.ComponentType<any> & {
+    navigationOptions?: NavigationScreenConfig<
+      Options,
+      NavigationScreenPropType
+    >;
+  };
 
-  export interface NavigationScreenDetails<T> {
-    options: T;
-    state: NavigationRoute;
-    navigation: NavigationScreenProp<NavigationRoute>;
-  }
-
-  export type NavigationScreenOptions = NavigationStackScreenOptions &
-    NavigationTabScreenOptions &
-    NavigationDrawerScreenOptions;
-
-  export interface NavigationScreenConfigProps {
-    navigation: NavigationScreenProp<NavigationRoute>;
+  export interface NavigationScreenConfigProps<
+    NavigationScreenPropType,
+    ScreenProps = unknown
+  > {
+    navigation: NavigationScreenPropType;
     screenProps: ScreenProps;
     theme: SupportedThemes;
   }
 
-  export type NavigationScreenConfig<Options> =
+  export type NavigationScreenConfig<
+    Options,
+    NavigationScreenPropType,
+    ScreenProps = unknown
+  > =
     | Options
     | ((
-        navigationOptionsContainer: NavigationScreenConfigProps & {
-          navigationOptions: NavigationScreenConfig<Options>;
+        navigationOptionsContainer: NavigationScreenConfigProps<
+          NavigationScreenPropType,
+          ScreenProps
+        > & {
+          navigationOptions: Options;
         }
       ) => Options);
 
-  export type NavigationComponent =
-    | NavigationScreenComponent<NavigationParams, any, any>
-    | NavigationNavigator<any, any, any>
-    | any;
-
-  export type NavigationScreenComponent<
-    Params = NavigationParams,
-    Options = {},
-    Props = {}
-  > = React.ComponentType<NavigationScreenProps<Params, Options> & Props> & {
-    navigationOptions?: NavigationScreenConfig<Options>;
-  };
+  export type NavigationComponent<Options, NavigationPropType> =
+    | NavigationScreenComponent<Options, NavigationPropType>
+    | NavigationNavigator<Options, NavigationPropType>;
 
   export type NavigationNavigator<
-    State = NavigationState,
-    Options = {},
-    Props = {}
-  > = React.ComponentType<NavigationNavigatorProps<Options, State> & Props> & {
-    router: NavigationRouter<State, Options>;
-    navigationOptions?: NavigationScreenConfig<Options>;
+    Options,
+    NavigationPropType
+  > = React.ComponentType<NavigationNavigatorProps<Options>> & {
+    router: NavigationRouter<Options>;
+    navigationOptions?: NavigationScreenConfig<Options, NavigationPropType>;
   };
 
   export interface NavigationParams {
@@ -255,6 +257,7 @@ declare module 'react-navigation' {
 
   export interface NavigationBackActionPayload {
     key?: string | null;
+    immediate?: boolean;
   }
 
   export interface NavigationBackAction extends NavigationBackActionPayload {
@@ -280,6 +283,7 @@ declare module 'react-navigation' {
 
   export interface NavigationInitAction extends NavigationInitActionPayload {
     type: 'Navigation/INIT';
+    key?: string;
   }
 
   export interface NavigationReplaceActionPayload {
@@ -300,6 +304,7 @@ declare module 'react-navigation' {
 
   export interface NavigationCompleteTransitionActionPayload {
     key?: string;
+    toChildKey?: string;
   }
 
   export interface NavigationCompleteTransitionAction {
@@ -333,6 +338,7 @@ declare module 'react-navigation' {
 
   export interface NavigationPopAction extends NavigationPopActionPayload {
     type: 'Navigation/POP';
+    key?: string;
   }
 
   export interface NavigationPopToTopActionPayload {
@@ -362,7 +368,7 @@ declare module 'react-navigation' {
 
   export interface NavigationJumpToActionPayload {
     routeName: string;
-    key: string;
+    key?: string;
     params?: NavigationParams;
   }
 
@@ -374,6 +380,16 @@ declare module 'react-navigation' {
     params?: NavigationParams;
   }
 
+  export interface NavigationDrawerOpenedAction {
+    key?: string;
+    type: 'Navigation/DRAWER_OPENED';
+  }
+
+  export interface NavigationDrawerClosedAction {
+    key?: string;
+    type: 'Navigation/DRAWER_CLOSED';
+  }
+
   export interface NavigationOpenDrawerAction {
     key?: string;
     type: 'Navigation/OPEN_DRAWER';
@@ -392,19 +408,46 @@ declare module 'react-navigation' {
   /**
    * Switch Navigator
    */
-
-  export interface SwitchRouter extends NavigationRouter {}
-
   export interface NavigationSwitchRouterConfig {
     initialRouteName?: string;
     initialRouteParams?: NavigationParams;
     paths?: NavigationPathsConfig;
-    defaultNavigationOptions?: NavigationScreenConfig<NavigationScreenOptions>;
     order?: string[];
-    backBehavior: 'none' | 'initialRoute' | 'history' | 'order'; // defaults to 'none'
+    backBehavior?: 'none' | 'initialRoute' | 'history' | 'order'; // defaults to 'none'
     resetOnBlur?: boolean; // defaults to `true`
   }
 
+  export function SwitchRouter(
+    routeConfigs: NavigationRouteConfigMap<any, any>,
+    config?: NavigationSwitchRouterConfig
+  ): NavigationRouter<any, any>;
+
+  export type NavigationSwitchProp<
+    State = NavigationRoute,
+    Params = NavigationParams
+  > = NavigationScreenProp<State, Params> & {
+    jumpTo(routeName: string, key?: string): void;
+  };
+
+  export type NavigationSwitchScreenProps<
+    Params = NavigationParams,
+    ScreenProps = unknown
+  > = {
+    theme: SupportedThemes;
+    navigation: NavigationSwitchProp<NavigationRoute, Params>;
+    screenProps: ScreenProps;
+  };
+
+  export type NavigationSwitchScreenComponent<
+    Params = NavigationParams,
+    ScreenProps = unknown
+  > = React.ComponentType<NavigationSwitchScreenProps<Params, ScreenProps>> & {
+    navigationOptions?: NavigationScreenConfig<
+      {},
+      NavigationSwitchProp<NavigationRoute, Params>,
+      ScreenProps
+    >;
+  };
 
   export type NavigationStackAction =
     | NavigationInitAction
@@ -424,6 +467,8 @@ declare module 'react-navigation' {
     | NavigationBackAction;
 
   export type NavigationDrawerAction =
+    | NavigationDrawerOpenedAction
+    | NavigationDrawerClosedAction
     | NavigationOpenDrawerAction
     | NavigationCloseDrawerAction
     | NavigationToggleDrawerAction;
@@ -435,22 +480,25 @@ declare module 'react-navigation' {
     | NavigationStackAction
     | NavigationTabAction
     | NavigationDrawerAction
-    | NavigationSwitchAction;
+    | NavigationSwitchAction
+    | { type: 'CHILD_ACTION'; key?: string };
 
-  export type NavigationRouteConfig =
-    | NavigationComponent
-    | ({
-        navigationOptions?: NavigationScreenConfig<any>;
+  export type NavigationRouteConfig<Options, NavigationScreenPropType> =
+    | NavigationComponent<Options, NavigationScreenPropType>
+    | (
+        | { screen: NavigationComponent<Options, NavigationScreenPropType> }
+        | {
+            getScreen(): NavigationScreenComponent<
+              Options,
+              NavigationScreenPropType
+            >;
+          }) & {
+        navigationOptions?: NavigationScreenConfig<
+          Options,
+          NavigationScreenPropType
+        >;
+        params?: { [key: string]: any };
         path?: string;
-      } & NavigationScreenRouteConfig);
-
-  export type NavigationScreenRouteConfig =
-    | NavigationComponent
-    | {
-        screen: NavigationComponent;
-      }
-    | {
-        getScreen: () => NavigationComponent;
       };
 
   export interface NavigationPathsConfig {
@@ -458,7 +506,7 @@ declare module 'react-navigation' {
   }
 
   // tslint:disable-next-line:strict-export-declare-modifiers
-  interface NavigationTabRouterConfigBase {
+  export interface NavigationTabRouterConfig {
     initialRouteName?: string;
     initialRouteParams?: NavigationParams;
     paths?: NavigationPathsConfig;
@@ -466,21 +514,12 @@ declare module 'react-navigation' {
     backBehavior?: 'none' | 'initialRoute' | 'history' | 'order'; // defaults to 'initialRoute'
     resetOnBlur?: boolean;
   }
-  export interface NavigationTabRouterConfig
-    extends NavigationTabRouterConfigBase {
-    defaultNavigationOptions?: NavigationScreenConfig<NavigationScreenOptions>;
-    navigationOptions?: NavigationScreenConfig<any>;
-  }
-  export interface NavigationBottomTabRouterConfig
-    extends NavigationTabRouterConfigBase {
-    defaultNavigationOptions?: NavigationScreenConfig<
-      NavigationBottomTabScreenOptions
-    >;
-    navigationOptions?: NavigationScreenConfig<any>;
-  }
 
-  export interface NavigationRouteConfigMap {
-    [routeName: string]: NavigationRouteConfig;
+  export interface NavigationRouteConfigMap<Options, NavigationScreenPropType> {
+    [routeName: string]: NavigationRouteConfig<
+      Options,
+      NavigationScreenPropType
+    >;
   }
 
   export type NavigationDispatch = (action: NavigationAction) => boolean;
@@ -513,7 +552,6 @@ declare module 'react-navigation' {
   }
 
   export interface NavigationEventsProps extends ViewProps {
-    navigation?: NavigationNavigator;
     onWillFocus?: NavigationEventCallback;
     onDidFocus?: NavigationEventCallback;
     onWillBlur?: NavigationEventCallback;
@@ -554,35 +592,27 @@ declare module 'react-navigation' {
     ): NonNullable<P[T]>;
     getParam<T extends keyof P>(param: T): P[T];
     setParams: (newParams: Partial<P>) => boolean;
+    emit: (eventName: 'refocus') => void;
     addListener: (
-      eventName: 'willBlur' | 'willFocus' | 'didFocus' | 'didBlur',
+      eventName: string,
       callback: NavigationEventCallback
     ) => NavigationEventSubscription;
-    push: (
-      routeName: string,
-      params?: NavigationParams,
-      action?: NavigationNavigateAction
-    ) => boolean;
-    replace: (
-      routeName: string,
-      params?: NavigationParams,
-      action?: NavigationNavigateAction
-    ) => boolean;
-    reset: (actions: NavigationAction[], index: number) => boolean;
-    pop: (n?: number, params?: { immediate?: boolean }) => boolean;
-    popToTop: (params?: { immediate?: boolean }) => boolean;
     isFocused: () => boolean;
     isFirstRouteInParent: () => boolean;
     router?: NavigationRouter;
     dangerouslyGetParent: () => NavigationScreenProp<S> | undefined;
   }
 
-  export interface NavigationNavigatorProps<O = {}, S = {}> {
+  export interface NavigationNavigatorProps<
+    Options = {},
+    State = {},
+    ScreenProps = unknown
+  > {
     theme?: SupportedThemes | 'no-preference';
     detached?: boolean;
-    navigation?: NavigationProp<S>;
+    navigation?: NavigationProp<State>;
     screenProps?: ScreenProps;
-    navigationOptions?: O;
+    navigationOptions?: Options;
   }
 
   export type NavigatorType =
@@ -590,7 +620,11 @@ declare module 'react-navigation' {
     | 'react-navigation/TABS'
     | 'react-navigation/DRAWER';
 
-  export interface NavigationContainerProps<S = {}, O = {}> {
+  export interface NavigationContainerProps<
+    State = {},
+    Options = {},
+    ScreenProps = unknown
+  > {
     uriPrefix?: string | RegExp;
     /**
      * Controls whether the navigation container handles URLs opened via 'Linking'
@@ -603,7 +637,7 @@ declare module 'react-navigation' {
       nextNavigationState: NavigationState,
       action: NavigationAction
     ) => void | null | undefined;
-    navigation?: NavigationScreenProp<S>;
+    navigation?: NavigationScreenProp<State>;
     /*
      * This prop is no longer supported. Use `loadNavigationState` and
      * `persistNavigationState` instead.
@@ -615,7 +649,7 @@ declare module 'react-navigation' {
 
     renderLoadingExperimental?: React.ComponentType;
     screenProps?: ScreenProps;
-    navigationOptions?: O;
+    navigationOptions?: Options;
     style?: StyleProp<ViewStyle>;
   }
 
@@ -636,25 +670,20 @@ declare module 'react-navigation' {
     ): NavigationContainerComponent;
 
     router: NavigationRouter<any, any>;
-    screenProps: ScreenProps;
+    screenProps: unknown;
     navigationOptions: any;
     state: { nav: NavigationState | null };
   }
 
-  export interface SwitchNavigatorConfig {
-    initialRouteName: string;
-    resetOnBlur?: boolean;
-    paths?: NavigationPathsConfig;
-    backBehavior?: 'none' | 'initialRoute';
-  }
-
-  // Return createNavigationContainer
-  export type _SwitchNavigatorConfig = NavigationSwitchRouterConfig;
-
   export function createSwitchNavigator(
-    routeConfigMap: NavigationRouteConfigMap,
-    switchConfig?: SwitchNavigatorConfig
-  ): NavigationContainer;
+    routeConfigMap: NavigationRouteConfigMap<{}, NavigationSwitchProp>,
+    switchConfig?: CreateNavigatorConfig<
+      {},
+      NavigationSwitchRouterConfig,
+      {},
+      NavigationSwitchProp
+    >
+  ): NavigationNavigator<{}, NavigationProp<NavigationState>>;
 
   /**
    * NavigationActions
@@ -714,7 +743,7 @@ declare module 'react-navigation' {
     ): NavigationReplaceAction;
 
     function completeTransition(
-      payload: NavigationCompleteTransitionActionPayload
+      payload?: NavigationCompleteTransitionActionPayload
     ): NavigationCompleteTransitionAction;
   }
 
@@ -735,7 +764,7 @@ declare module 'react-navigation' {
    * @desc from react-navigation/src/routers/TabRouter.js
    */
   export function TabRouter(
-    routeConfigs: NavigationRouteConfigMap,
+    routeConfigs: NavigationRouteConfigMap<any, any>,
     config: NavigationTabRouterConfig
   ): NavigationRouter<any, any>;
 
@@ -745,16 +774,14 @@ declare module 'react-navigation' {
    * @desc from react-navigation/src/routers/StackRouter.js
    */
   export function StackRouter(
-    routeConfigs: NavigationRouteConfigMap,
-    config: NavigationTabRouterConfig
+    routeConfigs: NavigationRouteConfigMap<any, any>,
+    config?: NavigationTabRouterConfig
   ): NavigationRouter<any, any>;
 
   export interface NavigationStackRouterConfig {
     initialRouteName?: string;
     initialRouteParams?: NavigationParams;
     paths?: NavigationPathsConfig;
-    defaultNavigationOptions?: NavigationScreenConfig<NavigationScreenOptions>;
-    navigationOptions?: NavigationScreenConfig<NavigationScreenOptions>;
     initialRouteKey?: string;
   }
 
@@ -763,28 +790,53 @@ declare module 'react-navigation' {
    *
    * @see https://github.com/react-navigation/react-navigation/blob/master/src/navigators/createNavigator.js
    */
-  export interface NavigationDescriptor<Params = NavigationParams> {
+  export interface NavigationDescriptor<
+    Params = NavigationParams,
+    Options = {},
+    NavigationScreenPropType = NavigationScreenProp<NavigationRoute>
+  > {
     key: string;
     state: NavigationLeafRoute<Params> | NavigationStateRoute<Params>;
-    navigation: NavigationScreenProp<any>;
-    options: NavigationScreenOptions;
+    navigation: NavigationScreenPropType;
+    options: Options;
     getComponent: () => React.ComponentType;
   }
 
-  export type NavigationView<O, S> = React.ComponentType<
+  export type NavigationView<
+    Options,
+    State,
+    ScreenProps = unknown
+  > = React.ComponentType<
     {
       descriptors: { [key: string]: NavigationDescriptor };
-      navigationConfig: O;
+      navigationConfig: Options;
       screenProps?: ScreenProps;
     } & NavigationInjectedProps
   >;
 
+  export type CreateNavigatorConfig<
+    NavigatorConfig,
+    RouterConfig,
+    Options,
+    NavigationScreenPropType
+  > = NavigatorConfig &
+    RouterConfig & {
+      defaultNavigationOptions?: NavigationScreenConfig<
+        Options,
+        NavigationScreenPropType
+      >;
+      navigationOptions?: NavigationScreenConfig<
+        { [key: string]: any },
+        NavigationScreenProp<NavigationRoute>
+      >;
+    };
+
   export function createNavigator<S, Options>(
     view: NavigationView<Options, S>,
     router: NavigationRouter<S, Options>,
-    navigatorConfig?: {} | null,
+    navigatorConfig?: {},
     navigatorType?: NavigatorType
-  ): any;
+  ): NavigationNavigator<Options, NavigationProp<NavigationState>>;
 
   /**
    * Create an HOC that injects the navigation and manages the navigation state
@@ -794,8 +846,8 @@ declare module 'react-navigation' {
    *
    * @see https://github.com/react-navigation/react-navigation/blob/master/src/createNavigationContainer.js
    */
-  export function createNavigationContainer(
-    Component: NavigationNavigator<any, any, any>
+  export function createNavigationContainer<Options, NavigationPropType>(
+    Component: NavigationNavigator<Options, NavigationPropType>
   ): NavigationContainer;
 
   /**
@@ -803,31 +855,10 @@ declare module 'react-navigation' {
    *
    * @see https://github.com/react-navigation/react-navigation-native/blob/098e2e52b349d37357109d5aee545fa74699d3d4/src/createAppContainer.js#L64
    */
-  export function createAppContainer(
-    Component: NavigationNavigator<any, any, any>
+  export function createAppContainer<Options, NavigationPropType>(
+    Component: NavigationNavigator<Options, NavigationPropType>
   ): NavigationContainer;
 
-  /**
-   * END MANUAL DEFINITIONS OUTSIDE OF TYPEDEFINITION.JS
-   */
-
-  /**
-   * BEGIN CUSTOM CONVENIENCE INTERFACES
-   */
-
-  export interface NavigationScreenProps<
-    Params = NavigationParams,
-    Options = any
-  > {
-    navigation: NavigationScreenProp<NavigationRoute<Params>, Params>;
-    screenProps?: ScreenProps;
-    navigationOptions?: NavigationScreenConfig<Options>;
-  }
-
-  /**
-   * END CUSTOM CONVENIENCE INTERFACES
-   */
-
   export type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;
 
   export type InferProps<
@@ -838,6 +869,11 @@ declare module 'react-navigation' {
     isLandscape: boolean;
   }
 
+  export function createKeyboardAwareNavigator<Props>(
+    Comp: React.ComponentType<Props>,
+    stackConfig: object
+  ): React.ComponentType<Props>;
+
   export function withOrientation<P extends NavigationOrientationInjectedProps>(
     Component: React.ComponentType<P>
   ): React.ComponentType<Omit<P, keyof NavigationOrientationInjectedProps>>;
@@ -869,6 +905,10 @@ declare module 'react-navigation' {
     T & { onRef?: React.Ref<React.Component<T & NavigationInjectedProps<P>>> }
   >;
 
+  export const NavigationProvider: React.ComponentType<{
+    value: NavigationProp<any>;
+  }>;
+
   export interface NavigationFocusInjectedProps<P = NavigationParams>
     extends NavigationInjectedProps<P> {
     isFocused: boolean;
@@ -921,17 +961,22 @@ declare module 'react-navigation' {
     NavigationScreenProp<NavigationRoute>
   >;
 
+  export function createKeyboardAwareNavigator<Props>(
+    Comp: React.ComponentType<Props>,
+    stackConfig: object
+  ): React.ComponentType<Props>;
+
   /**
    * SceneView
    */
 
   export interface SceneViewProps {
     component: React.ComponentType;
-    screenProps: ScreenProps;
-    navigation: NavigationScreenProp<NavigationRoute>;
+    screenProps: unknown;
+    navigation: NavigationProp<any>;
   }
 
-  export class SceneView extends React.Component {}
+  export const SceneView: React.ComponentType<SceneViewProps>;
 
   /**
    * Themes

yarn.lock

@@ -1076,10 +1076,10 @@
     xcode "^2.0.0"
     xmldoc "^0.4.0"
 
-"@react-navigation/core@^3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@react-navigation/core/-/core-3.5.0.tgz#73d1a12448e2bd71855e0080b95a7f51ede0cd9e"
-  integrity sha512-NLm24lA51R8o8c+iFnwtN9elqRzm4OJ8f1qPBCUNIYW1sb8M5yCD53vRP0fRcPFpr/6Xzs2TJMsWnnebwFp0Rw==
+"@react-navigation/core@^3.5.1":
+  version "3.5.1"
+  resolved "https://registry.yarnpkg.com/@react-navigation/core/-/core-3.5.1.tgz#7a2339fca3496979305fb3a8ab88c2ca8d8c214d"
+  integrity sha512-q7NyhWVYOhVIWqL2GZKa6G78YarXaVTTtOlSDkvy4ZIggo40wZzamlnrJRvsaQX46gsgw45FAWb5SriHh8o7eA==
   dependencies:
     hoist-non-react-statics "^3.3.0"
     path-to-regexp "^1.7.0"