feat: sync latest stack

react-navigation · Jun 8, 2020 · ba6d7dc · ba6d7dc
1 parent 2ca8c34
commit ba6d7dc
Show file tree

Hide file tree

Showing 14 changed files with 384 additions and 379 deletions.
diff --git a/example/src/SimpleStack.tsx b/example/src/SimpleStack.tsx
@@ -64,7 +64,7 @@ class ListScreen extends React.Component {
           flex: 1,
           alignItems: 'center',
           justifyContent: 'center',
-          backgroundColor: '#fff',
+          // backgroundColor: '#fff',
         }}
       >
         <Text>List Screen</Text>
@@ -96,7 +96,7 @@ class DetailsScreen extends React.Component<NavigationStackScreenProps> {
           flex: 1,
           alignItems: 'center',
           justifyContent: 'center',
-          backgroundColor: '#fff',
+          // backgroundColor: '#fff',
         }}
       >
         <Text>Details Screen</Text>
@@ -119,7 +119,7 @@ class HeaderlessScreen extends React.Component {
           flex: 1,
           alignItems: 'center',
           justifyContent: 'center',
-          backgroundColor: '#fff',
+          // backgroundColor: '#fff',
         }}
       >
         <Text>Headerless Screen</Text>

diff --git a/packages/stack/package.json b/packages/stack/package.json
@@ -45,7 +45,7 @@
   "devDependencies": {
     "@react-native-community/bob": "^0.10.0",
     "@react-native-community/masked-view": "^0.1.7",
-    "@react-navigation/stack": "^5.4.2",
+    "@react-navigation/stack": "^5.5.1",
     "@types/color": "^3.0.1",
     "@types/react": "^16.9.23",
     "@types/react-native": "^0.61.22",

diff --git a/packages/stack/scripts/stack.patch b/packages/stack/scripts/stack.patch
@@ -1,6 +1,6 @@
 diff -Naur ../../node_modules/@react-navigation/stack/src/index.tsx src/vendor/index.tsx
---- ../../node_modules/@react-navigation/stack/src/index.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/index.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/index.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/index.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -3,11 +3,6 @@
  import * as TransitionSpecs from './TransitionConfigs/TransitionSpecs';
  import * as TransitionPresets from './TransitionConfigs/TransitionPresets';
@@ -28,7 +28,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/index.tsx src/vendor/i
    StackHeaderLeftButtonProps,
    StackHeaderTitleProps,
 diff -Naur ../../node_modules/@react-navigation/stack/src/navigators/createStackNavigator.tsx src/vendor/navigators/createStackNavigator.tsx
---- ../../node_modules/@react-navigation/stack/src/navigators/createStackNavigator.tsx	2020-06-06 02:18:25.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/navigators/createStackNavigator.tsx	2020-06-08 11:22:56.000000000 +0200
 +++ src/vendor/navigators/createStackNavigator.tsx	1970-01-01 01:00:00.000000000 +0100
 @@ -1,96 +0,0 @@
 -import * as React from 'react';
@@ -128,8 +128,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/navigators/createStack
 -  typeof StackNavigator
 ->(StackNavigator);
 diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/types.tsx
---- ../../node_modules/@react-navigation/stack/src/types.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/types.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/types.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/types.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -8,15 +8,28 @@
  } from 'react-native';
  import { EdgeInsets } from 'react-native-safe-area-context';
@@ -218,7 +218,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/t
  };
 
  export type Layout = { width: number; height: number };
-@@ -227,24 +239,27 @@
+@@ -228,24 +240,27 @@
    /**
     * Navigation prop for the header.
     */
