@react-navigation/stack 7.0.0-rc.21 → 7.0.0-rc.23

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/stack",
   "description": "Stack navigator component for iOS and Android with animated transitions and gestures",
-  "version": "7.0.0-rc.21",
+  "version": "7.0.0-rc.23",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -51,12 +51,12 @@
     "clean": "del lib"
   },
   "dependencies": {
-    "@react-navigation/elements": "^2.0.0-rc.19",
+    "@react-navigation/elements": "^2.0.0-rc.21",
     "color": "^4.2.3"
   },
   "devDependencies": {
     "@jest/globals": "^29.7.0",
-    "@react-navigation/native": "^7.0.0-rc.17",
+    "@react-navigation/native": "^7.0.0-rc.18",
     "@testing-library/react-native": "^12.4.3",
     "@types/color": "^3.0.6",
     "@types/react": "~18.2.79",
@@ -70,7 +70,7 @@
     "typescript": "^5.5.2"
   },
   "peerDependencies": {
-    "@react-navigation/native": "^7.0.0-rc.17",
+    "@react-navigation/native": "^7.0.0-rc.18",
     "react": ">= 18.2.0",
     "react-native": ">= 0.72.0",
     "react-native-gesture-handler": ">= 2.0.0",
@@ -102,5 +102,5 @@
       ]
     ]
   },
-  "gitHead": "1a26dd67e4b9625075e6e5229736d1c679c67ccb"
+  "gitHead": "f1b77a90eee4444e990aa86d7feecffff85d020b"
 }

package/src/types.tsx

@@ -199,7 +199,7 @@ export type StackHeaderOptions = Omit<
    * - "generic" – Displays one of the following depending on the available space: truncated title (e.g. 'Back') or no title (only icon).
    * - "minimal" – Always displays only the icon without a title.
    *
-   * Defaults to "default" on iOS, and "minimal" on Android.
+   * Defaults to "default" on iOS, and "minimal" on other platforms.
    */
   headerBackButtonDisplayMode?: HeaderBackButtonDisplayMode;
   /**
@@ -274,10 +274,6 @@ export type StackHeaderRightProps = {
 };
 
 export type StackHeaderLeftProps = HeaderBackButtonProps & {
-  /**
-   * The `href` to use for the anchor tag on web
-   */
-  href?: string;
   /**
    * Whether it's possible to navigate back in stack.
    */

package/src/views/Stack/CardContainer.tsx

@@ -287,6 +287,17 @@ function CardContainerInner({
     >
       <View style={styles.container}>
         <ModalPresentationContext.Provider value={modal}>
+          {headerMode !== 'float'
+            ? renderHeader({
+                mode: 'screen',
+                layout,
+                scenes: [previousScene, scene],
+                getPreviousScene,
+                getFocusedRoute,
+                onContentHeightChange: onHeaderHeightChange,
+                style: styles.header,
+              })
+            : null}
           <View style={styles.scene}>
             <HeaderBackContext.Provider value={headerBack}>
               <HeaderShownContext.Provider
@@ -304,16 +315,6 @@ function CardContainerInner({
               </HeaderShownContext.Provider>
             </HeaderBackContext.Provider>
           </View>
-          {headerMode !== 'float'
-            ? renderHeader({
-                mode: 'screen',
-                layout,
-                scenes: [previousScene, scene],
-                getPreviousScene,
-                getFocusedRoute,
-                onContentHeightChange: onHeaderHeightChange,
-              })
-            : null}
         </ModalPresentationContext.Provider>
       </View>
     </Card>
@@ -325,7 +326,9 @@ export const CardContainer = React.memo(CardContainerInner);
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    flexDirection: 'column-reverse',
+  },
+  header: {
+    zIndex: 1,
   },
   scene: {
     flex: 1,