diff --git a/packages/stack/package.json b/packages/stack/package.json index a2e24617..23d8e6d9 100644 --- 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.2.16", + "@react-navigation/stack": "^5.3.3", "@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 index 080be012..dcb9a293 100644 --- 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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/index.tsx 2020-05-01 01:32:40.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/index.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/index.tsx 2020-05-11 18:29:57.000000000 +0200 @@ -3,11 +3,6 @@ import * as TransitionSpecs from './TransitionConfigs/TransitionSpecs'; import * as TransitionPresets from './TransitionConfigs/TransitionPresets'; @@ -13,12 +13,13 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/index.tsx src/vendor/i export const Assets = [ // eslint-disable-next-line import/no-commonjs require('./views/assets/back-icon.png'), -@@ -49,8 +44,10 @@ +@@ -49,9 +44,10 @@ * Types */ export type { - StackNavigationOptions, - StackNavigationProp, +- StackScreenProps, + NavigationStackState, + StackNavigationProp as NavigationStackProp, + StackNavigationOptions as NavigationStackOptions, @@ -27,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-05-01 01:29:42.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/navigators/createStackNavigator.tsx 2020-05-11 17:55:45.000000000 +0200 +++ src/vendor/navigators/createStackNavigator.tsx 1970-01-01 01:00:00.000000000 +0100 @@ -1,96 +0,0 @@ -import * as React from 'react'; @@ -127,9 +128,9 @@ 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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/types.tsx 2020-05-01 01:32:40.000000000 +0200 -@@ -8,14 +8,28 @@ +--- ../../node_modules/@react-navigation/stack/src/types.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/types.tsx 2020-05-11 18:29:52.000000000 +0200 +@@ -8,15 +8,28 @@ } from 'react-native'; import { EdgeInsets } from 'react-native-safe-area-context'; import { @@ -143,6 +144,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/t - NavigationHelpers, - StackNavigationState, - StackActionHelpers, +- RouteProp, -} from '@react-navigation/native'; + NavigationParams, + NavigationNavigateAction, @@ -165,7 +167,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/t export type StackNavigationEventMap = { /** -@@ -28,22 +42,29 @@ +@@ -29,29 +42,28 @@ transitionEnd: { data: { closing: boolean } }; }; @@ -186,6 +188,13 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/t - StackNavigationEventMap -> & - StackActionHelpers; +- +-export type StackScreenProps< +- ParamList extends ParamListBase, +- RouteName extends keyof ParamList = string +-> = { +- navigation: StackNavigationProp; +- route: RouteProp; + State = NavigationRoute, + Params = NavigationParams +> = NavigationScreenProp & { @@ -206,11 +215,10 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/t + event: NavigationStackEventName, + callback: NavigationEventCallback + ) => NavigationEventSubscription; -+}; + }; export type Layout = { width: number; height: number }; - -@@ -218,24 +239,27 @@ +@@ -227,24 +239,27 @@ /** * Navigation prop for the header. */ @@ -244,7 +252,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/t export type StackNavigationOptions = StackHeaderOptions & Partial & { /** -@@ -320,6 +344,8 @@ +@@ -329,6 +344,8 @@ bottom?: number; left?: number; }; @@ -254,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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Header/Header.tsx 2020-05-01 01:32:40.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/views/Header/Header.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Header/Header.tsx 2020-05-11 18:16:24.000000000 +0200 @@ -1,12 +1,14 @@ import * as React from 'react'; -import { StackActions } from '@react-navigation/native'; @@ -283,7 +291,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/Header.ts let leftLabel; -@@ -38,17 +40,12 @@ +@@ -38,18 +40,13 @@ ? o.headerTitle : o.title !== undefined ? o.title @@ -291,6 +299,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/Header.ts + : previous.route.routeName; } + // eslint-disable-next-line react-hooks/exhaustive-deps const goBack = React.useCallback( debounce(() => { - if (navigation.isFocused() && navigation.canGoBack()) { @@ -303,7 +312,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/Header.ts }, 50), [navigation, scene.route.key] ); -@@ -63,7 +60,10 @@ +@@ -64,7 +61,10 @@ leftLabel={leftLabel} headerTitle={ typeof options.headerTitle !== 'function' @@ -315,7 +324,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/Header.ts : options.headerTitle } onGoBack={previous ? goBack : undefined} -@@ -71,3 +71,18 @@ +@@ -72,3 +72,18 @@ /> ); }); @@ -335,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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Header/HeaderBackButton.tsx 2020-05-01 01:33:40.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackButton.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Header/HeaderBackButton.tsx 2020-05-11 18:05:10.000000000 +0200 @@ -8,9 +8,9 @@ StyleSheet, LayoutChangeEvent, @@ -349,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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Header/HeaderBackground.tsx 2020-05-01 01:32:40.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackground.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Header/HeaderBackground.tsx 2020-05-11 18:05:10.000000000 +0200 @@ -1,6 +1,6 @@ import * as React from 'react'; import { Animated, StyleSheet, Platform, ViewProps } from 'react-native'; @@ -360,8 +369,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBac type Props = ViewProps & { children?: React.ReactNode; 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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Header/HeaderContainer.tsx 2020-05-01 01:32:40.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderContainer.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Header/HeaderContainer.tsx 2020-05-11 18:05:10.000000000 +0200 @@ -1,11 +1,6 @@ import * as React from 'react'; import { View, StyleSheet, StyleProp, ViewStyle } from 'react-native'; @@ -413,8 +422,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderCon ); })} 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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Header/HeaderSegment.tsx 2020-05-01 01:32:40.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderSegment.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Header/HeaderSegment.tsx 2020-05-11 18:17:37.000000000 +0200 @@ -8,7 +8,7 @@ ViewStyle, } from 'react-native'; @@ -434,19 +443,19 @@ 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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Header/HeaderTitle.tsx 2020-05-01 01:32:40.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderTitle.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Header/HeaderTitle.tsx 2020-05-11 18:17:37.000000000 +0200 @@ -1,6 +1,6 @@ import * as React from 'react'; import { Animated, StyleSheet, Platform } from 'react-native'; -import { useTheme } from '@react-navigation/native'; +import useTheme from '../../../utils/useTheme'; - type Props = React.ComponentProps & { + type Props = Omit, '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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Stack/Card.tsx 2020-05-01 01:32:40.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/views/Stack/Card.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Stack/Card.tsx 2020-05-11 18:05:10.000000000 +0200 @@ -140,7 +140,7 @@ private interactionHandle: number | undefined; @@ -457,9 +466,9 @@ 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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Stack/CardContainer.tsx 2020-05-01 01:34:25.000000000 +0200 -@@ -1,14 +1,14 @@ +--- ../../node_modules/@react-navigation/stack/src/views/Stack/CardContainer.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Stack/CardContainer.tsx 2020-05-11 18:33:41.000000000 +0200 +@@ -1,10 +1,11 @@ import * as React from 'react'; import { Animated, View, StyleSheet, StyleProp, ViewStyle } from 'react-native'; -import { Route, useTheme } from '@react-navigation/native'; @@ -472,11 +481,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardContai Scene, Layout, StackHeaderMode, -- StackCardMode, - TransitionPreset, - } from '../../types'; - -@@ -192,7 +192,7 @@ +@@ -192,7 +193,7 @@ ? { marginTop: headerHeight } : null } @@ -486,8 +491,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardContai > 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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Stack/CardStack.tsx 2020-05-01 01:32:40.000000000 +0200 +--- ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Stack/CardStack.tsx 2020-05-11 18:05:10.000000000 +0200 @@ -7,7 +7,7 @@ Platform, } from 'react-native'; @@ -506,11 +511,13 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack. 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-05-01 01:29:42.000000000 +0200 -+++ src/vendor/views/Stack/StackView.tsx 2020-05-01 01:37:12.000000000 +0200 -@@ -4,9 +4,10 @@ +--- ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.tsx 2020-05-11 17:55:45.000000000 +0200 ++++ src/vendor/views/Stack/StackView.tsx 2020-05-11 18:30:19.000000000 +0200 +@@ -2,11 +2,11 @@ + import { View, Platform, StyleSheet } from 'react-native'; + import { SafeAreaConsumer, EdgeInsets } from 'react-native-safe-area-context'; import { - NavigationHelpersContext, +- NavigationHelpersContext, StackActions, - StackNavigationState, - Route, @@ -522,7 +529,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView. import { GestureHandlerRootView } from '../GestureHandler'; import CardStack from './CardStack'; -@@ -16,6 +17,7 @@ +@@ -16,6 +16,7 @@ } from '../Header/HeaderContainer'; import SafeAreaProviderCompat from '../SafeAreaProviderCompat'; import { @@ -530,7 +537,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView. StackNavigationHelpers, StackNavigationConfig, StackDescriptorMap, -@@ -25,6 +27,7 @@ +@@ -25,6 +26,7 @@ state: StackNavigationState; navigation: StackNavigationHelpers; descriptors: StackDescriptorMap; @@ -538,7 +545,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView. }; type State = { -@@ -293,7 +296,9 @@ +@@ -293,7 +295,9 @@ return false; } @@ -549,7 +556,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView. } return false; -@@ -321,24 +326,47 @@ +@@ -321,24 +325,47 @@ return null; } @@ -600,7 +607,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView. } else { this.setState((state) => ({ routes: state.replacingRouteKeys.length -@@ -364,12 +392,11 @@ +@@ -364,12 +391,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 @@ -617,7 +624,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,22 +413,24 @@ +@@ -386,26 +412,29 @@ private handleTransitionStart = ( { route }: { route: Route }, closing: boolean @@ -654,3 +661,26 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView. render() { const { + state, ++ // eslint-disable-next-line @typescript-eslint/no-unused-vars + navigation, + keyboardHandlingEnabled, + mode = 'card', +@@ -423,7 +452,7 @@ + mode === 'card' && Platform.OS === 'ios' ? 'float' : 'screen'; + + return ( +- ++ <> + + + +@@ -456,7 +485,7 @@ + + + +- ++ + ); + } + } diff --git a/packages/stack/src/navigators/__tests__/__snapshots__/NestedNavigator.test.tsx.snap b/packages/stack/src/navigators/__tests__/__snapshots__/NestedNavigator.test.tsx.snap index 389badfa..0e8755d6 100644 --- a/packages/stack/src/navigators/__tests__/__snapshots__/NestedNavigator.test.tsx.snap +++ b/packages/stack/src/navigators/__tests__/__snapshots__/NestedNavigator.test.tsx.snap @@ -13,7 +13,6 @@ exports[`Nested navigators renders succesfully as direct child 1`] = ` style={ Object { "flex": 1, - "overflow": "hidden", } } > @@ -57,8 +56,8 @@ exports[`Nested navigators renders succesfully as direct child 1`] = ` "damping": 500, "mass": 3, "overshootClamping": true, - "restDisplacementThreshold": 0.01, - "restSpeedThreshold": 0.01, + "restDisplacementThreshold": 10, + "restSpeedThreshold": 10, "stiffness": 1000, }, }, @@ -68,8 +67,8 @@ exports[`Nested navigators renders succesfully as direct child 1`] = ` "damping": 500, "mass": 3, "overshootClamping": true, - "restDisplacementThreshold": 0.01, - "restSpeedThreshold": 0.01, + "restDisplacementThreshold": 10, + "restSpeedThreshold": 10, "stiffness": 1000, }, }, @@ -174,7 +173,6 @@ exports[`Nested navigators renders succesfully as direct child 1`] = ` style={ Object { "flex": 1, - "overflow": "hidden", } } > @@ -218,8 +216,8 @@ exports[`Nested navigators renders succesfully as direct child 1`] = ` "damping": 500, "mass": 3, "overshootClamping": true, - "restDisplacementThreshold": 0.01, - "restSpeedThreshold": 0.01, + "restDisplacementThreshold": 10, + "restSpeedThreshold": 10, "stiffness": 1000, }, }, @@ -229,8 +227,8 @@ exports[`Nested navigators renders succesfully as direct child 1`] = ` "damping": 500, "mass": 3, "overshootClamping": true, - "restDisplacementThreshold": 0.01, - "restSpeedThreshold": 0.01, + "restDisplacementThreshold": 10, + "restSpeedThreshold": 10, "stiffness": 1000, }, }, @@ -414,7 +412,7 @@ exports[`Nested navigators renders succesfully as direct child 1`] = ` pointerEvents="box-none" style={ Object { - "marginHorizontal": 18, + "marginHorizontal": 16, "opacity": 1, } } @@ -531,7 +529,7 @@ exports[`Nested navigators renders succesfully as direct child 1`] = ` pointerEvents="box-none" style={ Object { - "marginHorizontal": 18, + "marginHorizontal": 16, "opacity": 1, } } diff --git a/packages/stack/src/navigators/__tests__/__snapshots__/StackNavigator.test.tsx.snap b/packages/stack/src/navigators/__tests__/__snapshots__/StackNavigator.test.tsx.snap index d327a0e5..d56e4505 100644 --- a/packages/stack/src/navigators/__tests__/__snapshots__/StackNavigator.test.tsx.snap +++ b/packages/stack/src/navigators/__tests__/__snapshots__/StackNavigator.test.tsx.snap @@ -13,7 +13,6 @@ exports[`StackNavigator applies correct values when headerRight is present 1`] = style={ Object { "flex": 1, - "overflow": "hidden", } } > @@ -57,8 +56,8 @@ exports[`StackNavigator applies correct values when headerRight is present 1`] = "damping": 500, "mass": 3, "overshootClamping": true, - "restDisplacementThreshold": 0.01, - "restSpeedThreshold": 0.01, + "restDisplacementThreshold": 10, + "restSpeedThreshold": 10, "stiffness": 1000, }, }, @@ -68,8 +67,8 @@ exports[`StackNavigator applies correct values when headerRight is present 1`] = "damping": 500, "mass": 3, "overshootClamping": true, - "restDisplacementThreshold": 0.01, - "restSpeedThreshold": 0.01, + "restDisplacementThreshold": 10, + "restSpeedThreshold": 10, "stiffness": 1000, }, }, @@ -254,7 +253,7 @@ exports[`StackNavigator applies correct values when headerRight is present 1`] = pointerEvents="box-none" style={ Object { - "marginHorizontal": 18, + "marginHorizontal": 16, "opacity": 1, } } @@ -310,7 +309,6 @@ exports[`StackNavigator renders successfully 1`] = ` style={ Object { "flex": 1, - "overflow": "hidden", } } > @@ -354,8 +352,8 @@ exports[`StackNavigator renders successfully 1`] = ` "damping": 500, "mass": 3, "overshootClamping": true, - "restDisplacementThreshold": 0.01, - "restSpeedThreshold": 0.01, + "restDisplacementThreshold": 10, + "restSpeedThreshold": 10, "stiffness": 1000, }, }, @@ -365,8 +363,8 @@ exports[`StackNavigator renders successfully 1`] = ` "damping": 500, "mass": 3, "overshootClamping": true, - "restDisplacementThreshold": 0.01, - "restSpeedThreshold": 0.01, + "restDisplacementThreshold": 10, + "restSpeedThreshold": 10, "stiffness": 1000, }, }, @@ -551,7 +549,7 @@ exports[`StackNavigator renders successfully 1`] = ` pointerEvents="box-none" style={ Object { - "marginHorizontal": 18, + "marginHorizontal": 16, "opacity": 1, } } diff --git a/packages/stack/src/vendor/TransitionConfigs/TransitionSpecs.tsx b/packages/stack/src/vendor/TransitionConfigs/TransitionSpecs.tsx index 4cfbe57a..f47a9f10 100644 --- a/packages/stack/src/vendor/TransitionConfigs/TransitionSpecs.tsx +++ b/packages/stack/src/vendor/TransitionConfigs/TransitionSpecs.tsx @@ -11,8 +11,8 @@ export const TransitionIOSSpec: TransitionSpec = { damping: 500, mass: 3, overshootClamping: true, - restDisplacementThreshold: 0.01, - restSpeedThreshold: 0.01, + restDisplacementThreshold: 10, + restSpeedThreshold: 10, }, }; diff --git a/packages/stack/src/vendor/views/Header/HeaderSegment.tsx b/packages/stack/src/vendor/views/Header/HeaderSegment.tsx index cd24b72c..5710a815 100644 --- a/packages/stack/src/vendor/views/Header/HeaderSegment.tsx +++ b/packages/stack/src/vendor/views/Header/HeaderSegment.tsx @@ -307,6 +307,8 @@ export default class HeaderSegment extends React.Component { }) : null; + const rightButton = right ? right({ tintColor: headerTintColor }) : null; + return ( { pointerEvents="box-none" style={[ headerTitleAlign === 'left' - ? { position: 'absolute', left: leftButton ? 72 : 16 } - : { marginHorizontal: 18 }, + ? { + position: 'absolute', + left: (leftButton ? 72 : 16) + insets.left, + right: (rightButton ? 72 : 16) + insets.right, + } + : { + marginHorizontal: + (leftButton ? 32 : 16) + + (leftLabelLayout?.width || 0) + + Math.max(insets.left, insets.right), + }, titleStyle, titleContainerStyle, ]} @@ -359,7 +370,7 @@ export default class HeaderSegment extends React.Component { style: customTitleStyle, })} - {right ? ( + {rightButton ? ( { rightContainerStyle, ]} > - {right({ tintColor: headerTintColor })} + {rightButton} ) : null} diff --git a/packages/stack/src/vendor/views/Header/HeaderTitle.tsx b/packages/stack/src/vendor/views/Header/HeaderTitle.tsx index 4fc68b1c..cb6d0e4e 100644 --- a/packages/stack/src/vendor/views/Header/HeaderTitle.tsx +++ b/packages/stack/src/vendor/views/Header/HeaderTitle.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { Animated, StyleSheet, Platform } from 'react-native'; import useTheme from '../../../utils/useTheme'; -type Props = React.ComponentProps & { +type Props = Omit, 'key'> & { tintColor?: string; children?: string; }; diff --git a/packages/stack/src/vendor/views/Stack/CardContainer.tsx b/packages/stack/src/vendor/views/Stack/CardContainer.tsx index da2d08f3..1537f7e6 100644 --- a/packages/stack/src/vendor/views/Stack/CardContainer.tsx +++ b/packages/stack/src/vendor/views/Stack/CardContainer.tsx @@ -8,8 +8,8 @@ import { Route, Scene, Layout, - StackCardMode, StackHeaderMode, + StackCardMode, TransitionPreset, } from '../../types'; diff --git a/yarn.lock b/yarn.lock index 8fdf21a9..c72fc4d4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3202,10 +3202,10 @@ resolved "https://registry.yarnpkg.com/@react-native-community/masked-view/-/masked-view-0.1.7.tgz#a65ce0702f55cb67fd777995de6fc7b3e5781903" integrity sha512-9KbP7LTLFz9dx1heURJbO6nuVMdSjDez8znlrUzaB1nUwKVsTTwlKRuHxGUYIIkReLWrJQeCv9tidy+84z2eCw== -"@react-navigation/stack@^5.2.16": - version "5.2.16" - resolved "https://registry.yarnpkg.com/@react-navigation/stack/-/stack-5.2.16.tgz#0ab0b8b401f13f5823de7334a643baac3bc3cd04" - integrity sha512-0l0Aalj5RNcHLVaS2hgrs58eNDHlkAGPeyEUFcxbk2ii93F8W9MmSCYUn+Tpvruqfv/m9FnyLbQ1DpQOxsekIg== +"@react-navigation/stack@^5.3.3": + version "5.3.3" + resolved "https://registry.yarnpkg.com/@react-navigation/stack/-/stack-5.3.3.tgz#8189160ad4be6a9ddc8a01af100ad5b737e0c2e1" + integrity sha512-UZqplwGnu1X3sSWTIERUG1NMK2cr6ER7ibYVMKNMY5a06t/hq4o2vgAG2ZNXKcNpgl0K2DR08EFhgeJLcP0mgg== dependencies: color "^3.1.2" react-native-iphone-x-helper "^1.2.1"