@@ -252,7 +252,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/t
  export type StackNavigationOptions = StackHeaderOptions &
    Partial<TransitionPreset> & {
      /**
-@@ -329,6 +344,8 @@
+@@ -330,6 +345,8 @@
        bottom?: number;
        left?: number;
      };
@@ -262,8 +262,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/t
 
  export type StackNavigationConfig = {
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/Header.tsx src/vendor/views/Header/Header.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Header/Header.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Header/Header.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/views/Header/Header.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Header/Header.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -1,12 +1,14 @@
  import * as React from 'react';
 -import { StackActions } from '@react-navigation/native';
@@ -344,8 +344,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/Header.ts
 +
 +export default Header;
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackButton.tsx src/vendor/views/Header/HeaderBackButton.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackButton.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Header/HeaderBackButton.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackButton.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Header/HeaderBackButton.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -8,9 +8,9 @@
    StyleSheet,
    LayoutChangeEvent,
@@ -358,8 +358,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBac
 
  type Props = StackHeaderLeftButtonProps;
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackground.tsx src/vendor/views/Header/HeaderBackground.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackground.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Header/HeaderBackground.tsx	2020-06-06 02:23:41.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackground.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Header/HeaderBackground.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -7,7 +7,7 @@
    StyleProp,
    ViewStyle,
@@ -370,8 +370,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBac
  type Props = ViewProps & {
    style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderContainer.tsx src/vendor/views/Header/HeaderContainer.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderContainer.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Header/HeaderContainer.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderContainer.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Header/HeaderContainer.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -1,11 +1,6 @@
  import * as React from 'react';
  import { View, StyleSheet, StyleProp, ViewStyle } from 'react-native';
@@ -385,15 +385,15 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderCon
  import { EdgeInsets } from 'react-native-safe-area-context';
 
  import Header from './Header';
-@@ -16,6 +11,7 @@
-   forSlideRight,
+@@ -17,6 +12,7 @@
  } from '../../TransitionConfigs/HeaderStyleInterpolators';
+ import HeaderShownContext from '../../utils/HeaderShownContext';
  import {
 +  Route,
    Layout,
    Scene,
    StackHeaderStyleInterpolator,
-@@ -99,9 +95,7 @@
+@@ -117,9 +113,7 @@
            insets,
            scene,
            previous,
@@ -404,7 +404,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderCon
            styleInterpolator:
              mode === 'float'
                ? isHeaderStatic
-@@ -120,7 +114,7 @@
+@@ -138,7 +132,7 @@
              key={scene.route.key}
              value={scene.descriptor.navigation}
            >
@@ -413,18 +413,18 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderCon
                <View
                  onLayout={
                    onContentHeightChange
-@@ -152,7 +146,7 @@
-                   )
-                 ) : null}
+@@ -164,7 +158,7 @@
+               >
+                 {header !== undefined ? header(props) : <Header {...props} />}
                </View>
 -            </NavigationRouteContext.Provider>
 +            </>
            </NavigationContext.Provider>
          );
        })}
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderSegment.tsx src/vendor/views/Header/HeaderSegment.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderSegment.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Header/HeaderSegment.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderSegment.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Header/HeaderSegment.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -8,7 +8,7 @@
    ViewStyle,
  } from 'react-native';
@@ -444,8 +444,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderSeg
  };
 
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderTitle.tsx src/vendor/views/Header/HeaderTitle.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderTitle.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Header/HeaderTitle.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderTitle.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Header/HeaderTitle.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -1,6 +1,6 @@
  import * as React from 'react';
  import { Animated, StyleSheet, Platform } from 'react-native';
@@ -455,8 +455,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderTit
  type Props = Omit<React.ComponentProps<typeof Animated.Text>, 'key'> & {
    tintColor?: string;
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/Card.tsx src/vendor/views/Stack/Card.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Stack/Card.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Stack/Card.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/views/Stack/Card.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Stack/Card.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -146,7 +146,7 @@
 
    private interactionHandle: number | undefined;
@@ -467,24 +467,25 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/Card.tsx s
    private animate = ({
      closing,
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardContainer.tsx src/vendor/views/Stack/CardContainer.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Stack/CardContainer.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Stack/CardContainer.tsx	2020-06-06 02:22:30.000000000 +0200
-@@ -1,10 +1,11 @@
+--- ../../node_modules/@react-navigation/stack/src/views/Stack/CardContainer.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Stack/CardContainer.tsx	2020-06-08 11:23:27.000000000 +0200
+@@ -1,11 +1,12 @@
  import * as React from 'react';
  import { Animated, View, StyleSheet, StyleProp, ViewStyle } from 'react-native';
 -import { Route, useTheme } from '@react-navigation/native';
  import { Props as HeaderContainerProps } from '../Header/HeaderContainer';
  import Card from './Card';
  import HeaderHeightContext from '../../utils/HeaderHeightContext';
+ import HeaderShownContext from '../../utils/HeaderShownContext';
 +import useTheme from '../../../utils/useTheme';
  import {
 +  Route,
    Scene,
    Layout,
    StackHeaderMode,
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack.tsx src/vendor/views/Stack/CardStack.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Stack/CardStack.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Stack/CardStack.tsx	2020-06-08 11:23:27.000000000 +0200
 @@ -7,7 +7,7 @@
    Platform,
  } from 'react-native';
@@ -494,17 +495,17 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack.
 
  import { MaybeScreenContainer, MaybeScreen } from '../Screens';
  import { getDefaultHeaderHeight } from '../Header/HeaderSegment';
-@@ -21,6 +21,7 @@
- import { forNoAnimation as forNoAnimationCard } from '../../TransitionConfigs/CardStyleInterpolators';
+@@ -22,6 +22,7 @@
+ import HeaderShownContext from '../../utils/HeaderShownContext';
  import getDistanceForDirection from '../../utils/getDistanceForDirection';
  import {
 +  Route,
    Layout,
    StackHeaderMode,
    StackCardMode,
 diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.tsx src/vendor/views/Stack/StackView.tsx
---- ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.tsx	2020-06-06 02:18:25.000000000 +0200
-+++ src/vendor/views/Stack/StackView.tsx	2020-06-06 02:22:30.000000000 +0200
+--- ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.tsx	2020-06-08 11:22:56.000000000 +0200
++++ src/vendor/views/Stack/StackView.tsx	2020-06-08 11:23:40.000000000 +0200
 @@ -2,11 +2,11 @@
  import { View, Platform, StyleSheet } from 'react-native';
  import { SafeAreaConsumer, EdgeInsets } from 'react-native-safe-area-context';
@@ -548,7 +549,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.
      }
 
      return false;
-@@ -321,24 +325,47 @@
+@@ -321,26 +325,49 @@
        return null;
      }
 
@@ -584,22 +585,24 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.
 +
    private handleOpenRoute = ({ route }: { route: Route<string> }) => {
      const { state, navigation } = this.props;
+     const { closingRouteKeys, replacingRouteKeys } = this.state;
 
 +    this.handleTransitionComplete();
 +
      if (
-       this.state.replacingRouteKeys.every((key) => key !== route.key) &&
+       closingRouteKeys.some((key) => key === route.key) &&
+       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
+       // If route isn't present in current state, but was closing, assume that a close animation was cancelled
        // So we need to add this route back to the state
 -      navigation.navigate(route);
 +      navigation.dispatch(NavigationActions.navigate(route));
      } else {
        this.setState((state) => ({
          routes: state.replacingRouteKeys.length
-@@ -364,12 +391,11 @@
+@@ -366,12 +393,11 @@
        // 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
@@ -616,7 +619,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.
        // We need to clean up any state tracking the route and pop it immediately
        this.setState((state) => ({
          routes: state.routes.filter((r) => r.key !== route.key),
-@@ -386,26 +412,29 @@
+@@ -388,26 +414,29 @@
    private handleTransitionStart = (
      { route }: { route: Route<string> },
      closing: boolean
@@ -658,16 +661,16 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.
        navigation,
        keyboardHandlingEnabled,
        mode = 'card',
-@@ -423,7 +452,7 @@
-       mode === 'card' && Platform.OS === 'ios' ? 'float' : 'screen';
+@@ -425,7 +454,7 @@
+     } = this.state;
 
      return (
 -      <NavigationHelpersContext.Provider value={navigation}>
 +      <>
          <GestureHandlerWrapper style={styles.container}>
            <SafeAreaProviderCompat>
              <SafeAreaConsumer>
-@@ -456,7 +485,7 @@
+@@ -458,7 +487,7 @@
              </SafeAreaConsumer>
            </SafeAreaProviderCompat>
          </GestureHandlerWrapper>