expo-router 7.0.0-canary-20251216-3f01dbf → 7.0.0-canary-20251223-b83b31e

package/android/build.gradle

@@ -4,13 +4,13 @@ plugins {
 }
 
 group = 'expo.modules.router'
-version = '7.0.0-canary-20251216-3f01dbf'
+version = '7.0.0-canary-20251223-b83b31e'
 
 android {
   namespace "expo.modules.router"
   defaultConfig {
     versionCode 1
-    versionName "7.0.0-canary-20251216-3f01dbf"
+    versionName "7.0.0-canary-20251223-b83b31e"
   }
   lintOptions {
     abortOnError false

package/build/color/index.d.ts

@@ -31,5 +31,49 @@ export interface ColorType {
         dynamic: AndroidDynamicMaterialColor;
     };
 }
+/**
+ * Color utility to access platform-specific colors easily.
+ *
+ * On **Android**, it provides access to:
+ * - System colors, as a type-safe wrapper over `PlatformColor`. For example, `Color.android.background`.
+ * - Attribute colors, as a type-safe wrapper over `PlatformColor`. For example, `Color.android.attr.colorPrimary`.
+ * - [Material Design 3 static colors](https://m3.material.io/styles/color/static/baseline). For example, `Color.android.material.primary`.
+ * - [Material Design 3 dynamic colors](https://m3.material.io/styles/color/dynamic/user-generated-source). For example, `Color.android.dynamic.primary`.
+ *
+ * On **iOS**, it is a type-safe wrapper over `PlatformColor`, providing access to system colors. For example, `Color.ios.label`.
+ *
+ * > **Note**: To ensure the colors align with the system theme on Android, make sure they are used within a component that responds to theme changes, such as by using the `useColorScheme` hook from React Native.
+ *
+ * @example
+ * ```tsx
+ * import { Color } from 'expo-router';
+ *
+ * Color.ios.label; // Access iOS system color
+ * Color.android.background; // Access Android system color
+ * Color.android.attr.colorPrimary; // Access Android attribute color
+ * Color.android.material.primary; // Access Android Material Design 3 static color
+ * Color.android.dynamic.primary; // Access Android Material Design 3 dynamic color
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { Color } from 'expo-router';
+ * import { View, Text, useColorScheme } from 'react-native';
+ *
+ * export default function MyComponent() {
+ *   useColorScheme(); // Ensure the app responds to system theme changes
+ *   return (
+ *     <View style={{ flex: 1, backgroundColor: Color.android.dynamic.primary }}>
+ *       <Text style={{ color: Color.android.dynamic.onPrimary }}>
+ *         Hello, World!
+ *       </Text>
+ *     </View>
+ *   );
+ * }
+ * ```
+ *
+ * @platform android
+ * @platform ios
+ */
 export declare const Color: ColorType;
 //# sourceMappingURL=index.d.ts.map

package/build/color/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/color/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAE9D,OAAO,KAAK,EACV,oBAAoB,EACpB,oBAAoB,EACpB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EACV,oBAAoB,EACpB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,sBAAsB,EACvB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,yBAAyB,CAAC;AAC/E,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,0BAA0B,CAAC;AAC/E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAGhD,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,aAAa,CAAC;AAE5B,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,GACjD,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GACrB,sBAAsB,GAAG;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEJ,MAAM,MAAM,oBAAoB,GAAG,oBAAoB,GACrD,oBAAoB,GACpB,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GAAG;IACtB,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEJ,MAAM,MAAM,oBAAoB,GAAG,8BAA8B,GAAG;IAClE,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,+BAA+B,GAAG;IAC1E,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEF,MAAM,WAAW,SAAS;IACxB,GAAG,EAAE,YAAY,GAAG;QAClB,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;KAC3B,CAAC;IACF,OAAO,EAAE,gBAAgB,GAAG;QAC1B,IAAI,EAAE,oBAAoB,CAAC;QAC3B,QAAQ,EAAE,oBAAoB,CAAC;QAC/B,OAAO,EAAE,2BAA2B,CAAC;KACtC,CAAC;CACH;AAgDD,eAAO,MAAM,KAAK,EAAE,SAOnB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/color/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAE9D,OAAO,KAAK,EACV,oBAAoB,EACpB,oBAAoB,EACpB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EACV,oBAAoB,EACpB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,sBAAsB,EACvB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,yBAAyB,CAAC;AAC/E,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,0BAA0B,CAAC;AAC/E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAGhD,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,aAAa,CAAC;AAE5B,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,GACjD,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GACrB,sBAAsB,GAAG;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEJ,MAAM,MAAM,oBAAoB,GAAG,oBAAoB,GACrD,oBAAoB,GACpB,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GACrB,qBAAqB,GAAG;IACtB,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEJ,MAAM,MAAM,oBAAoB,GAAG,8BAA8B,GAAG;IAClE,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,+BAA+B,GAAG;IAC1E,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEF,MAAM,WAAW,SAAS;IACxB,GAAG,EAAE,YAAY,GAAG;QAClB,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAC;KAC3B,CAAC;IACF,OAAO,EAAE,gBAAgB,GAAG;QAC1B,IAAI,EAAE,oBAAoB,CAAC;QAC3B,QAAQ,EAAE,oBAAoB,CAAC;QAC/B,OAAO,EAAE,2BAA2B,CAAC;KACtC,CAAC;CACH;AA8ED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2CG;AACH,eAAO,MAAM,KAAK,EAAE,SAOnB,CAAC"}

package/build/color/index.js

@@ -24,22 +24,38 @@ __exportStar(require("./android.material.types"), exports);
 __exportStar(require("./ios.types"), exports);
 const iosColor = new Proxy({}, {
     get(_, prop) {
-        return (0, react_native_1.PlatformColor)(prop);
+        if (process.env.EXPO_OS === 'ios') {
+            return (0, react_native_1.PlatformColor)(prop);
+        }
+        console.warn(`Color.ios.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`);
+        return null;
     },
 });
 const androidAttrColor = new Proxy({}, {
     get(_, prop) {
-        return (0, react_native_1.PlatformColor)('?attr/' + prop);
+        if (process.env.EXPO_OS === 'android') {
+            return (0, react_native_1.PlatformColor)('?attr/' + prop);
+        }
+        console.warn(`Color.android.attr.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`);
+        return null;
     },
 });
 const androidMaterialColor = new Proxy({}, {
     get(_, prop) {
-        return (0, materialColor_1.Material3Color)(prop);
+        if (process.env.EXPO_OS === 'android') {
+            return (0, materialColor_1.Material3Color)(prop);
+        }
+        console.warn(`Color.android.material.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`);
+        return null;
     },
 });
 const androidDynamicColor = new Proxy({}, {
     get(_, prop) {
-        return (0, materialColor_1.Material3DynamicColor)(prop);
+        if (process.env.EXPO_OS === 'android') {
+            return (0, materialColor_1.Material3DynamicColor)(prop);
+        }
+        console.warn(`Color.android.dynamic.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`);
+        return null;
     },
 });
 const androidColor = new Proxy({
@@ -57,9 +73,57 @@ const androidColor = new Proxy({
         if (prop in target) {
             return target[prop];
         }
-        return (0, react_native_1.PlatformColor)('@android:color/' + prop);
+        if (process.env.EXPO_OS === 'android') {
+            return (0, react_native_1.PlatformColor)('@android:color/' + prop);
+        }
+        console.warn(`Color.android.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`);
+        return null;
     },
 });
+/**
+ * Color utility to access platform-specific colors easily.
+ *
+ * On **Android**, it provides access to:
+ * - System colors, as a type-safe wrapper over `PlatformColor`. For example, `Color.android.background`.
+ * - Attribute colors, as a type-safe wrapper over `PlatformColor`. For example, `Color.android.attr.colorPrimary`.
+ * - [Material Design 3 static colors](https://m3.material.io/styles/color/static/baseline). For example, `Color.android.material.primary`.
+ * - [Material Design 3 dynamic colors](https://m3.material.io/styles/color/dynamic/user-generated-source). For example, `Color.android.dynamic.primary`.
+ *
+ * On **iOS**, it is a type-safe wrapper over `PlatformColor`, providing access to system colors. For example, `Color.ios.label`.
+ *
+ * > **Note**: To ensure the colors align with the system theme on Android, make sure they are used within a component that responds to theme changes, such as by using the `useColorScheme` hook from React Native.
+ *
+ * @example
+ * ```tsx
+ * import { Color } from 'expo-router';
+ *
+ * Color.ios.label; // Access iOS system color
+ * Color.android.background; // Access Android system color
+ * Color.android.attr.colorPrimary; // Access Android attribute color
+ * Color.android.material.primary; // Access Android Material Design 3 static color
+ * Color.android.dynamic.primary; // Access Android Material Design 3 dynamic color
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { Color } from 'expo-router';
+ * import { View, Text, useColorScheme } from 'react-native';
+ *
+ * export default function MyComponent() {
+ *   useColorScheme(); // Ensure the app responds to system theme changes
+ *   return (
+ *     <View style={{ flex: 1, backgroundColor: Color.android.dynamic.primary }}>
+ *       <Text style={{ color: Color.android.dynamic.onPrimary }}>
+ *         Hello, World!
+ *       </Text>
+ *     </View>
+ *   );
+ * }
+ * ```
+ *
+ * @platform android
+ * @platform ios
+ */
 exports.Color = {
     get ios() {
         return iosColor;

package/build/color/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/color/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,+CAA8D;AAsB9D,mDAAwE;AAExE,wDAAsC;AACtC,uDAAqC;AACrC,0DAAwC;AACxC,2DAAyC;AACzC,8CAA4B;AAwC5B,MAAM,QAAQ,GAAG,IAAI,KAAK,CAAC,EAAsB,EAAE;IACjD,GAAG,CAAC,CAAC,EAAE,IAAY;QACjB,OAAO,IAAA,4BAAa,EAAC,IAAI,CAAC,CAAC;IAC7B,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,gBAAgB,GAAG,IAAI,KAAK,CAAC,EAAkC,EAAE;IACrE,GAAG,CAAC,CAAC,EAAE,IAAY;QACjB,OAAO,IAAA,4BAAa,EAAC,QAAQ,GAAG,IAAI,CAAC,CAAC;IACxC,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,oBAAoB,GAAG,IAAI,KAAK,CAAC,EAAsC,EAAE;IAC7E,GAAG,CAAC,CAAC,EAAE,IAAY;QACjB,OAAO,IAAA,8BAAc,EAAC,IAAI,CAAC,CAAC;IAC9B,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,mBAAmB,GAAG,IAAI,KAAK,CAAC,EAAqC,EAAE;IAC3E,GAAG,CAAC,CAAC,EAAE,IAAY;QACjB,OAAO,IAAA,qCAAqB,EAAC,IAAI,CAAC,CAAC;IACrC,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,YAAY,GAAG,IAAI,KAAK,CAC5B;IACE,IAAI,IAAI;QACN,OAAO,gBAAgB,CAAC;IAC1B,CAAC;IACD,IAAI,QAAQ;QACV,OAAO,oBAAoB,CAAC;IAC9B,CAAC;IACD,IAAI,OAAO;QACT,OAAO,mBAAmB,CAAC;IAC7B,CAAC;CACsB,EACzB;IACE,GAAG,CAAC,MAAM,EAAE,IAAY;QACtB,IAAI,IAAI,IAAI,MAAM,EAAE,CAAC;YACnB,OAAO,MAAM,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC;QACD,OAAO,IAAA,4BAAa,EAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;IACjD,CAAC;CACF,CACF,CAAC;AAEW,QAAA,KAAK,GAAc;IAC9B,IAAI,GAAG;QACL,OAAO,QAAQ,CAAC;IAClB,CAAC;IACD,IAAI,OAAO;QACT,OAAO,YAAY,CAAC;IACtB,CAAC;CACF,CAAC","sourcesContent":["import { PlatformColor, type ColorValue } from 'react-native';\n\nimport type {\n  AndroidColorAttrSDK1,\n  AndroidColorAttrSDK5,\n  AndroidColorAttrSDK14,\n  AndroidColorAttrSDK21,\n  AndroidColorAttrSDK23,\n  AndroidColorAttrSDK25,\n  AndroidColorAttrSDK26,\n} from './android.attr.types';\nimport type {\n  AndroidBaseColorSDK1,\n  AndroidBaseColorSDK14,\n  AndroidBaseColorSDK31,\n  AndroidBaseColorSDK34,\n  AndroidBaseColorSDK35,\n  AndroidDeprecatedColor,\n} from './android.color.types';\nimport type { AndroidDynamicMaterialColorType } from './android.dynamic.types';\nimport type { AndroidStaticMaterialColorType } from './android.material.types';\nimport type { IOSBaseColor } from './ios.types';\nimport { Material3Color, Material3DynamicColor } from './materialColor';\n\nexport * from './android.color.types';\nexport * from './android.attr.types';\nexport * from './android.dynamic.types';\nexport * from './android.material.types';\nexport * from './ios.types';\n\nexport type AndroidBaseColor = AndroidBaseColorSDK1 &\n  AndroidBaseColorSDK14 &\n  AndroidBaseColorSDK31 &\n  AndroidBaseColorSDK34 &\n  AndroidBaseColorSDK35 &\n  AndroidDeprecatedColor & {\n    [key: string]: ColorValue;\n  };\n\nexport type AndroidBaseColorAttr = AndroidColorAttrSDK1 &\n  AndroidColorAttrSDK5 &\n  AndroidColorAttrSDK14 &\n  AndroidColorAttrSDK21 &\n  AndroidColorAttrSDK23 &\n  AndroidColorAttrSDK25 &\n  AndroidColorAttrSDK26 & {\n    [key: string]: ColorValue;\n  };\n\nexport type AndroidMaterialColor = AndroidStaticMaterialColorType & {\n  [key: string]: ColorValue;\n};\n\nexport type AndroidDynamicMaterialColor = AndroidDynamicMaterialColorType & {\n  [key: string]: ColorValue;\n};\n\nexport interface ColorType {\n  ios: IOSBaseColor & {\n    [key: string]: ColorValue;\n  };\n  android: AndroidBaseColor & {\n    attr: AndroidBaseColorAttr;\n    material: AndroidMaterialColor;\n    dynamic: AndroidDynamicMaterialColor;\n  };\n}\n\nconst iosColor = new Proxy({} as ColorType['ios'], {\n  get(_, prop: string) {\n    return PlatformColor(prop);\n  },\n});\n\nconst androidAttrColor = new Proxy({} as ColorType['android']['attr'], {\n  get(_, prop: string) {\n    return PlatformColor('?attr/' + prop);\n  },\n});\n\nconst androidMaterialColor = new Proxy({} as ColorType['android']['material'], {\n  get(_, prop: string) {\n    return Material3Color(prop);\n  },\n});\n\nconst androidDynamicColor = new Proxy({} as ColorType['android']['dynamic'], {\n  get(_, prop: string) {\n    return Material3DynamicColor(prop);\n  },\n});\n\nconst androidColor = new Proxy(\n  {\n    get attr() {\n      return androidAttrColor;\n    },\n    get material() {\n      return androidMaterialColor;\n    },\n    get dynamic() {\n      return androidDynamicColor;\n    },\n  } as ColorType['android'],\n  {\n    get(target, prop: string) {\n      if (prop in target) {\n        return target[prop];\n      }\n      return PlatformColor('@android:color/' + prop);\n    },\n  }\n);\n\nexport const Color: ColorType = {\n  get ios() {\n    return iosColor;\n  },\n  get android() {\n    return androidColor;\n  },\n};\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/color/index.ts"],"names":[],"mappings":"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","sourcesContent":["import { PlatformColor, type ColorValue } from 'react-native';\n\nimport type {\n  AndroidColorAttrSDK1,\n  AndroidColorAttrSDK5,\n  AndroidColorAttrSDK14,\n  AndroidColorAttrSDK21,\n  AndroidColorAttrSDK23,\n  AndroidColorAttrSDK25,\n  AndroidColorAttrSDK26,\n} from './android.attr.types';\nimport type {\n  AndroidBaseColorSDK1,\n  AndroidBaseColorSDK14,\n  AndroidBaseColorSDK31,\n  AndroidBaseColorSDK34,\n  AndroidBaseColorSDK35,\n  AndroidDeprecatedColor,\n} from './android.color.types';\nimport type { AndroidDynamicMaterialColorType } from './android.dynamic.types';\nimport type { AndroidStaticMaterialColorType } from './android.material.types';\nimport type { IOSBaseColor } from './ios.types';\nimport { Material3Color, Material3DynamicColor } from './materialColor';\n\nexport * from './android.color.types';\nexport * from './android.attr.types';\nexport * from './android.dynamic.types';\nexport * from './android.material.types';\nexport * from './ios.types';\n\nexport type AndroidBaseColor = AndroidBaseColorSDK1 &\n  AndroidBaseColorSDK14 &\n  AndroidBaseColorSDK31 &\n  AndroidBaseColorSDK34 &\n  AndroidBaseColorSDK35 &\n  AndroidDeprecatedColor & {\n    [key: string]: ColorValue;\n  };\n\nexport type AndroidBaseColorAttr = AndroidColorAttrSDK1 &\n  AndroidColorAttrSDK5 &\n  AndroidColorAttrSDK14 &\n  AndroidColorAttrSDK21 &\n  AndroidColorAttrSDK23 &\n  AndroidColorAttrSDK25 &\n  AndroidColorAttrSDK26 & {\n    [key: string]: ColorValue;\n  };\n\nexport type AndroidMaterialColor = AndroidStaticMaterialColorType & {\n  [key: string]: ColorValue;\n};\n\nexport type AndroidDynamicMaterialColor = AndroidDynamicMaterialColorType & {\n  [key: string]: ColorValue;\n};\n\nexport interface ColorType {\n  ios: IOSBaseColor & {\n    [key: string]: ColorValue;\n  };\n  android: AndroidBaseColor & {\n    attr: AndroidBaseColorAttr;\n    material: AndroidMaterialColor;\n    dynamic: AndroidDynamicMaterialColor;\n  };\n}\n\nconst iosColor = new Proxy({} as ColorType['ios'], {\n  get(_, prop: string) {\n    if (process.env.EXPO_OS === 'ios') {\n      return PlatformColor(prop);\n    }\n    console.warn(\n      `Color.ios.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`\n    );\n    return null;\n  },\n});\n\nconst androidAttrColor = new Proxy({} as ColorType['android']['attr'], {\n  get(_, prop: string) {\n    if (process.env.EXPO_OS === 'android') {\n      return PlatformColor('?attr/' + prop);\n    }\n    console.warn(\n      `Color.android.attr.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`\n    );\n    return null;\n  },\n});\n\nconst androidMaterialColor = new Proxy({} as ColorType['android']['material'], {\n  get(_, prop: string) {\n    if (process.env.EXPO_OS === 'android') {\n      return Material3Color(prop);\n    }\n    console.warn(\n      `Color.android.material.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`\n    );\n    return null;\n  },\n});\n\nconst androidDynamicColor = new Proxy({} as ColorType['android']['dynamic'], {\n  get(_, prop: string) {\n    if (process.env.EXPO_OS === 'android') {\n      return Material3DynamicColor(prop);\n    }\n    console.warn(\n      `Color.android.dynamic.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`\n    );\n    return null;\n  },\n});\n\nconst androidColor = new Proxy(\n  {\n    get attr() {\n      return androidAttrColor;\n    },\n    get material() {\n      return androidMaterialColor;\n    },\n    get dynamic() {\n      return androidDynamicColor;\n    },\n  } as ColorType['android'],\n  {\n    get(target, prop: string) {\n      if (prop in target) {\n        return target[prop];\n      }\n      if (process.env.EXPO_OS === 'android') {\n        return PlatformColor('@android:color/' + prop);\n      }\n      console.warn(\n        `Color.android.${prop} is not available on ${process.env.EXPO_OS}. Consider using a different color for this platform.`\n      );\n      return null;\n    },\n  }\n);\n\n/**\n * Color utility to access platform-specific colors easily.\n *\n * On **Android**, it provides access to:\n * - System colors, as a type-safe wrapper over `PlatformColor`. For example, `Color.android.background`.\n * - Attribute colors, as a type-safe wrapper over `PlatformColor`. For example, `Color.android.attr.colorPrimary`.\n * - [Material Design 3 static colors](https://m3.material.io/styles/color/static/baseline). For example, `Color.android.material.primary`.\n * - [Material Design 3 dynamic colors](https://m3.material.io/styles/color/dynamic/user-generated-source). For example, `Color.android.dynamic.primary`.\n *\n * On **iOS**, it is a type-safe wrapper over `PlatformColor`, providing access to system colors. For example, `Color.ios.label`.\n *\n * > **Note**: To ensure the colors align with the system theme on Android, make sure they are used within a component that responds to theme changes, such as by using the `useColorScheme` hook from React Native.\n *\n * @example\n * ```tsx\n * import { Color } from 'expo-router';\n *\n * Color.ios.label; // Access iOS system color\n * Color.android.background; // Access Android system color\n * Color.android.attr.colorPrimary; // Access Android attribute color\n * Color.android.material.primary; // Access Android Material Design 3 static color\n * Color.android.dynamic.primary; // Access Android Material Design 3 dynamic color\n * ```\n *\n * @example\n * ```tsx\n * import { Color } from 'expo-router';\n * import { View, Text, useColorScheme } from 'react-native';\n *\n * export default function MyComponent() {\n *   useColorScheme(); // Ensure the app responds to system theme changes\n *   return (\n *     <View style={{ flex: 1, backgroundColor: Color.android.dynamic.primary }}>\n *       <Text style={{ color: Color.android.dynamic.onPrimary }}>\n *         Hello, World!\n *       </Text>\n *     </View>\n *   );\n * }\n * ```\n *\n * @platform android\n * @platform ios\n */\nexport const Color: ColorType = {\n  get ios() {\n    return iosColor;\n  },\n  get android() {\n    return androidColor;\n  },\n};\n"]}

package/build/exports.d.ts

@@ -26,4 +26,5 @@ export type * from './types';
 export * from './color';
 export { Badge, BadgeProps, Icon, IconProps, Label, LabelProps, VectorIcon, VectorIconProps, } from './primitives';
 export * from './layouts/stack-utils';
+export { unstable_navigationEvents } from './navigationEvents';
 //# sourceMappingURL=exports.d.ts.map

package/build/exports.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"exports.d.ts","sourceRoot":"","sources":["../src/exports.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,EACL,SAAS,EACT,qBAAqB,EACrB,WAAW,EACX,yBAAyB,EACzB,qBAAqB,EACrB,oBAAoB,EACpB,WAAW,EACX,iBAAiB,EACjB,sBAAsB,EACtB,aAAa,GACd,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAElD,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAElE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AAG3B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,YAAY,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAGhD;;GAEG;AACH,OAAO,KAAK,YAAY,MAAM,gBAAgB,CAAC;AAG/C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClE,YAAY,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,YAAY,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACtD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD,mBAAmB,SAAS,CAAC;AAE7B,cAAc,SAAS,CAAC;AAExB,OAAO,EACL,KAAK,EACL,UAAU,EACV,IAAI,EACJ,SAAS,EACT,KAAK,EACL,UAAU,EACV,UAAU,EACV,eAAe,GAChB,MAAM,cAAc,CAAC;AAEtB,cAAc,uBAAuB,CAAC"}
+{"version":3,"file":"exports.d.ts","sourceRoot":"","sources":["../src/exports.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,EACL,SAAS,EACT,qBAAqB,EACrB,WAAW,EACX,yBAAyB,EACzB,qBAAqB,EACrB,oBAAoB,EACpB,WAAW,EACX,iBAAiB,EACjB,sBAAsB,EACtB,aAAa,GACd,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAElD,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAElE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AAG3B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,YAAY,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAGhD;;GAEG;AACH,OAAO,KAAK,YAAY,MAAM,gBAAgB,CAAC;AAG/C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClE,YAAY,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,YAAY,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACtD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD,mBAAmB,SAAS,CAAC;AAE7B,cAAc,SAAS,CAAC;AAExB,OAAO,EACL,KAAK,EACL,UAAU,EACV,IAAI,EACJ,SAAS,EACT,KAAK,EACL,UAAU,EACV,UAAU,EACV,eAAe,GAChB,MAAM,cAAc,CAAC;AAEtB,cAAc,uBAAuB,CAAC;AAEtC,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC"}

package/build/exports.js

@@ -36,7 +36,7 @@ var __importStar = (this && this.__importStar) || (function () {
     };
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.VectorIcon = exports.Label = exports.Icon = exports.Badge = exports.useFocusEffect = exports.useNavigation = exports.SplashScreen = exports.ErrorBoundary = exports.useSitemap = exports.Sitemap = exports.Unmatched = exports.ExpoRoot = exports.Slot = exports.Navigator = exports.withLayoutContext = exports.useIsPreview = exports.router = exports.useLoaderData = exports.useRootNavigationState = exports.useRootNavigation = exports.useSegments = exports.useLocalSearchParams = exports.useGlobalSearchParams = exports.useNavigationContainerRef = exports.usePathname = exports.useUnstableGlobalHref = exports.useRouter = void 0;
+exports.unstable_navigationEvents = exports.VectorIcon = exports.Label = exports.Icon = exports.Badge = exports.useFocusEffect = exports.useNavigation = exports.SplashScreen = exports.ErrorBoundary = exports.useSitemap = exports.Sitemap = exports.Unmatched = exports.ExpoRoot = exports.Slot = exports.Navigator = exports.withLayoutContext = exports.useIsPreview = exports.router = exports.useLoaderData = exports.useRootNavigationState = exports.useRootNavigation = exports.useSegments = exports.useLocalSearchParams = exports.useGlobalSearchParams = exports.useNavigationContainerRef = exports.usePathname = exports.useUnstableGlobalHref = exports.useRouter = void 0;
 // Expo Router API
 const Navigator_1 = require("./views/Navigator");
 Object.defineProperty(exports, "Navigator", { enumerable: true, get: function () { return Navigator_1.Navigator; } });
@@ -88,4 +88,6 @@ Object.defineProperty(exports, "Icon", { enumerable: true, get: function () { re
 Object.defineProperty(exports, "Label", { enumerable: true, get: function () { return primitives_1.Label; } });
 Object.defineProperty(exports, "VectorIcon", { enumerable: true, get: function () { return primitives_1.VectorIcon; } });
 __exportStar(require("./layouts/stack-utils"), exports);
+var navigationEvents_1 = require("./navigationEvents");
+Object.defineProperty(exports, "unstable_navigationEvents", { enumerable: true, get: function () { return navigationEvents_1.unstable_navigationEvents; } });
 //# sourceMappingURL=exports.js.map

package/build/exports.js.map

@@ -1 +1 @@
-{"version":3,"file":"exports.js","sourceRoot":"","sources":["../src/exports.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kBAAkB;AAClB,iDAAoD;AAsB3C,0FAtBA,qBAAS,OAsBA;AAAE,qFAtBA,gBAAI,OAsBA;AApBxB,iCAWiB;AAVf,kGAAA,SAAS,OAAA;AACT,8GAAA,qBAAqB,OAAA;AACrB,oGAAA,WAAW,OAAA;AACX,kHAAA,yBAAyB,OAAA;AACzB,8GAAA,qBAAqB,OAAA;AACrB,6GAAA,oBAAoB,OAAA;AACpB,oGAAA,WAAW,OAAA;AACX,0GAAA,iBAAiB,OAAA;AACjB,+GAAA,sBAAsB,OAAA;AACtB,sGAAA,aAAa,OAAA;AAGf,mDAAkD;AAAzC,wGAAA,MAAM,OAAA;AAEf,8CAA4B;AAC5B,kDAAgC;AAChC,0EAAkE;AAAzD,mHAAA,YAAY,OAAA;AAErB,iEAAgE;AAAvD,sHAAA,iBAAiB,OAAA;AAG1B,oBAAoB;AACpB,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,2CAA0C;AAAjC,kGAAA,OAAO,OAAA;AAChB,iDAA6D;AAApD,wGAAA,UAAU,OAAA;AAEnB,uDAAsD;AAA7C,8GAAA,aAAa,OAAA;AAGtB,WAAW;AACX;;GAEG;AACH,+DAA+C;AAE/C,mBAAmB;AACnB,iDAAgD;AAAvC,8GAAA,aAAa,OAAA;AACtB,mDAAkE;AAAzD,gHAAA,cAAc,OAAA;AAQvB,0CAAwB;AAExB,2CASsB;AARpB,mGAAA,KAAK,OAAA;AAEL,kGAAA,IAAI,OAAA;AAEJ,mGAAA,KAAK,OAAA;AAEL,wGAAA,UAAU,OAAA;AAIZ,wDAAsC","sourcesContent":["// Expo Router API\nimport { Navigator, Slot } from './views/Navigator';\n\nexport {\n  useRouter,\n  useUnstableGlobalHref,\n  usePathname,\n  useNavigationContainerRef,\n  useGlobalSearchParams,\n  useLocalSearchParams,\n  useSegments,\n  useRootNavigation,\n  useRootNavigationState,\n  useLoaderData,\n} from './hooks';\n\nexport { router, Router } from './imperative-api';\n\nexport * from './link/Link';\nexport * from './link/elements';\nexport { useIsPreview } from './link/preview/PreviewRouteContext';\n\nexport { withLayoutContext } from './layouts/withLayoutContext';\nexport { Navigator, Slot };\n\n// Expo Router Views\nexport { ExpoRoot } from './ExpoRoot';\nexport { Unmatched } from './views/Unmatched';\nexport { Sitemap } from './views/Sitemap';\nexport { useSitemap, SitemapType } from './views/useSitemap';\nexport { ErrorBoundaryProps } from './views/Try';\nexport { ErrorBoundary } from './views/ErrorBoundary';\nexport type { ScreenProps } from './useScreens';\n\n// Platform\n/**\n * @hidden\n */\nexport * as SplashScreen from './views/Splash';\n\n// React Navigation\nexport { useNavigation } from './useNavigation';\nexport { useFocusEffect, EffectCallback } from './useFocusEffect';\nexport type { ResultState } from './fork/getStateFromPath';\n\nexport type { RedirectConfig } from './getRoutesCore';\nexport type { SingularOptions } from './useScreens';\n\nexport type * from './types';\n\nexport * from './color';\n\nexport {\n  Badge,\n  BadgeProps,\n  Icon,\n  IconProps,\n  Label,\n  LabelProps,\n  VectorIcon,\n  VectorIconProps,\n} from './primitives';\n\nexport * from './layouts/stack-utils';\n"]}
+{"version":3,"file":"exports.js","sourceRoot":"","sources":["../src/exports.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kBAAkB;AAClB,iDAAoD;AAsB3C,0FAtBA,qBAAS,OAsBA;AAAE,qFAtBA,gBAAI,OAsBA;AApBxB,iCAWiB;AAVf,kGAAA,SAAS,OAAA;AACT,8GAAA,qBAAqB,OAAA;AACrB,oGAAA,WAAW,OAAA;AACX,kHAAA,yBAAyB,OAAA;AACzB,8GAAA,qBAAqB,OAAA;AACrB,6GAAA,oBAAoB,OAAA;AACpB,oGAAA,WAAW,OAAA;AACX,0GAAA,iBAAiB,OAAA;AACjB,+GAAA,sBAAsB,OAAA;AACtB,sGAAA,aAAa,OAAA;AAGf,mDAAkD;AAAzC,wGAAA,MAAM,OAAA;AAEf,8CAA4B;AAC5B,kDAAgC;AAChC,0EAAkE;AAAzD,mHAAA,YAAY,OAAA;AAErB,iEAAgE;AAAvD,sHAAA,iBAAiB,OAAA;AAG1B,oBAAoB;AACpB,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,2CAA0C;AAAjC,kGAAA,OAAO,OAAA;AAChB,iDAA6D;AAApD,wGAAA,UAAU,OAAA;AAEnB,uDAAsD;AAA7C,8GAAA,aAAa,OAAA;AAGtB,WAAW;AACX;;GAEG;AACH,+DAA+C;AAE/C,mBAAmB;AACnB,iDAAgD;AAAvC,8GAAA,aAAa,OAAA;AACtB,mDAAkE;AAAzD,gHAAA,cAAc,OAAA;AAQvB,0CAAwB;AAExB,2CASsB;AARpB,mGAAA,KAAK,OAAA;AAEL,kGAAA,IAAI,OAAA;AAEJ,mGAAA,KAAK,OAAA;AAEL,wGAAA,UAAU,OAAA;AAIZ,wDAAsC;AAEtC,uDAA+D;AAAtD,6HAAA,yBAAyB,OAAA","sourcesContent":["// Expo Router API\nimport { Navigator, Slot } from './views/Navigator';\n\nexport {\n  useRouter,\n  useUnstableGlobalHref,\n  usePathname,\n  useNavigationContainerRef,\n  useGlobalSearchParams,\n  useLocalSearchParams,\n  useSegments,\n  useRootNavigation,\n  useRootNavigationState,\n  useLoaderData,\n} from './hooks';\n\nexport { router, Router } from './imperative-api';\n\nexport * from './link/Link';\nexport * from './link/elements';\nexport { useIsPreview } from './link/preview/PreviewRouteContext';\n\nexport { withLayoutContext } from './layouts/withLayoutContext';\nexport { Navigator, Slot };\n\n// Expo Router Views\nexport { ExpoRoot } from './ExpoRoot';\nexport { Unmatched } from './views/Unmatched';\nexport { Sitemap } from './views/Sitemap';\nexport { useSitemap, SitemapType } from './views/useSitemap';\nexport { ErrorBoundaryProps } from './views/Try';\nexport { ErrorBoundary } from './views/ErrorBoundary';\nexport type { ScreenProps } from './useScreens';\n\n// Platform\n/**\n * @hidden\n */\nexport * as SplashScreen from './views/Splash';\n\n// React Navigation\nexport { useNavigation } from './useNavigation';\nexport { useFocusEffect, EffectCallback } from './useFocusEffect';\nexport type { ResultState } from './fork/getStateFromPath';\n\nexport type { RedirectConfig } from './getRoutesCore';\nexport type { SingularOptions } from './useScreens';\n\nexport type * from './types';\n\nexport * from './color';\n\nexport {\n  Badge,\n  BadgeProps,\n  Icon,\n  IconProps,\n  Label,\n  LabelProps,\n  VectorIcon,\n  VectorIconProps,\n} from './primitives';\n\nexport * from './layouts/stack-utils';\n\nexport { unstable_navigationEvents } from './navigationEvents';\n"]}

package/build/layouts/StackClient.d.ts

@@ -165,7 +165,7 @@ declare const Stack: ((props: ComponentProps<typeof RNStack>) => React.JSX.Eleme
         Icon: React.FC<import("./stack-utils").StackHeaderIconProps>;
         Menu: React.FC<import("./stack-utils").StackHeaderMenuProps>;
         MenuAction: React.FC<import("./stack-utils").StackHeaderMenuActionProps>;
-        Item: React.FC<import("./stack-utils").StackHeaderItemProps>;
+        View: React.FC<import("./stack-utils").StackHeaderViewProps>;
         Spacer: React.FC<import("./stack-utils").StackHeaderSpacerProps>;
     };
 };

package/build/layouts/stack-utils/StackHeaderButton.d.ts

@@ -1,8 +1,83 @@
 import type { NativeStackHeaderItemButton } from '@react-navigation/native-stack';
+import type { ReactNode } from 'react';
 import { type StackHeaderItemSharedProps } from './shared';
-export interface StackHeaderButtonProps extends StackHeaderItemSharedProps {
+export interface StackHeaderButtonProps {
+    accessibilityLabel?: string;
+    accessibilityHint?: string;
+    /**
+     * There are two ways to specify the content of the header item:
+     *
+     * @example
+     * ```tsx
+     * import { Stack } from 'expo-router';
+     *
+     * ...
+     * <Stack.Header.Button icon="star.fill">As text passed as children</Stack.Header.Button>
+     * ```
+     *
+     * @example
+     * ```tsx
+     * import { Stack } from 'expo-router';
+     *
+     * ...
+     * <Stack.Header.Button>
+     *   <Stack.Header.Icon sf="star.fill" />
+     *   <Stack.Header.Label>As components</Stack.Header.Label>
+     *   <Stack.Header.Badge>3</Stack.Header.Badge>
+     * </Stack.Header.Button>
+     * ```
+     *
+     * **Note**: When icon is used, the label will not be shown and will be used for accessibility purposes only.
+     */
+    children?: ReactNode;
+    disabled?: boolean;
+    /**
+     * Whether the button should be hidden.
+     *
+     * @default false
+     */
+    hidden?: boolean;
+    /**
+     * Whether to hide the shared background.
+     *
+     * @see [Official Apple documentation](https://developer.apple.com/documentation/uikit/uibarbuttonitem/hidessharedbackground) for more information.
+     *
+     * @platform iOS 26+
+     */
+    hidesSharedBackground?: boolean;
+    /**
+     * Icon to display in the button.
+     *
+     * Can be a string representing an SFSymbol or an image source.
+     */
+    icon?: StackHeaderItemSharedProps['icon'];
     onPress?: () => void;
+    /**
+     * Whether to separate the background of this item from other header items.
+     *
+     * @default false
+     */
+    separateBackground?: boolean;
+    /**
+     * Whether the button is in a selected state
+     *
+     * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uibarbuttonitem/isselected) for more information.
+     */
     selected?: boolean;
+    /**
+     * Style for the label of the header item.
+     */
+    style?: StackHeaderItemSharedProps['style'];
+    /**
+     * The tint color to apply to the button item
+     *
+     * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uibarbuttonitem/tintcolor) for more information.
+     */
+    tintColor?: StackHeaderItemSharedProps['tintColor'];
+    /**
+     * @default 'plain'
+     */
+    variant?: StackHeaderItemSharedProps['variant'];
 }
 /**
  * A header button used inside `Stack.Header.Left` or `Stack.Header.Right`.
@@ -35,5 +110,5 @@ export interface StackHeaderButtonProps extends StackHeaderItemSharedProps {
  * @platform ios
  */
 export declare const StackHeaderButton: React.FC<StackHeaderButtonProps>;
-export declare function convertStackHeaderButtonPropsToRNHeaderItem(props: StackHeaderButtonProps): NativeStackHeaderItemButton;
+export declare function convertStackHeaderButtonPropsToRNHeaderItem(props: StackHeaderButtonProps): NativeStackHeaderItemButton | undefined;
 //# sourceMappingURL=StackHeaderButton.d.ts.map

package/build/layouts/stack-utils/StackHeaderButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackHeaderButton.d.ts","sourceRoot":"","sources":["../../../src/layouts/stack-utils/StackHeaderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,gCAAgC,CAAC;AAElF,OAAO,EAEL,KAAK,0BAA0B,EAChC,MAAM,UAAU,CAAC;AAElB,MAAM,WAAW,sBAAuB,SAAQ,0BAA0B;IACxE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAAc,CAAC;AAE9E,wBAAgB,2CAA2C,CACzD,KAAK,EAAE,sBAAsB,GAC5B,2BAA2B,CAO7B"}
+{"version":3,"file":"StackHeaderButton.d.ts","sourceRoot":"","sources":["../../../src/layouts/stack-utils/StackHeaderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,gCAAgC,CAAC;AAClF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAEL,KAAK,0BAA0B,EAChC,MAAM,UAAU,CAAC;AAElB,MAAM,WAAW,sBAAsB;IACrC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;;;;;;;;;;;;;;;;;;;;;;OAwBG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;;;OAMG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,IAAI,CAAC,EAAE,0BAA0B,CAAC,MAAM,CAAC,CAAC;IAC1C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,0BAA0B,CAAC,OAAO,CAAC,CAAC;IAC5C;;;;OAIG;IACH,SAAS,CAAC,EAAE,0BAA0B,CAAC,WAAW,CAAC,CAAC;IACpD;;OAEG;IACH,OAAO,CAAC,EAAE,0BAA0B,CAAC,SAAS,CAAC,CAAC;CACjD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAAc,CAAC;AAE9E,wBAAgB,2CAA2C,CACzD,KAAK,EAAE,sBAAsB,GAC5B,2BAA2B,GAAG,SAAS,CAUzC"}

package/build/layouts/stack-utils/StackHeaderButton.js

@@ -36,6 +36,9 @@ const shared_1 = require("./shared");
 const StackHeaderButton = () => null;
 exports.StackHeaderButton = StackHeaderButton;
 function convertStackHeaderButtonPropsToRNHeaderItem(props) {
+    if (props.hidden) {
+        return undefined;
+    }
     return {
         ...(0, shared_1.convertStackHeaderSharedPropsToRNSharedHeaderItem)(props),
         type: 'button',

package/build/layouts/stack-utils/StackHeaderButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackHeaderButton.js","sourceRoot":"","sources":["../../../src/layouts/stack-utils/StackHeaderButton.tsx"],"names":[],"mappings":";;;AA4CA,kGASC;AAnDD,qCAGkB;AAOlB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACI,MAAM,iBAAiB,GAAqC,GAAG,EAAE,CAAC,IAAI,CAAC;AAAjE,QAAA,iBAAiB,qBAAgD;AAE9E,SAAgB,2CAA2C,CACzD,KAA6B;IAE7B,OAAO;QACL,GAAG,IAAA,0DAAiD,EAAC,KAAK,CAAC;QAC3D,IAAI,EAAE,QAAQ;QACd,OAAO,EAAE,KAAK,CAAC,OAAO,IAAI,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC;QACpC,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ;KAC3B,CAAC;AACJ,CAAC","sourcesContent":["import type { NativeStackHeaderItemButton } from '@react-navigation/native-stack';\n\nimport {\n  convertStackHeaderSharedPropsToRNSharedHeaderItem,\n  type StackHeaderItemSharedProps,\n} from './shared';\n\nexport interface StackHeaderButtonProps extends StackHeaderItemSharedProps {\n  onPress?: () => void;\n  selected?: boolean;\n}\n\n/**\n * A header button used inside `Stack.Header.Left` or `Stack.Header.Right`.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Screen() {\n *   return (\n *     <>\n *       <ScreenContent />\n *       <Stack.Screen>\n *         <Stack.Header>\n *           <Stack.Header.Left>\n *             <Stack.Header.Button tintColor=\"blue\" icon=\"arrow.left.circle\" onPress={() => alert('Left pressed')} />\n *             <Stack.Header.Button style={{ color: 'green' }} onPress={() => alert('2 pressed')}>\n *               <Stack.Header.Label>2</Stack.Header.Label>\n *             </Stack.Header.Button>\n *           </Stack.Header.Left>\n *         </Stack.Header>\n *       </Stack.Screen>\n *     </>\n *   );\n * }\n * ```\n *\n * @see [Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/toolbars) for more information about navigation bar items on iOS.\n *\n * @platform ios\n */\nexport const StackHeaderButton: React.FC<StackHeaderButtonProps> = () => null;\n\nexport function convertStackHeaderButtonPropsToRNHeaderItem(\n  props: StackHeaderButtonProps\n): NativeStackHeaderItemButton {\n  return {\n    ...convertStackHeaderSharedPropsToRNSharedHeaderItem(props),\n    type: 'button',\n    onPress: props.onPress ?? (() => {}),\n    selected: !!props.selected,\n  };\n}\n"]}
+{"version":3,"file":"StackHeaderButton.js","sourceRoot":"","sources":["../../../src/layouts/stack-utils/StackHeaderButton.tsx"],"names":[],"mappings":";;;AAuHA,kGAYC;AAhID,qCAGkB;AAiFlB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACI,MAAM,iBAAiB,GAAqC,GAAG,EAAE,CAAC,IAAI,CAAC;AAAjE,QAAA,iBAAiB,qBAAgD;AAE9E,SAAgB,2CAA2C,CACzD,KAA6B;IAE7B,IAAI,KAAK,CAAC,MAAM,EAAE,CAAC;QACjB,OAAO,SAAS,CAAC;IACnB,CAAC;IACD,OAAO;QACL,GAAG,IAAA,0DAAiD,EAAC,KAAK,CAAC;QAC3D,IAAI,EAAE,QAAQ;QACd,OAAO,EAAE,KAAK,CAAC,OAAO,IAAI,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC;QACpC,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ;KAC3B,CAAC;AACJ,CAAC","sourcesContent":["import type { NativeStackHeaderItemButton } from '@react-navigation/native-stack';\nimport type { ReactNode } from 'react';\n\nimport {\n  convertStackHeaderSharedPropsToRNSharedHeaderItem,\n  type StackHeaderItemSharedProps,\n} from './shared';\n\nexport interface StackHeaderButtonProps {\n  accessibilityLabel?: string;\n  accessibilityHint?: string;\n  /**\n   * There are two ways to specify the content of the header item:\n   *\n   * @example\n   * ```tsx\n   * import { Stack } from 'expo-router';\n   *\n   * ...\n   * <Stack.Header.Button icon=\"star.fill\">As text passed as children</Stack.Header.Button>\n   * ```\n   *\n   * @example\n   * ```tsx\n   * import { Stack } from 'expo-router';\n   *\n   * ...\n   * <Stack.Header.Button>\n   *   <Stack.Header.Icon sf=\"star.fill\" />\n   *   <Stack.Header.Label>As components</Stack.Header.Label>\n   *   <Stack.Header.Badge>3</Stack.Header.Badge>\n   * </Stack.Header.Button>\n   * ```\n   *\n   * **Note**: When icon is used, the label will not be shown and will be used for accessibility purposes only.\n   */\n  children?: ReactNode;\n  disabled?: boolean;\n  /**\n   * Whether the button should be hidden.\n   *\n   * @default false\n   */\n  hidden?: boolean;\n  /**\n   * Whether to hide the shared background.\n   *\n   * @see [Official Apple documentation](https://developer.apple.com/documentation/uikit/uibarbuttonitem/hidessharedbackground) for more information.\n   *\n   * @platform iOS 26+\n   */\n  hidesSharedBackground?: boolean;\n  /**\n   * Icon to display in the button.\n   *\n   * Can be a string representing an SFSymbol or an image source.\n   */\n  icon?: StackHeaderItemSharedProps['icon'];\n  onPress?: () => void;\n  /**\n   * Whether to separate the background of this item from other header items.\n   *\n   * @default false\n   */\n  separateBackground?: boolean;\n  /**\n   * Whether the button is in a selected state\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uibarbuttonitem/isselected) for more information.\n   */\n  selected?: boolean;\n  /**\n   * Style for the label of the header item.\n   */\n  style?: StackHeaderItemSharedProps['style'];\n  /**\n   * The tint color to apply to the button item\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uibarbuttonitem/tintcolor) for more information.\n   */\n  tintColor?: StackHeaderItemSharedProps['tintColor'];\n  /**\n   * @default 'plain'\n   */\n  variant?: StackHeaderItemSharedProps['variant'];\n}\n\n/**\n * A header button used inside `Stack.Header.Left` or `Stack.Header.Right`.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Screen() {\n *   return (\n *     <>\n *       <ScreenContent />\n *       <Stack.Screen>\n *         <Stack.Header>\n *           <Stack.Header.Left>\n *             <Stack.Header.Button tintColor=\"blue\" icon=\"arrow.left.circle\" onPress={() => alert('Left pressed')} />\n *             <Stack.Header.Button style={{ color: 'green' }} onPress={() => alert('2 pressed')}>\n *               <Stack.Header.Label>2</Stack.Header.Label>\n *             </Stack.Header.Button>\n *           </Stack.Header.Left>\n *         </Stack.Header>\n *       </Stack.Screen>\n *     </>\n *   );\n * }\n * ```\n *\n * @see [Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/toolbars) for more information about navigation bar items on iOS.\n *\n * @platform ios\n */\nexport const StackHeaderButton: React.FC<StackHeaderButtonProps> = () => null;\n\nexport function convertStackHeaderButtonPropsToRNHeaderItem(\n  props: StackHeaderButtonProps\n): NativeStackHeaderItemButton | undefined {\n  if (props.hidden) {\n    return undefined;\n  }\n  return {\n    ...convertStackHeaderSharedPropsToRNSharedHeaderItem(props),\n    type: 'button',\n    onPress: props.onPress ?? (() => {}),\n    selected: !!props.selected,\n  };\n}\n"]}

package/build/layouts/stack-utils/StackHeaderLeftRight.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackHeaderLeftRight.d.ts","sourceRoot":"","sources":["../../../src/layouts/stack-utils/StackHeaderLeftRight.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAC;AAC9E,OAAO,KAAK,EAAE,EAA4B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAgBxE,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAK1D,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAK5D,CAAC;AA+CF,wBAAgB,oCAAoC,CAClD,OAAO,EAAE,4BAA4B,EACrC,KAAK,EAAE,qBAAqB,GAC3B,4BAA4B,CAe9B;AAED,wBAAgB,mCAAmC,CACjD,OAAO,EAAE,4BAA4B,EACrC,KAAK,EAAE,oBAAoB,GAC1B,4BAA4B,CAW9B"}
+{"version":3,"file":"StackHeaderLeftRight.d.ts","sourceRoot":"","sources":["../../../src/layouts/stack-utils/StackHeaderLeftRight.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAC;AAC9E,OAAO,KAAK,EAAE,EAA4B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAgBxE,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAK1D,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAK5D,CAAC;AAiDF,wBAAgB,oCAAoC,CAClD,OAAO,EAAE,4BAA4B,EACrC,KAAK,EAAE,qBAAqB,GAC3B,4BAA4B,CAe9B;AAED,wBAAgB,mCAAmC,CACjD,OAAO,EAAE,4BAA4B,EACrC,KAAK,EAAE,oBAAoB,GAC1B,4BAA4B,CAW9B"}

package/build/layouts/stack-utils/StackHeaderLeftRight.js

@@ -39,9 +39,9 @@ exports.appendStackHeaderLeftPropsToOptions = appendStackHeaderLeftPropsToOption
 const react_1 = __importStar(require("react"));
 const react_2 = require("react");
 const StackHeaderButton_1 = require("./StackHeaderButton");
-const StackHeaderItem_1 = require("./StackHeaderItem");
 const StackHeaderMenu_1 = require("./StackHeaderMenu");
 const StackHeaderSpacer_1 = require("./StackHeaderSpacer");
+const StackHeaderView_1 = require("./StackHeaderView");
 const children_1 = require("../../utils/children");
 const Screen_1 = require("../../views/Screen");
 /**
@@ -147,7 +147,7 @@ function convertHeaderRightLeftChildrenToUnstableItems(children, side) {
     const actions = allChildren.filter((child) => (0, children_1.isChildOfType)(child, StackHeaderButton_1.StackHeaderButton) ||
         (0, children_1.isChildOfType)(child, StackHeaderMenu_1.StackHeaderMenu) ||
         (0, children_1.isChildOfType)(child, StackHeaderSpacer_1.StackHeaderSpacer) ||
-        (0, children_1.isChildOfType)(child, StackHeaderItem_1.StackHeaderItem));
+        (0, children_1.isChildOfType)(child, StackHeaderView_1.StackHeaderView));
     if (actions.length !== allChildren.length && process.env.NODE_ENV !== 'production') {
         const otherElements = allChildren
             .filter((child) => !actions.some((action) => action === child))
@@ -164,7 +164,8 @@ function convertHeaderRightLeftChildrenToUnstableItems(children, side) {
         });
         console.warn(`Stack.Header.${side} only accepts <Stack.Header.Button>, <Stack.Header.Menu>, <Menu>, and <Stack.Header.Item> as children. Found invalid children: ${otherElements.join(', ')}`);
     }
-    return () => actions.map((action) => {
+    return () => actions
+        .map((action) => {
         if ((0, children_1.isChildOfType)(action, StackHeaderButton_1.StackHeaderButton)) {
             return (0, StackHeaderButton_1.convertStackHeaderButtonPropsToRNHeaderItem)(action.props);
         }
@@ -174,8 +175,9 @@ function convertHeaderRightLeftChildrenToUnstableItems(children, side) {
         else if ((0, children_1.isChildOfType)(action, StackHeaderSpacer_1.StackHeaderSpacer)) {
             return (0, StackHeaderSpacer_1.convertStackHeaderSpacerPropsToRNHeaderItem)(action.props);
         }
-        return (0, StackHeaderItem_1.convertStackHeaderItemPropsToRNHeaderItem)(action.props);
-    });
+        return (0, StackHeaderView_1.convertStackHeaderViewPropsToRNHeaderItem)(action.props);
+    })
+        .filter((item) => !!item);
 }
 function appendStackHeaderRightPropsToOptions(options, props) {
     if (props.asChild) {

package/build/layouts/stack-utils/StackHeaderLeftRight.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackHeaderLeftRight.js","sourceRoot":"","sources":["../../../src/layouts/stack-utils/StackHeaderLeftRight.tsx"],"names":[],"mappings":"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","sourcesContent":["import { NativeStackNavigationOptions } from '@react-navigation/native-stack';\nimport React, { Fragment, isValidElement, type ReactNode } from 'react';\nimport { useMemo } from 'react';\n\nimport {\n  convertStackHeaderButtonPropsToRNHeaderItem,\n  StackHeaderButton,\n} from './StackHeaderButton';\nimport { convertStackHeaderItemPropsToRNHeaderItem, StackHeaderItem } from './StackHeaderItem';\nimport { convertStackHeaderMenuPropsToRNHeaderItem, StackHeaderMenu } from './StackHeaderMenu';\nimport {\n  convertStackHeaderSpacerPropsToRNHeaderItem,\n  StackHeaderSpacer,\n} from './StackHeaderSpacer';\nimport { isChildOfType } from '../../utils/children';\nimport { Screen } from '../../views/Screen';\n\nexport interface StackHeaderLeftProps {\n  /**\n   * Child elements to compose the left area of the header. Can include Stack.Header.Button,\n   * Stack.Header.Menu, Stack.Header.Item, and Stack.Header.Spacer components.\n   */\n  children?: ReactNode;\n  /**\n   * When `true`, renders children as a custom component in the header left area,\n   * replacing the default header left layout.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\nexport interface StackHeaderRightProps {\n  /**\n   * Child elements to compose the right area of the header. Can include Stack.Header.Button,\n   * Stack.Header.Menu, Stack.Header.Item, and Stack.Header.Spacer components.\n   */\n  children?: ReactNode;\n  /**\n   * When `true`, renders children as a custom component in the header right area,\n   * replacing the default header right layout.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\n/**\n * The component used to configure the left area of the stack header.\n *\n * When used inside a screen, it allows you to customize the left side of the header dynamically.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Header.Left>\n *         <Stack.Header.Button onPress={() => alert('Left button pressed!')} />\n *       </Stack.Header.Left>\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * When used inside the layout, it needs to be wrapped in `Stack.Header` to take effect.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Layout() {\n *   return (\n *     <Stack>\n *       <Stack.Screen name=\"index\">\n *         <Stack.Header>\n *           <Stack.Header.Left>\n *             <Stack.Header.Button onPress={() => alert('Left button pressed!')} />\n *           </Stack.Header.Left>\n *         </Stack.Header>\n *       </Stack.Screen>\n *     </Stack>\n *   );\n * }\n * ```\n */\nexport const StackHeaderLeft: React.FC<StackHeaderLeftProps> = (props) => {\n  // This component will only render when used inside a page\n  // but only if it is not wrapped in Stack.Screen.Header\n  const updatedOptions = useMemo(() => appendStackHeaderLeftPropsToOptions({}, props), [props]);\n  return <Screen options={updatedOptions} />;\n};\n\n/**\n * The component used to configure the right area of the stack header.\n *\n * When used inside a screen, it allows you to customize the right side of the header dynamically.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Header.Right>\n *         <Stack.Header.Button onPress={() => alert('Right button pressed!')} />\n *       </Stack.Header.Right>\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * When used inside the layout, it needs to be wrapped in `Stack.Header` to take effect.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Layout() {\n *   return (\n *     <Stack>\n *       <Stack.Screen name=\"index\">\n *         <Stack.Header>\n *           <Stack.Header.Right>\n *             <Stack.Header.Button onPress={() => alert('Right button pressed!')} />\n *           </Stack.Header.Right>\n *         </Stack.Header>\n *       </Stack.Screen>\n *     </Stack>\n *   );\n * }\n * ```\n */\nexport const StackHeaderRight: React.FC<StackHeaderRightProps> = (props) => {\n  // This component will only render when used inside a page\n  // but only if it is not wrapped in Stack.Screen.Header\n  const updatedOptions = useMemo(() => appendStackHeaderRightPropsToOptions({}, props), [props]);\n  return <Screen options={updatedOptions} />;\n};\n\nfunction convertHeaderRightLeftChildrenToUnstableItems(\n  children: React.ReactNode,\n  side: 'Left' | 'Right'\n):\n  | NativeStackNavigationOptions['unstable_headerRightItems']\n  | NativeStackNavigationOptions['unstable_headerLeftItems'] {\n  const allChildren = React.Children.toArray(children);\n  const actions = allChildren.filter(\n    (child) =>\n      isChildOfType(child, StackHeaderButton) ||\n      isChildOfType(child, StackHeaderMenu) ||\n      isChildOfType(child, StackHeaderSpacer) ||\n      isChildOfType(child, StackHeaderItem)\n  );\n  if (actions.length !== allChildren.length && process.env.NODE_ENV !== 'production') {\n    const otherElements = allChildren\n      .filter((child) => !actions.some((action) => action === child))\n      .map((e) => {\n        if (isValidElement(e)) {\n          if (e.type === Fragment) {\n            return '<Fragment>';\n          } else {\n            return (e.type as { name: string })?.name ?? e.type;\n          }\n        }\n\n        return String(e);\n      });\n    console.warn(\n      `Stack.Header.${side} only accepts <Stack.Header.Button>, <Stack.Header.Menu>, <Menu>, and <Stack.Header.Item> as children. Found invalid children: ${otherElements.join(', ')}`\n    );\n  }\n  return () =>\n    actions.map((action) => {\n      if (isChildOfType(action, StackHeaderButton)) {\n        return convertStackHeaderButtonPropsToRNHeaderItem(action.props);\n      } else if (isChildOfType(action, StackHeaderMenu)) {\n        return convertStackHeaderMenuPropsToRNHeaderItem(action.props);\n      } else if (isChildOfType(action, StackHeaderSpacer)) {\n        return convertStackHeaderSpacerPropsToRNHeaderItem(action.props);\n      }\n      return convertStackHeaderItemPropsToRNHeaderItem(action.props);\n    });\n}\n\nexport function appendStackHeaderRightPropsToOptions(\n  options: NativeStackNavigationOptions,\n  props: StackHeaderRightProps\n): NativeStackNavigationOptions {\n  if (props.asChild) {\n    return {\n      ...options,\n      headerRight: () => props.children,\n    };\n  }\n\n  return {\n    ...options,\n    unstable_headerRightItems: convertHeaderRightLeftChildrenToUnstableItems(\n      props.children,\n      'Right'\n    ),\n  };\n}\n\nexport function appendStackHeaderLeftPropsToOptions(\n  options: NativeStackNavigationOptions,\n  props: StackHeaderLeftProps\n): NativeStackNavigationOptions {\n  if (props.asChild) {\n    return {\n      ...options,\n      headerLeft: () => props.children,\n    };\n  }\n  return {\n    ...options,\n    unstable_headerLeftItems: convertHeaderRightLeftChildrenToUnstableItems(props.children, 'Left'),\n  };\n}\n"]}
+{"version":3,"file":"StackHeaderLeftRight.js","sourceRoot":"","sources":["../../../src/layouts/stack-utils/StackHeaderLeftRight.tsx"],"names":[],"mappings":"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","sourcesContent":["import { NativeStackNavigationOptions } from '@react-navigation/native-stack';\nimport React, { Fragment, isValidElement, type ReactNode } from 'react';\nimport { useMemo } from 'react';\n\nimport {\n  convertStackHeaderButtonPropsToRNHeaderItem,\n  StackHeaderButton,\n} from './StackHeaderButton';\nimport { convertStackHeaderMenuPropsToRNHeaderItem, StackHeaderMenu } from './StackHeaderMenu';\nimport {\n  convertStackHeaderSpacerPropsToRNHeaderItem,\n  StackHeaderSpacer,\n} from './StackHeaderSpacer';\nimport { convertStackHeaderViewPropsToRNHeaderItem, StackHeaderView } from './StackHeaderView';\nimport { isChildOfType } from '../../utils/children';\nimport { Screen } from '../../views/Screen';\n\nexport interface StackHeaderLeftProps {\n  /**\n   * Child elements to compose the left area of the header. Can include Stack.Header.Button,\n   * Stack.Header.Menu, Stack.Header.Item, and Stack.Header.Spacer components.\n   */\n  children?: ReactNode;\n  /**\n   * When `true`, renders children as a custom component in the header left area,\n   * replacing the default header left layout.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\nexport interface StackHeaderRightProps {\n  /**\n   * Child elements to compose the right area of the header. Can include Stack.Header.Button,\n   * Stack.Header.Menu, Stack.Header.Item, and Stack.Header.Spacer components.\n   */\n  children?: ReactNode;\n  /**\n   * When `true`, renders children as a custom component in the header right area,\n   * replacing the default header right layout.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\n/**\n * The component used to configure the left area of the stack header.\n *\n * When used inside a screen, it allows you to customize the left side of the header dynamically.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Header.Left>\n *         <Stack.Header.Button onPress={() => alert('Left button pressed!')} />\n *       </Stack.Header.Left>\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * When used inside the layout, it needs to be wrapped in `Stack.Header` to take effect.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Layout() {\n *   return (\n *     <Stack>\n *       <Stack.Screen name=\"index\">\n *         <Stack.Header>\n *           <Stack.Header.Left>\n *             <Stack.Header.Button onPress={() => alert('Left button pressed!')} />\n *           </Stack.Header.Left>\n *         </Stack.Header>\n *       </Stack.Screen>\n *     </Stack>\n *   );\n * }\n * ```\n */\nexport const StackHeaderLeft: React.FC<StackHeaderLeftProps> = (props) => {\n  // This component will only render when used inside a page\n  // but only if it is not wrapped in Stack.Screen.Header\n  const updatedOptions = useMemo(() => appendStackHeaderLeftPropsToOptions({}, props), [props]);\n  return <Screen options={updatedOptions} />;\n};\n\n/**\n * The component used to configure the right area of the stack header.\n *\n * When used inside a screen, it allows you to customize the right side of the header dynamically.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Header.Right>\n *         <Stack.Header.Button onPress={() => alert('Right button pressed!')} />\n *       </Stack.Header.Right>\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * When used inside the layout, it needs to be wrapped in `Stack.Header` to take effect.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Layout() {\n *   return (\n *     <Stack>\n *       <Stack.Screen name=\"index\">\n *         <Stack.Header>\n *           <Stack.Header.Right>\n *             <Stack.Header.Button onPress={() => alert('Right button pressed!')} />\n *           </Stack.Header.Right>\n *         </Stack.Header>\n *       </Stack.Screen>\n *     </Stack>\n *   );\n * }\n * ```\n */\nexport const StackHeaderRight: React.FC<StackHeaderRightProps> = (props) => {\n  // This component will only render when used inside a page\n  // but only if it is not wrapped in Stack.Screen.Header\n  const updatedOptions = useMemo(() => appendStackHeaderRightPropsToOptions({}, props), [props]);\n  return <Screen options={updatedOptions} />;\n};\n\nfunction convertHeaderRightLeftChildrenToUnstableItems(\n  children: React.ReactNode,\n  side: 'Left' | 'Right'\n):\n  | NativeStackNavigationOptions['unstable_headerRightItems']\n  | NativeStackNavigationOptions['unstable_headerLeftItems'] {\n  const allChildren = React.Children.toArray(children);\n  const actions = allChildren.filter(\n    (child) =>\n      isChildOfType(child, StackHeaderButton) ||\n      isChildOfType(child, StackHeaderMenu) ||\n      isChildOfType(child, StackHeaderSpacer) ||\n      isChildOfType(child, StackHeaderView)\n  );\n  if (actions.length !== allChildren.length && process.env.NODE_ENV !== 'production') {\n    const otherElements = allChildren\n      .filter((child) => !actions.some((action) => action === child))\n      .map((e) => {\n        if (isValidElement(e)) {\n          if (e.type === Fragment) {\n            return '<Fragment>';\n          } else {\n            return (e.type as { name: string })?.name ?? e.type;\n          }\n        }\n\n        return String(e);\n      });\n    console.warn(\n      `Stack.Header.${side} only accepts <Stack.Header.Button>, <Stack.Header.Menu>, <Menu>, and <Stack.Header.Item> as children. Found invalid children: ${otherElements.join(', ')}`\n    );\n  }\n  return () =>\n    actions\n      .map((action) => {\n        if (isChildOfType(action, StackHeaderButton)) {\n          return convertStackHeaderButtonPropsToRNHeaderItem(action.props);\n        } else if (isChildOfType(action, StackHeaderMenu)) {\n          return convertStackHeaderMenuPropsToRNHeaderItem(action.props);\n        } else if (isChildOfType(action, StackHeaderSpacer)) {\n          return convertStackHeaderSpacerPropsToRNHeaderItem(action.props);\n        }\n        return convertStackHeaderViewPropsToRNHeaderItem(action.props);\n      })\n      .filter((item) => !!item);\n}\n\nexport function appendStackHeaderRightPropsToOptions(\n  options: NativeStackNavigationOptions,\n  props: StackHeaderRightProps\n): NativeStackNavigationOptions {\n  if (props.asChild) {\n    return {\n      ...options,\n      headerRight: () => props.children,\n    };\n  }\n\n  return {\n    ...options,\n    unstable_headerRightItems: convertHeaderRightLeftChildrenToUnstableItems(\n      props.children,\n      'Right'\n    ),\n  };\n}\n\nexport function appendStackHeaderLeftPropsToOptions(\n  options: NativeStackNavigationOptions,\n  props: StackHeaderLeftProps\n): NativeStackNavigationOptions {\n  if (props.asChild) {\n    return {\n      ...options,\n      headerLeft: () => props.children,\n    };\n  }\n  return {\n    ...options,\n    unstable_headerLeftItems: convertHeaderRightLeftChildrenToUnstableItems(props.children, 'Left'),\n  };\n}\n"]}