@react-navigation/native-stack 7.8.6 → 8.0.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/module/index.js +1 -1
- package/lib/module/index.js.map +1 -1
- package/lib/module/navigators/createNativeStackNavigator.js +7 -6
- package/lib/module/navigators/createNativeStackNavigator.js.map +1 -1
- package/lib/module/views/NativeStackView.js +4 -4
- package/lib/module/views/NativeStackView.js.map +1 -1
- package/lib/module/views/NativeStackView.native.js +159 -200
- package/lib/module/views/NativeStackView.native.js.map +1 -1
- package/lib/module/views/useHeaderConfigProps.js +44 -24
- package/lib/module/views/useHeaderConfigProps.js.map +1 -1
- package/lib/typescript/src/index.d.ts +1 -1
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/navigators/createNativeStackNavigator.d.ts +10 -6
- package/lib/typescript/src/navigators/createNativeStackNavigator.d.ts.map +1 -1
- package/lib/typescript/src/types.d.ts +72 -67
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/lib/typescript/src/views/NativeStackView.d.ts.map +1 -1
- package/lib/typescript/src/views/NativeStackView.native.d.ts.map +1 -1
- package/lib/typescript/src/views/useHeaderConfigProps.d.ts +1 -1
- package/lib/typescript/src/views/useHeaderConfigProps.d.ts.map +1 -1
- package/package.json +15 -17
- package/src/index.tsx +4 -1
- package/src/navigators/createNativeStackNavigator.tsx +48 -25
- package/src/types.tsx +72 -72
- package/src/views/NativeStackView.native.tsx +191 -253
- package/src/views/NativeStackView.tsx +6 -9
- package/src/views/useHeaderConfigProps.tsx +32 -30
- package/lib/module/views/FontProcessor.js +0 -6
- package/lib/module/views/FontProcessor.js.map +0 -1
- package/lib/module/views/FontProcessor.native.js +0 -12
- package/lib/module/views/FontProcessor.native.js.map +0 -1
- package/lib/typescript/src/views/FontProcessor.d.ts +0 -2
- package/lib/typescript/src/views/FontProcessor.d.ts.map +0 -1
- package/lib/typescript/src/views/FontProcessor.native.d.ts +0 -2
- package/lib/typescript/src/views/FontProcessor.native.d.ts.map +0 -1
- package/src/views/FontProcessor.native.tsx +0 -12
- package/src/views/FontProcessor.tsx +0 -5
package/lib/module/index.js
CHANGED
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createNativeStackNavigator","NativeStackView","useAnimatedHeaderHeight"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA;AACA;AACA;AACA,
|
|
1
|
+
{"version":3,"names":["createNativeStackNavigator","createNativeStackScreen","NativeStackView","useAnimatedHeaderHeight"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA;AACA;AACA;AACA,SACEA,0BAA0B,EAC1BC,uBAAuB,QAClB,4CAAyC;;AAEhD;AACA;AACA;AACA,SAASC,eAAe,QAAQ,yBAAyB;;AAEzD;AACA;AACA;AACA,SAASC,uBAAuB,QAAQ,oCAAiC;;AAEzE;AACA;AACA","ignoreList":[]}
|
|
@@ -5,15 +5,14 @@ import * as React from 'react';
|
|
|
5
5
|
import { NativeStackView } from '../views/NativeStackView';
|
|
6
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
7
|
function NativeStackNavigator({
|
|
8
|
-
id,
|
|
9
8
|
initialRouteName,
|
|
10
|
-
|
|
9
|
+
routeNamesChangeBehavior,
|
|
11
10
|
children,
|
|
12
11
|
layout,
|
|
13
12
|
screenListeners,
|
|
14
13
|
screenOptions,
|
|
15
14
|
screenLayout,
|
|
16
|
-
|
|
15
|
+
router,
|
|
17
16
|
...rest
|
|
18
17
|
}) {
|
|
19
18
|
const {
|
|
@@ -23,15 +22,14 @@ function NativeStackNavigator({
|
|
|
23
22
|
navigation,
|
|
24
23
|
NavigationContent
|
|
25
24
|
} = useNavigationBuilder(StackRouter, {
|
|
26
|
-
id,
|
|
27
25
|
initialRouteName,
|
|
28
|
-
|
|
26
|
+
routeNamesChangeBehavior,
|
|
29
27
|
children,
|
|
30
28
|
layout,
|
|
31
29
|
screenListeners,
|
|
32
30
|
screenOptions,
|
|
33
31
|
screenLayout,
|
|
34
|
-
|
|
32
|
+
router
|
|
35
33
|
});
|
|
36
34
|
React.useEffect(() =>
|
|
37
35
|
// @ts-expect-error: there may not be a tab navigator in parent
|
|
@@ -64,4 +62,7 @@ function NativeStackNavigator({
|
|
|
64
62
|
export function createNativeStackNavigator(config) {
|
|
65
63
|
return createNavigatorFactory(NativeStackNavigator)(config);
|
|
66
64
|
}
|
|
65
|
+
export function createNativeStackScreen(config) {
|
|
66
|
+
return config;
|
|
67
|
+
}
|
|
67
68
|
//# sourceMappingURL=createNativeStackNavigator.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createNavigatorFactory","StackActions","StackRouter","useNavigationBuilder","React","NativeStackView","jsx","_jsx","NativeStackNavigator","
|
|
1
|
+
{"version":3,"names":["createNavigatorFactory","StackActions","StackRouter","useNavigationBuilder","React","NativeStackView","jsx","_jsx","NativeStackNavigator","initialRouteName","routeNamesChangeBehavior","children","layout","screenListeners","screenOptions","screenLayout","router","rest","state","describe","descriptors","navigation","NavigationContent","useEffect","addListener","e","isFocused","requestAnimationFrame","index","defaultPrevented","dispatch","popToTop","target","key","createNativeStackNavigator","config","createNativeStackScreen"],"sourceRoot":"../../../src","sources":["navigators/createNativeStackNavigator.tsx"],"mappings":";;AAAA,SACEA,sBAAsB,EAItBC,YAAY,EAEZC,WAAW,EAQXC,oBAAoB,QACf,0BAA0B;AACjC,OAAO,KAAKC,KAAK,MAAM,OAAO;AAQ9B,SAASC,eAAe,QAAQ,0BAA0B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE3D,SAASC,oBAAoBA,CAAC;EAC5BC,gBAAgB;EAChBC,wBAAwB;EACxBC,QAAQ;EACRC,MAAM;EACNC,eAAe;EACfC,aAAa;EACbC,YAAY;EACZC,MAAM;EACN,GAAGC;AACsB,CAAC,EAAE;EAC5B,MAAM;IAAEC,KAAK;IAAEC,QAAQ;IAAEC,WAAW;IAAEC,UAAU;IAAEC;EAAkB,CAAC,GACnEnB,oBAAoB,CAMlBD,WAAW,EAAE;IACbO,gBAAgB;IAChBC,wBAAwB;IACxBC,QAAQ;IACRC,MAAM;IACNC,eAAe;IACfC,aAAa;IACbC,YAAY;IACZC;EACF,CAAC,CAAC;EAEJZ,KAAK,CAACmB,SAAS,CACb;EACE;EACAF,UAAU,EAAEG,WAAW,GAAG,UAAU,EAAGC,CAAM,IAAK;IAChD,MAAMC,SAAS,GAAGL,UAAU,CAACK,SAAS,CAAC,CAAC;;IAExC;IACA;IACAC,qBAAqB,CAAC,MAAM;MAC1B,IACET,KAAK,CAACU,KAAK,GAAG,CAAC,IACfF,SAAS,IACT,CAAED,CAAC,CAAgCI,gBAAgB,EACnD;QACA;QACA;QACAR,UAAU,CAACS,QAAQ,CAAC;UAClB,GAAG7B,YAAY,CAAC8B,QAAQ,CAAC,CAAC;UAC1BC,MAAM,EAAEd,KAAK,CAACe;QAChB,CAAC,CAAC;MACJ;IACF,CAAC,CAAC;EACJ,CAAC,CAAC,EACJ,CAACZ,UAAU,EAAEH,KAAK,CAACU,KAAK,EAAEV,KAAK,CAACe,GAAG,CACrC,CAAC;EAED,oBACE1B,IAAA,CAACe,iBAAiB;IAAAX,QAAA,eAChBJ,IAAA,CAACF,eAAe;MAAA,GACVY,IAAI;MACRC,KAAK,EAAEA,KAAM;MACbG,UAAU,EAAEA,UAAW;MACvBD,WAAW,EAAEA,WAAY;MACzBD,QAAQ,EAAEA;IAAS,CACpB;EAAC,CACe,CAAC;AAExB;AA2BA,OAAO,SAASe,0BAA0BA,CAACC,MAAgB,EAAE;EAC3D,OAAOnC,sBAAsB,CAACQ,oBAAoB,CAAC,CAAC2B,MAAM,CAAC;AAC7D;AAEA,OAAO,SAASC,uBAAuBA,CAIrCD,MAOC,EACD;EACA,OAAOA,MAAM;AACf","ignoreList":[]}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import { getHeaderTitle, Header, HeaderBackButton, HeaderBackContext,
|
|
3
|
+
import { getHeaderTitle, Header, HeaderBackButton, HeaderBackContext, useHeaderHeight } from '@react-navigation/elements';
|
|
4
|
+
import { SafeAreaProviderCompat, Screen } from '@react-navigation/elements/internal';
|
|
4
5
|
import { useLinkBuilder } from '@react-navigation/native';
|
|
5
6
|
import * as React from 'react';
|
|
6
7
|
import { Animated, Image, StyleSheet, View } from 'react-native';
|
|
@@ -41,7 +42,6 @@ export function NativeStackView({
|
|
|
41
42
|
header,
|
|
42
43
|
headerShown,
|
|
43
44
|
headerBackIcon,
|
|
44
|
-
headerBackImageSource,
|
|
45
45
|
headerLeft,
|
|
46
46
|
headerTransparent,
|
|
47
47
|
headerBackTitle,
|
|
@@ -80,8 +80,8 @@ export function NativeStackView({
|
|
|
80
80
|
...rest,
|
|
81
81
|
label: headerBackTitle ?? label,
|
|
82
82
|
tintColor: tintColor,
|
|
83
|
-
backImage: headerBackIcon !== undefined
|
|
84
|
-
source: headerBackIcon
|
|
83
|
+
backImage: headerBackIcon !== undefined ? () => /*#__PURE__*/_jsx(Image, {
|
|
84
|
+
source: headerBackIcon.source,
|
|
85
85
|
resizeMode: "contain",
|
|
86
86
|
tintColor: tintColor,
|
|
87
87
|
style: styles.backImage
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["getHeaderTitle","Header","HeaderBackButton","HeaderBackContext","
|
|
1
|
+
{"version":3,"names":["getHeaderTitle","Header","HeaderBackButton","HeaderBackContext","useHeaderHeight","SafeAreaProviderCompat","Screen","useLinkBuilder","React","Animated","Image","StyleSheet","View","AnimatedHeaderHeightContext","jsx","_jsx","TRANSPARENT_PRESENTATIONS","NativeStackView","state","descriptors","describe","parentHeaderBack","useContext","buildHref","preloadedDescriptors","preloadedRoutes","reduce","acc","route","key","children","routes","concat","map","i","isFocused","index","previousKey","nextKey","previousDescriptor","undefined","nextDescriptor","options","navigation","render","headerBack","title","name","href","params","canGoBack","header","headerShown","headerBackIcon","headerLeft","headerTransparent","headerBackTitle","presentation","contentStyle","rest","nextPresentation","isPreloaded","focused","back","label","tintColor","backImage","source","resizeMode","style","styles","onPress","goBack","absoluteFill","display","includes","backgroundColor","Provider","value","AnimatedHeaderHeightProvider","contentContainer","headerHeight","animatedHeaderHeight","useState","Value","useEffect","setValue","create","flex","height","width","margin"],"sourceRoot":"../../../src","sources":["views/NativeStackView.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import { getDefaultHeaderHeight, getHeaderTitle, HeaderBackContext, HeaderHeightContext, HeaderShownContext,
|
|
4
|
-
import {
|
|
3
|
+
import { getDefaultHeaderHeight, getHeaderTitle, HeaderBackContext, HeaderHeightContext, HeaderShownContext, useFrameSize } from '@react-navigation/elements';
|
|
4
|
+
import { SafeAreaProviderCompat } from '@react-navigation/elements/internal';
|
|
5
|
+
import { NavigationProvider, StackActions, usePreventRemoveContext, useTheme } from '@react-navigation/native';
|
|
5
6
|
import * as React from 'react';
|
|
6
|
-
import { Animated, Platform,
|
|
7
|
+
import { Animated, Platform, StyleSheet, useAnimatedValue, View } from 'react-native';
|
|
7
8
|
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
8
9
|
import { ScreenStack, ScreenStackItem } from 'react-native-screens';
|
|
9
10
|
import { debounce } from "../utils/debounce.js";
|
|
@@ -24,7 +25,6 @@ const SceneView = ({
|
|
|
24
25
|
shouldFreeze,
|
|
25
26
|
descriptor,
|
|
26
27
|
previousDescriptor,
|
|
27
|
-
nextDescriptor,
|
|
28
28
|
isPresentationModal,
|
|
29
29
|
isPreloaded,
|
|
30
30
|
onWillDisappear,
|
|
@@ -43,18 +43,15 @@ const SceneView = ({
|
|
|
43
43
|
options,
|
|
44
44
|
render
|
|
45
45
|
} = descriptor;
|
|
46
|
-
let {
|
|
47
|
-
animation,
|
|
48
|
-
animationMatchesGesture,
|
|
49
|
-
presentation = isPresentationModal ? 'modal' : 'card',
|
|
50
|
-
fullScreenGestureEnabled
|
|
51
|
-
} = options;
|
|
52
46
|
const {
|
|
47
|
+
animation,
|
|
53
48
|
animationDuration,
|
|
49
|
+
animationMatchesGesture,
|
|
54
50
|
animationTypeForReplace = 'push',
|
|
51
|
+
fullScreenGestureEnabled,
|
|
55
52
|
fullScreenGestureShadowEnabled = true,
|
|
56
53
|
gestureEnabled,
|
|
57
|
-
gestureDirection
|
|
54
|
+
gestureDirection,
|
|
58
55
|
gestureResponseDistance,
|
|
59
56
|
header,
|
|
60
57
|
headerBackButtonMenuEnabled,
|
|
@@ -63,8 +60,6 @@ const SceneView = ({
|
|
|
63
60
|
headerTransparent,
|
|
64
61
|
autoHideHomeIndicator,
|
|
65
62
|
keyboardHandlingEnabled,
|
|
66
|
-
navigationBarColor,
|
|
67
|
-
navigationBarTranslucent,
|
|
68
63
|
navigationBarHidden,
|
|
69
64
|
orientation,
|
|
70
65
|
sheetAllowedDetents = [1.0],
|
|
@@ -77,34 +72,14 @@ const SceneView = ({
|
|
|
77
72
|
statusBarAnimation,
|
|
78
73
|
statusBarHidden,
|
|
79
74
|
statusBarStyle,
|
|
80
|
-
statusBarTranslucent,
|
|
81
|
-
statusBarBackgroundColor,
|
|
82
75
|
unstable_sheetFooter,
|
|
83
76
|
scrollEdgeEffects,
|
|
84
77
|
freezeOnBlur,
|
|
85
78
|
contentStyle
|
|
86
79
|
} = options;
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
// `animationMatchesGesture` needs to be set to `true` so the `animation` set by user can be used,
|
|
91
|
-
// otherwise `simple_push` will be used.
|
|
92
|
-
// Also, the default animation for this direction seems to be `slide_from_bottom`.
|
|
93
|
-
if (fullScreenGestureEnabled === undefined) {
|
|
94
|
-
fullScreenGestureEnabled = true;
|
|
95
|
-
}
|
|
96
|
-
if (animationMatchesGesture === undefined) {
|
|
97
|
-
animationMatchesGesture = true;
|
|
98
|
-
}
|
|
99
|
-
if (animation === undefined) {
|
|
100
|
-
animation = 'slide_from_bottom';
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
// workaround for rn-screens where gestureDirection has to be set on both
|
|
105
|
-
// current and previous screen - software-mansion/react-native-screens/pull/1509
|
|
106
|
-
const nextGestureDirection = nextDescriptor?.options.gestureDirection;
|
|
107
|
-
const gestureDirectionOverride = nextGestureDirection != null ? nextGestureDirection : gestureDirection;
|
|
80
|
+
let {
|
|
81
|
+
presentation = isPresentationModal ? 'modal' : 'card'
|
|
82
|
+
} = options;
|
|
108
83
|
if (index === 0) {
|
|
109
84
|
// first screen should always be treated as `card`, it resolves problems with no header animation
|
|
110
85
|
// for navigator with first screen as `modal` and the next as `card`
|
|
@@ -130,7 +105,11 @@ const SceneView = ({
|
|
|
130
105
|
// So our `getDefaultHeaderHeight` doesn't return the correct value
|
|
131
106
|
// So we hardcode the value here for now until screens is updated
|
|
132
107
|
android: ANDROID_DEFAULT_HEADER_HEIGHT + topInset,
|
|
133
|
-
default: getDefaultHeaderHeight(
|
|
108
|
+
default: getDefaultHeaderHeight({
|
|
109
|
+
landscape: frame.width > frame.height,
|
|
110
|
+
modalPresentation: isModal,
|
|
111
|
+
topInset
|
|
112
|
+
})
|
|
134
113
|
}));
|
|
135
114
|
const {
|
|
136
115
|
preventedRoutes
|
|
@@ -142,26 +121,7 @@ const SceneView = ({
|
|
|
142
121
|
// Debounce the header height updates to avoid excessive re-renders
|
|
143
122
|
debounce(setHeaderHeight, 100), []);
|
|
144
123
|
const hasCustomHeader = header != null;
|
|
145
|
-
|
|
146
|
-
if (Platform.OS === 'android' && !hasCustomHeader) {
|
|
147
|
-
const statusBarHeight = StatusBar.currentHeight ?? 0;
|
|
148
|
-
|
|
149
|
-
// FIXME: On Android, the native header height is not correctly calculated
|
|
150
|
-
// It includes status bar height even if statusbar is not translucent
|
|
151
|
-
// And the statusbar value itself doesn't match the actual status bar height
|
|
152
|
-
// So we subtract the bogus status bar height and add the actual top inset
|
|
153
|
-
headerHeightCorrectionOffset = -statusBarHeight + topInset;
|
|
154
|
-
}
|
|
155
|
-
const rawAnimatedHeaderHeight = useAnimatedValue(defaultHeaderHeight);
|
|
156
|
-
const animatedHeaderHeight = React.useMemo(() => Animated.add(rawAnimatedHeaderHeight, headerHeightCorrectionOffset), [headerHeightCorrectionOffset, rawAnimatedHeaderHeight]);
|
|
157
|
-
|
|
158
|
-
// During the very first render topInset is > 0 when running
|
|
159
|
-
// in non edge-to-edge mode on Android, while on every consecutive render
|
|
160
|
-
// topInset === 0, causing header content to jump, as we add padding on the first frame,
|
|
161
|
-
// just to remove it in next one. To prevent this, when statusBarTranslucent is set,
|
|
162
|
-
// we apply additional padding in header only if its true.
|
|
163
|
-
// For more details see: https://github.com/react-navigation/react-navigation/pull/12014
|
|
164
|
-
const headerTopInsetEnabled = typeof statusBarTranslucent === 'boolean' ? statusBarTranslucent : topInset !== 0;
|
|
124
|
+
const headerTopInsetEnabled = topInset !== 0;
|
|
165
125
|
const canGoBack = previousDescriptor != null || parentHeaderBack != null;
|
|
166
126
|
const backTitle = previousDescriptor ? getHeaderTitle(previousDescriptor.options, previousDescriptor.route.name) : parentHeaderBack?.title;
|
|
167
127
|
const headerBack = React.useMemo(() => {
|
|
@@ -175,6 +135,7 @@ const SceneView = ({
|
|
|
175
135
|
return undefined;
|
|
176
136
|
}, [canGoBack, backTitle]);
|
|
177
137
|
const isRemovePrevented = preventedRoutes[route.key]?.preventRemove;
|
|
138
|
+
const animatedHeaderHeight = useAnimatedValue(defaultHeaderHeight);
|
|
178
139
|
const headerConfig = useHeaderConfigProps({
|
|
179
140
|
...options,
|
|
180
141
|
route,
|
|
@@ -183,154 +144,152 @@ const SceneView = ({
|
|
|
183
144
|
headerHeight,
|
|
184
145
|
headerShown: header !== undefined ? false : headerShown,
|
|
185
146
|
headerTopInsetEnabled,
|
|
186
|
-
headerTransparent,
|
|
187
147
|
headerBack
|
|
188
148
|
});
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
false : gestureEnabled,
|
|
206
|
-
homeIndicatorHidden: autoHideHomeIndicator,
|
|
207
|
-
hideKeyboardOnSwipe: keyboardHandlingEnabled,
|
|
208
|
-
navigationBarColor: navigationBarColor,
|
|
209
|
-
navigationBarTranslucent: navigationBarTranslucent,
|
|
210
|
-
navigationBarHidden: navigationBarHidden,
|
|
211
|
-
replaceAnimation: animationTypeForReplace,
|
|
212
|
-
stackPresentation: presentation === 'card' ? 'push' : presentation,
|
|
213
|
-
stackAnimation: animation,
|
|
214
|
-
screenOrientation: orientation,
|
|
215
|
-
sheetAllowedDetents: sheetAllowedDetents,
|
|
216
|
-
sheetLargestUndimmedDetentIndex: sheetLargestUndimmedDetentIndex,
|
|
217
|
-
sheetGrabberVisible: sheetGrabberVisible,
|
|
218
|
-
sheetInitialDetentIndex: sheetInitialDetentIndex,
|
|
219
|
-
sheetCornerRadius: sheetCornerRadius,
|
|
220
|
-
sheetElevation: sheetElevation,
|
|
221
|
-
sheetExpandsWhenScrolledToEdge: sheetExpandsWhenScrolledToEdge,
|
|
222
|
-
statusBarAnimation: statusBarAnimation,
|
|
223
|
-
statusBarHidden: statusBarHidden,
|
|
224
|
-
statusBarStyle: statusBarStyle,
|
|
225
|
-
statusBarColor: statusBarBackgroundColor,
|
|
226
|
-
statusBarTranslucent: statusBarTranslucent,
|
|
227
|
-
swipeDirection: gestureDirectionOverride,
|
|
228
|
-
transitionDuration: animationDuration,
|
|
229
|
-
onWillAppear: onWillAppear,
|
|
230
|
-
onWillDisappear: onWillDisappear,
|
|
231
|
-
onAppear: onAppear,
|
|
232
|
-
onDisappear: onDisappear,
|
|
233
|
-
onDismissed: onDismissed,
|
|
234
|
-
onGestureCancel: onGestureCancel,
|
|
235
|
-
onSheetDetentChanged: onSheetDetentChanged,
|
|
236
|
-
gestureResponseDistance: gestureResponseDistance,
|
|
237
|
-
nativeBackButtonDismissalEnabled: false // on Android
|
|
238
|
-
,
|
|
239
|
-
onHeaderBackButtonClicked: onHeaderBackButtonClicked,
|
|
240
|
-
preventNativeDismiss: isRemovePrevented // on iOS
|
|
241
|
-
,
|
|
242
|
-
scrollEdgeEffects: {
|
|
243
|
-
bottom: scrollEdgeEffects?.bottom ?? 'automatic',
|
|
244
|
-
top: scrollEdgeEffects?.top ?? 'automatic',
|
|
245
|
-
left: scrollEdgeEffects?.left ?? 'automatic',
|
|
246
|
-
right: scrollEdgeEffects?.right ?? 'automatic'
|
|
247
|
-
},
|
|
248
|
-
onNativeDismissCancelled: onNativeDismissCancelled
|
|
249
|
-
// Unfortunately, because of the bug that exists on Fabric, where native event drivers
|
|
250
|
-
// for Animated objects are being created after the first notifications about the header height
|
|
251
|
-
// from the native side, `onHeaderHeightChange` event does not notify
|
|
252
|
-
// `animatedHeaderHeight` about initial values on appearing screens at the moment.
|
|
253
|
-
,
|
|
254
|
-
onHeaderHeightChange: Animated.event([{
|
|
255
|
-
nativeEvent: {
|
|
256
|
-
headerHeight: rawAnimatedHeaderHeight
|
|
257
|
-
}
|
|
258
|
-
}], {
|
|
259
|
-
useNativeDriver,
|
|
260
|
-
listener: e => {
|
|
261
|
-
if (hasCustomHeader) {
|
|
262
|
-
// If we have a custom header, don't use native header height
|
|
263
|
-
return;
|
|
264
|
-
}
|
|
265
|
-
if (Platform.OS === 'android' && (headerBackground != null || headerTransparent)) {
|
|
266
|
-
// FIXME: On Android, we get 0 if the header is translucent
|
|
267
|
-
// So we set a default height in that case
|
|
268
|
-
setHeaderHeight(ANDROID_DEFAULT_HEADER_HEIGHT + topInset);
|
|
269
|
-
return;
|
|
270
|
-
}
|
|
271
|
-
if (e.nativeEvent && typeof e.nativeEvent === 'object' && 'headerHeight' in e.nativeEvent && typeof e.nativeEvent.headerHeight === 'number') {
|
|
272
|
-
const headerHeight = e.nativeEvent.headerHeight + headerHeightCorrectionOffset;
|
|
149
|
+
const onHeaderHeightChange = hasCustomHeader ?
|
|
150
|
+
// If we have a custom header, don't use native header height
|
|
151
|
+
undefined :
|
|
152
|
+
// On Fabric, there's a bug where native event drivers for Animated objects
|
|
153
|
+
// are created after the first notifications about the header height
|
|
154
|
+
// from the native side, `onHeaderHeightChange` event does not notify
|
|
155
|
+
// `animatedHeaderHeight` about initial values on appearing screens at the moment.
|
|
156
|
+
Animated.event([{
|
|
157
|
+
nativeEvent: {
|
|
158
|
+
headerHeight: animatedHeaderHeight
|
|
159
|
+
}
|
|
160
|
+
}], {
|
|
161
|
+
useNativeDriver,
|
|
162
|
+
listener: e => {
|
|
163
|
+
if (e.nativeEvent && typeof e.nativeEvent === 'object' && 'headerHeight' in e.nativeEvent && typeof e.nativeEvent.headerHeight === 'number') {
|
|
164
|
+
const headerHeight = e.nativeEvent.headerHeight;
|
|
273
165
|
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
166
|
+
// Only debounce if header has large title or search bar
|
|
167
|
+
// As it's the only case where the header height can change frequently
|
|
168
|
+
const doesHeaderAnimate = Platform.OS === 'ios' && (options.headerLargeTitleEnabled || options.headerSearchBarOptions);
|
|
169
|
+
if (doesHeaderAnimate) {
|
|
170
|
+
setHeaderHeightDebounced(headerHeight);
|
|
171
|
+
} else {
|
|
172
|
+
if (Platform.OS === 'android' && headerHeight !== 0 && headerHeight <= ANDROID_DEFAULT_HEADER_HEIGHT) {
|
|
173
|
+
// FIXME: On Android, events may get delivered out-of-order
|
|
174
|
+
// https://github.com/facebook/react-native/issues/54636
|
|
175
|
+
// We seem to get header height without status bar height first,
|
|
176
|
+
// and then the correct height with status bar height included
|
|
177
|
+
// But due to out-of-order delivery, we may get the correct height first
|
|
178
|
+
// and then the one without status bar height
|
|
179
|
+
// This is hack to include status bar height if it's not already included
|
|
180
|
+
// It only works because header height doesn't change dynamically on Android
|
|
181
|
+
setHeaderHeight(headerHeight + insets.top);
|
|
182
|
+
} else {
|
|
183
|
+
setHeaderHeight(headerHeight);
|
|
283
184
|
}
|
|
284
|
-
}
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
}
|
|
188
|
+
});
|
|
189
|
+
return /*#__PURE__*/_jsx(NavigationProvider, {
|
|
190
|
+
navigation: navigation,
|
|
191
|
+
route: route,
|
|
192
|
+
children: /*#__PURE__*/_jsx(ScreenStackItem, {
|
|
193
|
+
screenId: route.key,
|
|
194
|
+
activityState: isPreloaded ? 0 : 2,
|
|
195
|
+
style: StyleSheet.absoluteFill,
|
|
196
|
+
"aria-hidden": !focused,
|
|
197
|
+
customAnimationOnSwipe: animationMatchesGesture,
|
|
198
|
+
fullScreenSwipeEnabled: fullScreenGestureEnabled,
|
|
199
|
+
fullScreenSwipeShadowEnabled: fullScreenGestureShadowEnabled,
|
|
200
|
+
freezeOnBlur: freezeOnBlur,
|
|
201
|
+
gestureEnabled: Platform.OS === 'android' ?
|
|
202
|
+
// This prop enables handling of system back gestures on Android
|
|
203
|
+
// Since we handle them in JS side, we disable this
|
|
204
|
+
false : gestureEnabled,
|
|
205
|
+
homeIndicatorHidden: autoHideHomeIndicator,
|
|
206
|
+
hideKeyboardOnSwipe: keyboardHandlingEnabled,
|
|
207
|
+
navigationBarHidden: navigationBarHidden,
|
|
208
|
+
replaceAnimation: animationTypeForReplace,
|
|
209
|
+
stackPresentation: presentation === 'card' ? 'push' : presentation,
|
|
210
|
+
stackAnimation: animation,
|
|
211
|
+
screenOrientation: orientation,
|
|
212
|
+
sheetAllowedDetents: sheetAllowedDetents,
|
|
213
|
+
sheetLargestUndimmedDetentIndex: sheetLargestUndimmedDetentIndex,
|
|
214
|
+
sheetGrabberVisible: sheetGrabberVisible,
|
|
215
|
+
sheetInitialDetentIndex: sheetInitialDetentIndex,
|
|
216
|
+
sheetCornerRadius: sheetCornerRadius,
|
|
217
|
+
sheetElevation: sheetElevation,
|
|
218
|
+
sheetExpandsWhenScrolledToEdge: sheetExpandsWhenScrolledToEdge,
|
|
219
|
+
statusBarAnimation: statusBarAnimation,
|
|
220
|
+
statusBarHidden: statusBarHidden,
|
|
221
|
+
statusBarStyle: statusBarStyle,
|
|
222
|
+
swipeDirection: gestureDirection,
|
|
223
|
+
transitionDuration: animationDuration,
|
|
224
|
+
onWillAppear: onWillAppear,
|
|
225
|
+
onWillDisappear: onWillDisappear,
|
|
226
|
+
onAppear: onAppear,
|
|
227
|
+
onDisappear: onDisappear,
|
|
228
|
+
onDismissed: onDismissed,
|
|
229
|
+
onGestureCancel: onGestureCancel,
|
|
230
|
+
onSheetDetentChanged: onSheetDetentChanged,
|
|
231
|
+
gestureResponseDistance: gestureResponseDistance,
|
|
232
|
+
nativeBackButtonDismissalEnabled: false // on Android
|
|
233
|
+
,
|
|
234
|
+
onHeaderBackButtonClicked: onHeaderBackButtonClicked,
|
|
235
|
+
preventNativeDismiss: isRemovePrevented // on iOS
|
|
236
|
+
,
|
|
237
|
+
scrollEdgeEffects: {
|
|
238
|
+
bottom: scrollEdgeEffects?.bottom ?? 'automatic',
|
|
239
|
+
top: scrollEdgeEffects?.top ?? 'automatic',
|
|
240
|
+
left: scrollEdgeEffects?.left ?? 'automatic',
|
|
241
|
+
right: scrollEdgeEffects?.right ?? 'automatic'
|
|
242
|
+
},
|
|
243
|
+
onNativeDismissCancelled: onNativeDismissCancelled,
|
|
244
|
+
onHeaderHeightChange: onHeaderHeightChange,
|
|
245
|
+
contentStyle: [presentation !== 'transparentModal' && presentation !== 'containedTransparentModal' && {
|
|
246
|
+
backgroundColor: colors.background
|
|
247
|
+
}, contentStyle],
|
|
248
|
+
headerConfig: headerConfig,
|
|
249
|
+
unstable_sheetFooter: unstable_sheetFooter
|
|
250
|
+
// When ts-expect-error is added, it affects all the props below it
|
|
251
|
+
// So we keep any props that need it at the end
|
|
252
|
+
// Otherwise invalid props may not be caught by TypeScript
|
|
253
|
+
,
|
|
254
|
+
shouldFreeze: shouldFreeze,
|
|
255
|
+
children: /*#__PURE__*/_jsx(AnimatedHeaderHeightContext.Provider, {
|
|
256
|
+
value: animatedHeaderHeight,
|
|
257
|
+
children: /*#__PURE__*/_jsxs(HeaderHeightContext.Provider, {
|
|
258
|
+
value: headerShown !== false ? headerHeight : parentHeaderHeight ?? 0,
|
|
259
|
+
children: [headerBackground != null ?
|
|
260
|
+
/*#__PURE__*/
|
|
261
|
+
/**
|
|
262
|
+
* To show a custom header background, we render it at the top of the screen below the header
|
|
263
|
+
* The header also needs to be positioned absolutely (with `translucent` style)
|
|
264
|
+
*/
|
|
265
|
+
_jsx(View, {
|
|
266
|
+
style: [styles.background, headerTransparent ? styles.translucent : null, {
|
|
267
|
+
height: headerHeight
|
|
268
|
+
}],
|
|
269
|
+
children: headerBackground()
|
|
270
|
+
}) : null, header != null && headerShown !== false ? /*#__PURE__*/_jsx(View, {
|
|
271
|
+
onLayout: e => {
|
|
272
|
+
const headerHeight = e.nativeEvent.layout.height;
|
|
273
|
+
animatedHeaderHeight.setValue(headerHeight);
|
|
274
|
+
setHeaderHeight(headerHeight);
|
|
275
|
+
},
|
|
276
|
+
style: [styles.header, headerTransparent ? styles.absolute : null],
|
|
277
|
+
children: header({
|
|
278
|
+
back: headerBack,
|
|
279
|
+
options,
|
|
280
|
+
route,
|
|
281
|
+
navigation
|
|
282
|
+
})
|
|
283
|
+
}) : null, /*#__PURE__*/_jsx(HeaderShownContext.Provider, {
|
|
284
|
+
value: isParentHeaderShown || headerShown !== false,
|
|
285
|
+
children: /*#__PURE__*/_jsx(HeaderBackContext.Provider, {
|
|
286
|
+
value: headerBack,
|
|
287
|
+
children: render()
|
|
288
|
+
})
|
|
289
|
+
})]
|
|
331
290
|
})
|
|
332
|
-
}
|
|
333
|
-
})
|
|
291
|
+
})
|
|
292
|
+
}, route.key)
|
|
334
293
|
});
|
|
335
294
|
};
|
|
336
295
|
export function NativeStackView({
|