chore: publish

- @react-navigation/bottom-tabs@5.2.8
 - @react-navigation/compat@5.1.10
 - @react-navigation/core@5.3.5
 - @react-navigation/drawer@5.5.1
 - @react-navigation/material-bottom-tabs@5.1.10
 - @react-navigation/material-top-tabs@5.1.10
 - @react-navigation/native@5.1.7
 - @react-navigation/routers@5.4.1
 - @react-navigation/stack@5.2.14

.github/workflows/versions.yml

@@ -0,0 +1,27 @@
+name: Check versions
+on:
+  issues:
+    types: [opened]
+
+jobs:
+  check-versions:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: react-navigation/check-versions-action@master
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          packages: |
+            @react-navigation/bottom-tabs
+            @react-navigation/compat
+            @react-navigation/core
+            @react-navigation/drawer
+            @react-navigation/material-bottom-tabs
+            @react-navigation/material-top-tabs
+            @react-navigation/native
+            @react-navigation/routers
+            @react-navigation/stack
+            react-navigation-animated-switch
+            react-navigation-drawer
+            react-navigation-material-bottom-tabs
+            react-navigation-stack
+            react-navigation-tabs

example/src/Screens/CompatAPI.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { View, StyleSheet } from 'react-native';
+import { View, ScrollView, StyleSheet } from 'react-native';
 import { Button } from 'react-native-paper';
 import {
   createCompatNavigatorFactory,
@@ -11,25 +11,30 @@ import {
 } from '@react-navigation/stack';
 import Article from '../Shared/Article';
 import Albums from '../Shared/Albums';
+import NewsFeed from '../Shared/NewsFeed';
 
 type CompatStackParams = {
-  Article: { author: string };
-  Album: undefined;
+  Albums: undefined;
+  Nested: { author: string };
 };
 
-const ArticleScreen: CompatScreenType<StackNavigationProp<
-  CompatStackParams,
-  'Article'
+type NestedStackParams = {
+  Feed: undefined;
+  Article: { author: string };
+};
+
+const AlbumsScreen: CompatScreenType<StackNavigationProp<
+  CompatStackParams
 >> = ({ navigation }) => {
   return (
-    <React.Fragment>
+    <ScrollView>
       <View style={styles.buttons}>
         <Button
           mode="contained"
-          onPress={() => navigation.push('Album')}
+          onPress={() => navigation.push('Nested', { author: 'Babel fish' })}
           style={styles.button}
         >
-          Push album
+          Push nested
         </Button>
         <Button
           mode="outlined"
@@ -39,24 +44,20 @@ const ArticleScreen: CompatScreenType<StackNavigationProp<
           Go back
         </Button>
       </View>
-      <Article author={{ name: navigation.getParam('author') }} />
-    </React.Fragment>
+      <Albums scrollEnabled={false} />
+    </ScrollView>
   );
 };
 
-ArticleScreen.navigationOptions = ({ navigation }) => ({
-  title: `Article by ${navigation.getParam('author')}`,
-});
-
-const AlbumsScreen: CompatScreenType<StackNavigationProp<
-  CompatStackParams
->> = ({ navigation }) => {
+const FeedScreen: CompatScreenType<StackNavigationProp<NestedStackParams>> = ({
+  navigation,
+}) => {
   return (
-    <React.Fragment>
+    <ScrollView>
       <View style={styles.buttons}>
         <Button
           mode="contained"
-          onPress={() => navigation.push('Article', { author: 'Babel fish' })}
+          onPress={() => navigation.push('Article')}
           style={styles.button}
         >
           Push article
@@ -69,22 +70,69 @@ const AlbumsScreen: CompatScreenType<StackNavigationProp<
           Go back
         </Button>
       </View>
-      <Albums />
-    </React.Fragment>
+      <NewsFeed scrollEnabled={false} />
+    </ScrollView>
   );
 };
 
-const CompatStack = createCompatNavigatorFactory(createStackNavigator)<
+const ArticleScreen: CompatScreenType<StackNavigationProp<
+  NestedStackParams,
+  'Article'
+>> = ({ navigation }) => {
+  navigation.dangerouslyGetParent();
+  return (
+    <ScrollView>
+      <View style={styles.buttons}>
+        <Button
+          mode="contained"
+          onPress={() => navigation.push('Albums')}
+          style={styles.button}
+        >
+          Push albums
+        </Button>
+        <Button
+          mode="outlined"
+          onPress={() => navigation.goBack()}
+          style={styles.button}
+        >
+          Go back
+        </Button>
+      </View>
+      <Article
+        author={{ name: navigation.getParam('author') }}
+        scrollEnabled={false}
+      />
+    </ScrollView>
+  );
+};
+
+ArticleScreen.navigationOptions = ({ navigation }) => ({
+  title: `Article by ${navigation.getParam('author')}`,
+});
+
+const createCompatStackNavigator = createCompatNavigatorFactory(
+  createStackNavigator
+);
+
+const CompatStack = createCompatStackNavigator<
   StackNavigationProp<CompatStackParams>
 >(
   {
-    Article: {
-      screen: ArticleScreen,
+    Albums: AlbumsScreen,
+    Nested: {
+      screen: createCompatStackNavigator<
+        StackNavigationProp<NestedStackParams>
+      >(
+        {
+          Feed: FeedScreen,
+          Article: ArticleScreen,
+        },
+        { navigationOptions: { headerShown: false } }
+      ),
       params: {
         author: 'Gandalf',
       },
     },
-    Album: AlbumsScreen,
   },
   {
     mode: 'modal',

example/src/index.tsx

@@ -60,6 +60,9 @@ YellowBox.ignoreWarnings(['Require cycle:', 'Warning: Async Storage']);
 
 enableScreens();
 
+// @ts-ignore
+global.REACT_NAVIGATION_REDUX_DEVTOOLS_EXTENSION_INTEGRATION_ENABLED = true;
+
 type RootDrawerParamList = {
   Root: undefined;
   Another: undefined;

packages/bottom-tabs/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.2.8](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/compare/@react-navigation/bottom-tabs@5.2.7...@react-navigation/bottom-tabs@5.2.8) (2020-04-27)
+
+**Note:** Version bump only for package @react-navigation/bottom-tabs
+
+
+
+
+
 ## [5.2.7](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/compare/@react-navigation/bottom-tabs@5.2.6...@react-navigation/bottom-tabs@5.2.7) (2020-04-17)
 
 **Note:** Version bump only for package @react-navigation/bottom-tabs

packages/bottom-tabs/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/bottom-tabs",
   "description": "Bottom tab navigator following iOS design guidelines",
-  "version": "5.2.7",
+  "version": "5.2.8",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -35,7 +35,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.10.0",
-    "@react-navigation/native": "^5.1.6",
+    "@react-navigation/native": "^5.1.7",
     "@types/color": "^3.0.1",
     "@types/react": "^16.9.23",
     "@types/react-native": "^0.61.22",

packages/compat/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.1.10](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/compare/@react-navigation/compat@5.1.9...@react-navigation/compat@5.1.10) (2020-04-27)
+
+
+### Bug Fixes
+
+* fix typo in navigationOptions ([8cbb201](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/commit/8cbb201f1a7fb90e45a078df6bc42ce4771cc6a6))
+* spread parent params to children in compat navigator ([24febf6](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/commit/24febf6ea99be2e5f22005fdd2a82136d647255c)), closes [#6785](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/issues/6785)
+
+
+
+
+
 ## [5.1.9](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/compare/@react-navigation/compat@5.1.8...@react-navigation/compat@5.1.9) (2020-04-17)
 
 **Note:** Version bump only for package @react-navigation/compat

packages/compat/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/compat",
   "description": "Compatibility layer to write navigator definitions in static configuration format",
-  "version": "5.1.9",
+  "version": "5.1.10",
   "license": "MIT",
   "repository": "https://github.com/react-navigation/react-navigation/tree/master/packages/compat",
   "bugs": {
@@ -26,7 +26,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.10.0",
-    "@react-navigation/native": "^5.1.6",
+    "@react-navigation/native": "^5.1.7",
     "@types/react": "^16.9.23",
     "react": "~16.9.0",
     "typescript": "^3.8.3"

packages/compat/src/createCompatNavigatorFactory.tsx

@@ -7,6 +7,7 @@ import {
   NavigationProp,
   RouteProp,
   EventMapBase,
+  NavigationRouteContext,
 } from '@react-navigation/native';
 import CompatScreen from './CompatScreen';
 import ScreenPropsContext from './ScreenPropsContext';
@@ -67,6 +68,9 @@ export default function createCompatNavigatorFactory<
     const routeNames = order !== undefined ? order : Object.keys(routeConfig);
 
     function Navigator({ screenProps }: { screenProps?: unknown }) {
+      const parentRouteParams = React.useContext(NavigationRouteContext)
+        ?.params;
+
       const screens = React.useMemo(
         () =>
           routeNames.map((name) => {
@@ -135,7 +139,7 @@ export default function createCompatNavigatorFactory<
               <Pair.Screen
                 key={name}
                 name={name}
-                initialParams={initialParams}
+                initialParams={{ ...parentRouteParams, ...initialParams }}
                 options={screenOptions}
               >
                 {({ navigation, route }) => (
@@ -148,7 +152,7 @@ export default function createCompatNavigatorFactory<
               </Pair.Screen>
             );
           }),
-        [screenProps]
+        [parentRouteParams, screenProps]
       );
 
       return (
@@ -163,7 +167,7 @@ export default function createCompatNavigatorFactory<
       );
     }
 
-    Navigator.navigationOtions = parentNavigationOptions;
+    Navigator.navigationOptions = parentNavigationOptions;
 
     return Navigator;
   };

packages/core/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.3.5](https://github.com/react-navigation/react-navigation/tree/master/packages/core/compare/@react-navigation/core@5.3.4...@react-navigation/core@5.3.5) (2020-04-27)
+
+
+### Bug Fixes
+
+* add config to enable redux devtools integration ([c9c825b](https://github.com/react-navigation/react-navigation/tree/master/packages/core/commit/c9c825bee61426635a28ee149eeeff3d628171cd))
+
+
+
+
+
 ## [5.3.4](https://github.com/react-navigation/react-navigation/tree/master/packages/core/compare/@react-navigation/core@5.3.3...@react-navigation/core@5.3.4) (2020-04-17)
 
 

packages/core/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/core",
   "description": "Core utilities for building navigators",
-  "version": "5.3.4",
+  "version": "5.3.5",
   "keywords": [
     "react",
     "react-native",
@@ -29,7 +29,7 @@
     "clean": "del lib"
   },
   "dependencies": {
-    "@react-navigation/routers": "^5.4.0",
+    "@react-navigation/routers": "^5.4.1",
     "escape-string-regexp": "^2.0.0",
     "nanoid": "^3.0.2",
     "query-string": "^6.12.0",

packages/core/src/BaseNavigationContainer.tsx

@@ -21,6 +21,9 @@ import { NavigationContainerRef, NavigationContainerProps } from './types';
 
 type State = NavigationState | PartialState<NavigationState> | undefined;
 
+const DEVTOOLS_CONFIG_KEY =
+  'REACT_NAVIGATION_REDUX_DEVTOOLS_EXTENSION_INTEGRATION_ENABLED';
+
 const MISSING_CONTEXT_ERROR =
   "Couldn't find a navigation context. Have you wrapped your app with 'NavigationContainer'? See https://reactnavigation.org/docs/getting-started for setup instructions.";
 
@@ -143,7 +146,9 @@ const BaseNavigationContainer = React.forwardRef(
     );
 
     const { trackState, trackAction } = useDevTools({
-      enabled: false,
+      enabled:
+        // @ts-ignore
+        DEVTOOLS_CONFIG_KEY in global ? global[DEVTOOLS_CONFIG_KEY] : false,
       name: '@react-navigation',
       reset,
       state,

packages/drawer/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.5.1](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/compare/@react-navigation/drawer@5.5.0...@react-navigation/drawer@5.5.1) (2020-04-27)
+
+**Note:** Version bump only for package @react-navigation/drawer
+
+
+
+
+
 # [5.5.0](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/compare/@react-navigation/drawer@5.4.1...@react-navigation/drawer@5.5.0) (2020-04-17)
 
 

packages/drawer/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/drawer",
   "description": "Drawer navigator component with animated transitions and gesturess",
-  "version": "5.5.0",
+  "version": "5.5.1",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -40,7 +40,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.10.0",
-    "@react-navigation/native": "^5.1.6",
+    "@react-navigation/native": "^5.1.7",
     "@types/react": "^16.9.23",
     "@types/react-native": "^0.61.22",
     "del-cli": "^3.0.0",

packages/material-bottom-tabs/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.1.10](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/compare/@react-navigation/material-bottom-tabs@5.1.9...@react-navigation/material-bottom-tabs@5.1.10) (2020-04-27)
+
+**Note:** Version bump only for package @react-navigation/material-bottom-tabs
+
+
+
+
+
 ## [5.1.9](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/compare/@react-navigation/material-bottom-tabs@5.1.8...@react-navigation/material-bottom-tabs@5.1.9) (2020-04-17)
 
 **Note:** Version bump only for package @react-navigation/material-bottom-tabs

packages/material-bottom-tabs/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/material-bottom-tabs",
   "description": "Integration for bottom navigation component from react-native-paper",
-  "version": "5.1.9",
+  "version": "5.1.10",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -36,7 +36,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.10.0",
-    "@react-navigation/native": "^5.1.6",
+    "@react-navigation/native": "^5.1.7",
     "@types/react": "^16.9.23",
     "@types/react-native": "^0.61.22",
     "@types/react-native-vector-icons": "^6.4.5",

packages/material-top-tabs/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.1.10](https://github.com/react-navigation/react-navigation/tree/master/packages/material-top-tabs/compare/@react-navigation/material-top-tabs@5.1.9...@react-navigation/material-top-tabs@5.1.10) (2020-04-27)
+
+**Note:** Version bump only for package @react-navigation/material-top-tabs
+
+
+
+
+
 ## [5.1.9](https://github.com/react-navigation/react-navigation/tree/master/packages/material-top-tabs/compare/@react-navigation/material-top-tabs@5.1.8...@react-navigation/material-top-tabs@5.1.9) (2020-04-17)
 
 **Note:** Version bump only for package @react-navigation/material-top-tabs

packages/material-top-tabs/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/material-top-tabs",
   "description": "Integration for the animated tab view component from react-native-tab-view",
-  "version": "5.1.9",
+  "version": "5.1.10",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -39,7 +39,7 @@
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.10.0",
-    "@react-navigation/native": "^5.1.6",
+    "@react-navigation/native": "^5.1.7",
     "@types/react": "^16.9.23",
     "@types/react-native": "^0.61.22",
     "del-cli": "^3.0.0",

packages/native/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.1.7](https://github.com/react-navigation/react-navigation/tree/master/packages/native/compare/@react-navigation/native@5.1.6...@react-navigation/native@5.1.7) (2020-04-27)
+
+**Note:** Version bump only for package @react-navigation/native
+
+
+
+
+
 ## [5.1.6](https://github.com/react-navigation/react-navigation/tree/master/packages/native/compare/@react-navigation/native@5.1.5...@react-navigation/native@5.1.6) (2020-04-17)
 
 

packages/native/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/native",
   "description": "React Native integration for React Navigation",
-  "version": "5.1.6",
+  "version": "5.1.7",
   "keywords": [
     "react-native",
     "react-navigation",
@@ -31,7 +31,7 @@
     "clean": "del lib"
   },
   "dependencies": {
-    "@react-navigation/core": "^5.3.4"
+    "@react-navigation/core": "^5.3.5"
   },
   "devDependencies": {
     "@react-native-community/bob": "^0.10.0",

packages/routers/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.4.1](https://github.com/react-navigation/react-navigation/tree/master/packages/routers/compare/@react-navigation/routers@5.4.0...@react-navigation/routers@5.4.1) (2020-04-27)
+
+
+### Bug Fixes
+
+* fix behaviour of openByDefault in drawer when focus changes ([b172b51](https://github.com/react-navigation/react-navigation/tree/master/packages/routers/commit/b172b51f175a9f8044cb2a8e9d74a86480d8f11e))
+
+
+
+
+
 # [5.4.0](https://github.com/react-navigation/react-navigation/tree/master/packages/routers/compare/@react-navigation/routers@5.3.0...@react-navigation/routers@5.4.0) (2020-04-17)
 
 

packages/routers/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/routers",
   "description": "Routers to help build custom navigators",
-  "version": "5.4.0",
+  "version": "5.4.1",
   "keywords": [
     "react",
     "react-native",

packages/routers/src/DrawerRouter.tsx

@@ -153,6 +153,10 @@ export default function DrawerRouter({
     getStateForRouteFocus(state, key) {
       const result = router.getStateForRouteFocus(state, key);
 
+      if (openByDefault) {
+        return openDrawer(result);
+      }
+
       return closeDrawer(result);
     },
 

packages/routers/src/__tests__/TabRouter.test.tsx

@@ -214,6 +214,161 @@ it("doesn't rehydrate state if it's not stale", () => {
   ).toBe(state);
 });
 
+it('restores correct history on rehydrating with backBehavior: order', () => {
+  const router = TabRouter({ backBehavior: 'order' });
+
+  const options = {
+    routeNames: ['foo', 'bar', 'baz', 'qux'],
+    routeParamList: {},
+  };
+
+  expect(
+    router.getRehydratedState(
+      {
+        index: 2,
+        routes: [
+          { key: 'foo-0', name: 'foo' },
+          { key: 'bar-0', name: 'bar' },
+          { key: 'baz-0', name: 'baz' },
+          { key: 'qux-0', name: 'qux' },
+        ],
+      },
+      options
+    )
+  ).toEqual({
+    key: 'tab-test',
+    index: 2,
+    routeNames: ['foo', 'bar', 'baz', 'qux'],
+    routes: [
+      { key: 'foo-0', name: 'foo' },
+      { key: 'bar-0', name: 'bar' },
+      { key: 'baz-0', name: 'baz' },
+      { key: 'qux-0', name: 'qux' },
+    ],
+    history: [
+      { key: 'foo-0', type: 'route' },
+      { key: 'bar-0', type: 'route' },
+      { key: 'baz-0', type: 'route' },
+    ],
+    stale: false,
+    type: 'tab',
+  });
+});
+
+it('restores correct history on rehydrating with backBehavior: history', () => {
+  const router = TabRouter({ backBehavior: 'history' });
+
+  const options = {
+    routeNames: ['foo', 'bar', 'baz', 'qux'],
+    routeParamList: {},
+  };
+
+  expect(
+    router.getRehydratedState(
+      {
+        index: 2,
+        routes: [
+          { key: 'foo-0', name: 'foo' },
+          { key: 'bar-0', name: 'bar' },
+          { key: 'baz-0', name: 'baz' },
+          { key: 'qux-0', name: 'qux' },
+        ],
+      },
+      options
+    )
+  ).toEqual({
+    key: 'tab-test',
+    index: 2,
+    routeNames: ['foo', 'bar', 'baz', 'qux'],
+    routes: [
+      { key: 'foo-0', name: 'foo' },
+      { key: 'bar-0', name: 'bar' },
+      { key: 'baz-0', name: 'baz' },
+      { key: 'qux-0', name: 'qux' },
+    ],
+    history: [{ key: 'baz-0', type: 'route' }],
+    stale: false,
+    type: 'tab',
+  });
+});
+
+it('restores correct history on rehydrating with backBehavior: initialRoute', () => {
+  const router = TabRouter({ backBehavior: 'initialRoute' });
+
+  const options = {
+    routeNames: ['foo', 'bar', 'baz', 'qux'],
+    routeParamList: {},
+  };
+
+  expect(
+    router.getRehydratedState(
+      {
+        index: 2,
+        routes: [
+          { key: 'foo-0', name: 'foo' },
+          { key: 'bar-0', name: 'bar' },
+          { key: 'baz-0', name: 'baz' },
+          { key: 'qux-0', name: 'qux' },
+        ],
+      },
+      options
+    )
+  ).toEqual({
+    key: 'tab-test',
+    index: 2,
+    routeNames: ['foo', 'bar', 'baz', 'qux'],
+    routes: [
+      { key: 'foo-0', name: 'foo' },
+      { key: 'bar-0', name: 'bar' },
+      { key: 'baz-0', name: 'baz' },
+      { key: 'qux-0', name: 'qux' },
+    ],
+    history: [
+      { key: 'foo-0', type: 'route' },
+      { key: 'baz-0', type: 'route' },
+    ],
+    stale: false,
+    type: 'tab',
+  });
+});
+
+it('restores correct history on rehydrating with backBehavior: none', () => {
+  const router = TabRouter({ backBehavior: 'none' });
+
+  const options = {
+    routeNames: ['foo', 'bar', 'baz', 'qux'],
+    routeParamList: {},
+  };
+
+  expect(
+    router.getRehydratedState(
+      {
+        index: 2,
+        routes: [
+          { key: 'foo-0', name: 'foo' },
+          { key: 'bar-0', name: 'bar' },
+          { key: 'baz-0', name: 'baz' },
+          { key: 'qux-0', name: 'qux' },
+        ],
+      },
+      options
+    )
+  ).toEqual({
+    key: 'tab-test',
+    index: 2,
+    routeNames: ['foo', 'bar', 'baz', 'qux'],
+    routes: [
+      { key: 'foo-0', name: 'foo' },
+      { key: 'bar-0', name: 'bar' },
+      { key: 'baz-0', name: 'baz' },
+      { key: 'qux-0', name: 'qux' },
+    ],
+    history: [{ key: 'baz-0', type: 'route' }],
+    stale: false,
+    type: 'tab',
+  });
+});
+
 it('gets state on route names change', () => {
   const router = TabRouter({});
 
@@ -254,6 +409,38 @@ it('gets state on route names change', () => {
     stale: false,
     type: 'tab',
   });
+
+  expect(
+    router.getStateForRouteNamesChange(
+      {
+        index: 0,
+        key: 'tab-test',
+        routeNames: ['bar', 'baz'],
+        routes: [
+          { key: 'bar-test', name: 'bar' },
+          { key: 'baz-test', name: 'baz', params: { answer: 42 } },
+        ],
+        history: [{ type: 'route', key: 'bar-test' }],
+        stale: false,
+        type: 'tab',
+      },
+      {
+        routeNames: ['foo', 'fiz'],
+        routeParamList: {},
+      }
+    )
+  ).toEqual({
+    index: 0,
+    key: 'tab-test',
+    routeNames: ['foo', 'fiz'],
+    routes: [
+      { key: 'foo-test', name: 'foo' },
+      { key: 'fiz-test', name: 'fiz' },
+    ],
+    history: [{ type: 'route', key: 'foo-test' }],
+    stale: false,
+    type: 'tab',
+  });
 });
 
 it('preserves focused route on route names change', () => {

packages/stack/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.2.14](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.2.13...@react-navigation/stack@5.2.14) (2020-04-27)
+
+
+### Bug Fixes
+
+* don't add back the route being replaced ([a695cf9](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/commit/a695cf9c058521ccb4a83eb206dc0da7ce100032))
+
+
+
+
+
+## [5.2.12](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.2.11...@react-navigation/stack@5.2.12) (2020-04-22)
+
+
+### Bug Fixes
+
+* animate card to existing closing state on gesture end ([78485ce](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/commit/78485cea6939b9ffec76e0c4b410bc426ed93402)), closes [#7938](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/issues/7938)
+
+
+
+
+
 ## [5.2.11](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.2.10...@react-navigation/stack@5.2.11) (2020-04-17)
 
 

packages/stack/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/stack",
   "description": "Stack navigator component for iOS and Android with animated transitions and gestures",
-  "version": "5.2.11",
+  "version": "5.2.14",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -40,7 +40,7 @@
   "devDependencies": {
     "@react-native-community/bob": "^0.10.0",
     "@react-native-community/masked-view": "^0.1.7",
-    "@react-navigation/native": "^5.1.6",
+    "@react-navigation/native": "^5.1.7",
     "@types/color": "^3.0.1",
     "@types/react": "^16.9.23",
     "@types/react-native": "^0.61.22",

packages/stack/src/views/MaskedView.native.tsx

@@ -1,17 +1,26 @@
 import * as React from 'react';
 import { UIManager } from 'react-native';
-import RNCMaskedView from '@react-native-community/masked-view';
 
-type Props = React.ComponentProps<typeof RNCMaskedView> & {
+type MaskedViewType = typeof import('@react-native-community/masked-view').default;
+
+type Props = React.ComponentProps<MaskedViewType> & {
   children: React.ReactElement;
 };
 
+let RNCMaskedView: MaskedViewType | undefined;
+
+try {
+  RNCMaskedView = require('@react-native-community/masked-view').default;
+} catch (e) {
+  // Ignore
+}
+
 const isMaskedViewAvailable =
   // @ts-ignore
   UIManager.getViewManagerConfig('RNCMaskedView') != null;
 
 export default function MaskedView({ children, ...rest }: Props) {
-  if (isMaskedViewAvailable) {
+  if (isMaskedViewAvailable && RNCMaskedView) {
     return <RNCMaskedView {...rest}>{children}</RNCMaskedView>;
   }
 

packages/stack/src/views/Screens.tsx

@@ -0,0 +1,71 @@
+import * as React from 'react';
+import { Animated, View, Platform, ViewProps } from 'react-native';
+
+let Screens: typeof import('react-native-screens') | undefined;
+
+try {
+  Screens = require('react-native-screens');
+} catch (e) {
+  // Ignore
+}
+
+// The web implementation in react-native-screens seems buggy.
+// The view doesn't become visible after coming back in some cases.
+// So we use our custom implementation.
+class WebScreen extends React.Component<
+  ViewProps & {
+    active: number;
+    children: React.ReactNode;
+  }
+> {
+  render() {
+    const { active, style, ...rest } = this.props;
+
+    return (
+      <View
+        // @ts-ignore
+        hidden={!active}
+        style={[style, { display: active ? 'flex' : 'none' }]}
+        {...rest}
+      />
+    );
+  }
+}
+
+const AnimatedWebScreen = Animated.createAnimatedComponent(WebScreen);
+
+export const MaybeScreenContainer = ({
+  enabled,
+  ...rest
+}: ViewProps & {
+  enabled: boolean;
+  children: React.ReactNode;
+}) => {
+  if (enabled && Platform.OS !== 'web' && Screens && Screens.screensEnabled()) {
+    return <Screens.ScreenContainer {...rest} />;
+  }
+
+  return <View {...rest} />;
+};
+
+export const MaybeScreen = ({
+  enabled,
+  active,
+  ...rest
+}: ViewProps & {
+  enabled: boolean;
+  active: number | Animated.AnimatedInterpolation;
+  children: React.ReactNode;
+}) => {
+  if (enabled && Platform.OS === 'web') {
+    // @ts-ignore
+    return <AnimatedWebScreen active={active} {...rest} />;
+  }
+
+  if (enabled && Screens && Screens.screensEnabled()) {
+    // @ts-ignore
+    return <Screens.Screen active={active} {...rest} />;
+  }
+
+  return <View {...rest} />;
+};

packages/stack/src/views/Stack/Card.tsx

@@ -286,7 +286,7 @@ export default class Card extends React.Component<Props> {
             getInvertedMultiplier(gestureDirection) >
           distance / 2
             ? velocity !== 0 || translation !== 0
-            : false;
+            : this.props.closing;
 
         this.animate({ closing, velocity });
 

packages/stack/src/views/Stack/CardStack.tsx

@@ -1,18 +1,15 @@
 import * as React from 'react';
 import {
   Animated,
-  View,
   StyleSheet,
   LayoutChangeEvent,
   Dimensions,
   Platform,
-  ViewProps,
 } from 'react-native';
 import { EdgeInsets } from 'react-native-safe-area-context';
-// eslint-disable-next-line import/no-unresolved
-import { ScreenContainer, Screen, screensEnabled } from 'react-native-screens'; // Import with * as to prevent getters being called
 import { Route, StackNavigationState } from '@react-navigation/native';
 
+import { MaybeScreenContainer, MaybeScreen } from '../Screens';
 import { getDefaultHeaderHeight } from '../Header/HeaderSegment';
 import { Props as HeaderContainerProps } from '../Header/HeaderContainer';
 import CardContainer from './CardContainer';
@@ -75,67 +72,6 @@ type State = {
 
 const EPSILON = 0.01;
 
-// The web implementation in react-native-screens seems buggy.
-// The view doesn't become visible after coming back in some cases.
-// So we use our custom implementation.
-class WebScreen extends React.Component<
-  ViewProps & {
-    active: number;
-    children: React.ReactNode;
-  }
-> {
-  render() {
-    const { active, style, ...rest } = this.props;
-
-    return (
-      <View
-        // @ts-ignore
-        hidden={!active}
-        style={[style, { display: active ? 'flex' : 'none' }]}
-        {...rest}
-      />
-    );
-  }
-}
-
-const AnimatedWebScreen = Animated.createAnimatedComponent(WebScreen);
-
-const MaybeScreenContainer = ({
-  enabled,
-  ...rest
-}: ViewProps & {
-  enabled: boolean;
-  children: React.ReactNode;
-}) => {
-  if (enabled && Platform.OS !== 'web' && screensEnabled()) {
-    return <ScreenContainer {...rest} />;
-  }
-
-  return <View {...rest} />;
-};
-
-const MaybeScreen = ({
-  enabled,
-  active,
-  ...rest
-}: ViewProps & {
-  enabled: boolean;
-  active: number | Animated.AnimatedInterpolation;
-  children: React.ReactNode;
-}) => {
-  if (enabled && Platform.OS === 'web') {
-    // @ts-ignore
-    return <AnimatedWebScreen active={active} {...rest} />;
-  }
-
-  if (enabled && screensEnabled()) {
-    // @ts-ignore
-    return <Screen active={active} {...rest} />;
-  }
-
-  return <View {...rest} />;
-};
-
 const FALLBACK_DESCRIPTOR = Object.freeze({ options: {} });
 
 const getHeaderHeights = (

packages/stack/src/views/Stack/StackView.tsx

@@ -147,7 +147,7 @@ export default class StackView extends React.Component<Props, State> {
       // We only need to animate routes if the focused route changed
       // Animating previous routes won't be visible coz the focused route is on top of everything
 
-      if (!previousRoutes.find((r) => r.key === nextFocusedRoute.key)) {
+      if (!previousRoutes.some((r) => r.key === nextFocusedRoute.key)) {
         // A new route has come to the focus, we treat this as a push
         // A replace can also trigger this, the animation should look like push
 
@@ -166,7 +166,7 @@ export default class StackView extends React.Component<Props, State> {
             (key) => key !== nextFocusedRoute.key
           );
 
-          if (!routes.find((r) => r.key === previousFocusedRoute.key)) {
+          if (!routes.some((r) => r.key === previousFocusedRoute.key)) {
             // The previous focused route isn't present in state, we treat this as a replace
 
             openingRouteKeys = openingRouteKeys.filter(
@@ -206,7 +206,7 @@ export default class StackView extends React.Component<Props, State> {
             }
           }
         }
-      } else if (!routes.find((r) => r.key === previousFocusedRoute.key)) {
+      } else if (!routes.some((r) => r.key === previousFocusedRoute.key)) {
         // The previously focused route was removed, we treat this as a pop
 
         if (
@@ -328,24 +328,38 @@ export default class StackView extends React.Component<Props, State> {
   };
 
   private handleOpenRoute = ({ route }: { route: Route<string> }) => {
-    this.setState((state) => ({
-      routes: state.replacingRouteKeys.length
-        ? state.routes.filter((r) => !state.replacingRouteKeys.includes(r.key))
-        : state.routes,
-      openingRouteKeys: state.openingRouteKeys.filter(
-        (key) => key !== route.key
-      ),
-      closingRouteKeys: state.closingRouteKeys.filter(
-        (key) => key !== route.key
-      ),
-      replacingRouteKeys: [],
-    }));
+    const { state, navigation } = this.props;
+
+    if (
+      this.state.replacingRouteKeys.every((key) => key !== route.key) &&
+      state.routeNames.includes(route.name) &&
+      !state.routes.some((r) => r.key === route.key)
+    ) {
+      // If route isn't present in current state, assume that a close animation was cancelled
+      // So we need to add this route back to the state
+      navigation.navigate(route);
+    } else {
+      this.setState((state) => ({
+        routes: state.replacingRouteKeys.length
+          ? state.routes.filter(
+              (r) => !state.replacingRouteKeys.includes(r.key)
+            )
+          : state.routes,
+        openingRouteKeys: state.openingRouteKeys.filter(
+          (key) => key !== route.key
+        ),
+        closingRouteKeys: state.closingRouteKeys.filter(
+          (key) => key !== route.key
+        ),
+        replacingRouteKeys: [],
+      }));
+    }
   };
 
   private handleCloseRoute = ({ route }: { route: Route<string> }) => {
     const { state, navigation } = this.props;
 
-    if (state.routes.find((r) => r.key === route.key)) {
+    if (state.routes.some((r) => r.key === route.key)) {
       // If a route exists in state, trigger a pop
       // This will happen in when the route was closed from the card component
       // e.g. When the close animation triggered from a gesture ends