expo-router 7.0.0-canary-20260114-d8e19f5 → 7.0.0-canary-20260119-70f7c28

package/build/layouts/stack-utils/screen/StackScreenBackButton.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StackScreenBackButton = StackScreenBackButton;
+exports.appendStackScreenBackButtonPropsToOptions = appendStackScreenBackButtonPropsToOptions;
+const react_1 = require("react");
+const Screen_1 = require("../../../views/Screen");
+/**
+ * Component to configure the back button.
+ *
+ * Can be used inside Stack.Screen in a layout or directly inside a screen component.
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Layout() {
+ *   return (
+ *     <Stack>
+ *       <Stack.Screen name="detail">
+ *         <Stack.Screen.BackButton displayMode="minimal">Back</Stack.Screen.BackButton>
+ *       </Stack.Screen>
+ *     </Stack>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Screen.BackButton hidden />
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @platform ios
+ */
+function StackScreenBackButton(props) {
+    const updatedOptions = (0, react_1.useMemo)(() => appendStackScreenBackButtonPropsToOptions({}, props), [props]);
+    return <Screen_1.Screen options={updatedOptions}/>;
+}
+function appendStackScreenBackButtonPropsToOptions(options, props) {
+    return {
+        ...options,
+        headerBackTitle: props.children,
+        headerBackTitleStyle: props.style,
+        headerBackImageSource: props.src,
+        headerBackButtonDisplayMode: props.displayMode,
+        headerBackButtonMenuEnabled: props.withMenu,
+        headerBackVisible: !props.hidden,
+    };
+}
+//# sourceMappingURL=StackScreenBackButton.js.map

package/build/layouts/stack-utils/screen/StackScreenBackButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackScreenBackButton.js","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/screen/StackScreenBackButton.tsx"],"names":[],"mappings":";;AAsEA,sDAMC;AAED,8FAaC;AA1FD,iCAAgC;AAIhC,kDAA+C;AA6B/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,SAAgB,qBAAqB,CAAC,KAAiC;IACrE,MAAM,cAAc,GAAG,IAAA,eAAO,EAC5B,GAAG,EAAE,CAAC,yCAAyC,CAAC,EAAE,EAAE,KAAK,CAAC,EAC1D,CAAC,KAAK,CAAC,CACR,CAAC;IACF,OAAO,CAAC,eAAM,CAAC,OAAO,CAAC,CAAC,cAAc,CAAC,EAAG,CAAC;AAC7C,CAAC;AAED,SAAgB,yCAAyC,CACvD,OAAqC,EACrC,KAAiC;IAEjC,OAAO;QACL,GAAG,OAAO;QACV,eAAe,EAAE,KAAK,CAAC,QAAQ;QAC/B,oBAAoB,EAAE,KAAK,CAAC,KAAK;QACjC,qBAAqB,EAAE,KAAK,CAAC,GAAG;QAChC,2BAA2B,EAAE,KAAK,CAAC,WAAW;QAC9C,2BAA2B,EAAE,KAAK,CAAC,QAAQ;QAC3C,iBAAiB,EAAE,CAAC,KAAK,CAAC,MAAM;KACjC,CAAC;AACJ,CAAC","sourcesContent":["import { NativeStackNavigationOptions } from '@react-navigation/native-stack';\nimport { useMemo } from 'react';\nimport type { ImageSourcePropType } from 'react-native';\nimport type { ScreenStackHeaderConfigProps } from 'react-native-screens';\n\nimport { Screen } from '../../../views/Screen';\n\nexport interface StackScreenBackButtonProps {\n  /**\n   * The title to display for the back button.\n   */\n  children?: string;\n  /**\n   * Style for the back button title.\n   */\n  style?: NativeStackNavigationOptions['headerBackTitleStyle'];\n  /**\n   * Whether to show a context menu when long pressing the back button.\n   */\n  withMenu?: boolean;\n  /**\n   * The display mode for the back button.\n   */\n  displayMode?: ScreenStackHeaderConfigProps['backButtonDisplayMode'];\n  /**\n   * Whether to hide the back button.\n   */\n  hidden?: boolean;\n  /**\n   * Custom image source for the back button.\n   */\n  src?: ImageSourcePropType;\n}\n\n/**\n * Component to configure the back button.\n *\n * Can be used inside Stack.Screen in a layout or directly inside a screen component.\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=\"detail\">\n *         <Stack.Screen.BackButton displayMode=\"minimal\">Back</Stack.Screen.BackButton>\n *       </Stack.Screen>\n *     </Stack>\n *   );\n * }\n * ```\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Screen.BackButton hidden />\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * @platform ios\n */\nexport function StackScreenBackButton(props: StackScreenBackButtonProps) {\n  const updatedOptions = useMemo(\n    () => appendStackScreenBackButtonPropsToOptions({}, props),\n    [props]\n  );\n  return <Screen options={updatedOptions} />;\n}\n\nexport function appendStackScreenBackButtonPropsToOptions(\n  options: NativeStackNavigationOptions,\n  props: StackScreenBackButtonProps\n): NativeStackNavigationOptions {\n  return {\n    ...options,\n    headerBackTitle: props.children,\n    headerBackTitleStyle: props.style,\n    headerBackImageSource: props.src,\n    headerBackButtonDisplayMode: props.displayMode,\n    headerBackButtonMenuEnabled: props.withMenu,\n    headerBackVisible: !props.hidden,\n  };\n}\n"]}

package/build/layouts/stack-utils/screen/StackScreenTitle.d.ts

@@ -0,0 +1,58 @@
+import { NativeStackNavigationOptions } from '@react-navigation/native-stack';
+import { type StyleProp, type TextStyle } from 'react-native';
+export type StackScreenTitleProps = {
+    children?: string;
+    style?: StyleProp<{
+        fontFamily?: TextStyle['fontFamily'];
+        fontSize?: TextStyle['fontSize'];
+        fontWeight?: Exclude<TextStyle['fontWeight'], number>;
+        color?: string;
+        textAlign?: 'left' | 'center';
+    }>;
+    largeStyle?: StyleProp<{
+        fontFamily?: TextStyle['fontFamily'];
+        fontSize?: TextStyle['fontSize'];
+        fontWeight?: Exclude<TextStyle['fontWeight'], number>;
+        color?: string;
+    }>;
+    large?: boolean;
+};
+/**
+ * Component to set the screen title.
+ *
+ * Can be used inside Stack.Screen in a layout or directly inside a screen component.
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Layout() {
+ *   return (
+ *     <Stack>
+ *       <Stack.Screen name="index">
+ *         <Stack.Screen.Title large>Home</Stack.Screen.Title>
+ *       </Stack.Screen>
+ *     </Stack>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Screen.Title>My Page</Stack.Screen.Title>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @platform ios
+ */
+export declare function StackScreenTitle(props: StackScreenTitleProps): import("react").JSX.Element;
+export declare function appendStackScreenTitlePropsToOptions(options: NativeStackNavigationOptions, props: StackScreenTitleProps): NativeStackNavigationOptions;
+//# sourceMappingURL=StackScreenTitle.d.ts.map

package/build/layouts/stack-utils/screen/StackScreenTitle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackScreenTitle.d.ts","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/screen/StackScreenTitle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAC;AAE9E,OAAO,EAAc,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAK1E,MAAM,MAAM,qBAAqB,GAAG;IAClC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;QAChB,UAAU,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;QACrC,QAAQ,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;QACjC,UAAU,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC,CAAC;QAGtD,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,SAAS,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;KAC/B,CAAC,CAAC;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;QACrB,UAAU,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;QACrC,QAAQ,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;QACjC,UAAU,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC,CAAC;QAGtD,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC,CAAC;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,+BAG5D;AAED,wBAAgB,oCAAoC,CAClD,OAAO,EAAE,4BAA4B,EACrC,KAAK,EAAE,qBAAqB,GAC3B,4BAA4B,CA0B9B"}

package/build/layouts/stack-utils/screen/StackScreenTitle.js

@@ -0,0 +1,75 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StackScreenTitle = StackScreenTitle;
+exports.appendStackScreenTitlePropsToOptions = appendStackScreenTitlePropsToOptions;
+const react_1 = require("react");
+const react_native_1 = require("react-native");
+const style_1 = require("../../../utils/style");
+const Screen_1 = require("../../../views/Screen");
+/**
+ * Component to set the screen title.
+ *
+ * Can be used inside Stack.Screen in a layout or directly inside a screen component.
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Layout() {
+ *   return (
+ *     <Stack>
+ *       <Stack.Screen name="index">
+ *         <Stack.Screen.Title large>Home</Stack.Screen.Title>
+ *       </Stack.Screen>
+ *     </Stack>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Screen.Title>My Page</Stack.Screen.Title>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @platform ios
+ */
+function StackScreenTitle(props) {
+    const updatedOptions = (0, react_1.useMemo)(() => appendStackScreenTitlePropsToOptions({}, props), [props]);
+    return <Screen_1.Screen options={updatedOptions}/>;
+}
+function appendStackScreenTitlePropsToOptions(options, props) {
+    const flattenedStyle = react_native_1.StyleSheet.flatten(props.style);
+    const flattenedLargeStyle = react_native_1.StyleSheet.flatten(props.largeStyle);
+    return {
+        ...options,
+        title: props.children,
+        headerLargeTitle: props.large,
+        headerTitleAlign: flattenedStyle?.textAlign,
+        headerTitleStyle: {
+            ...flattenedStyle,
+            ...(flattenedStyle?.fontWeight
+                ? {
+                    fontWeight: (0, style_1.convertFontWeightToStringFontWeight)(flattenedStyle?.fontWeight),
+                }
+                : {}),
+        },
+        headerLargeTitleStyle: {
+            ...flattenedLargeStyle,
+            ...(flattenedLargeStyle?.fontWeight
+                ? {
+                    fontWeight: (0, style_1.convertFontWeightToStringFontWeight)(flattenedLargeStyle?.fontWeight),
+                }
+                : {}),
+        },
+    };
+}
+//# sourceMappingURL=StackScreenTitle.js.map

package/build/layouts/stack-utils/screen/StackScreenTitle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackScreenTitle.js","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/screen/StackScreenTitle.tsx"],"names":[],"mappings":";;AAiEA,4CAGC;AAED,oFA6BC;AAlGD,iCAAgC;AAChC,+CAA0E;AAE1E,gDAA2E;AAC3E,kDAA+C;AAwB/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,SAAgB,gBAAgB,CAAC,KAA4B;IAC3D,MAAM,cAAc,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,oCAAoC,CAAC,EAAE,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAC/F,OAAO,CAAC,eAAM,CAAC,OAAO,CAAC,CAAC,cAAc,CAAC,EAAG,CAAC;AAC7C,CAAC;AAED,SAAgB,oCAAoC,CAClD,OAAqC,EACrC,KAA4B;IAE5B,MAAM,cAAc,GAAG,yBAAU,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IACvD,MAAM,mBAAmB,GAAG,yBAAU,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;IAEjE,OAAO;QACL,GAAG,OAAO;QACV,KAAK,EAAE,KAAK,CAAC,QAAQ;QACrB,gBAAgB,EAAE,KAAK,CAAC,KAAK;QAC7B,gBAAgB,EAAE,cAAc,EAAE,SAAS;QAC3C,gBAAgB,EAAE;YAChB,GAAG,cAAc;YACjB,GAAG,CAAC,cAAc,EAAE,UAAU;gBAC5B,CAAC,CAAC;oBACE,UAAU,EAAE,IAAA,2CAAmC,EAAC,cAAc,EAAE,UAAU,CAAC;iBAC5E;gBACH,CAAC,CAAC,EAAE,CAAC;SACR;QACD,qBAAqB,EAAE;YACrB,GAAG,mBAAmB;YACtB,GAAG,CAAC,mBAAmB,EAAE,UAAU;gBACjC,CAAC,CAAC;oBACE,UAAU,EAAE,IAAA,2CAAmC,EAAC,mBAAmB,EAAE,UAAU,CAAC;iBACjF;gBACH,CAAC,CAAC,EAAE,CAAC;SACR;KACF,CAAC;AACJ,CAAC","sourcesContent":["import { NativeStackNavigationOptions } from '@react-navigation/native-stack';\nimport { useMemo } from 'react';\nimport { StyleSheet, type StyleProp, type TextStyle } from 'react-native';\n\nimport { convertFontWeightToStringFontWeight } from '../../../utils/style';\nimport { Screen } from '../../../views/Screen';\n\nexport type StackScreenTitleProps = {\n  children?: string;\n  style?: StyleProp<{\n    fontFamily?: TextStyle['fontFamily'];\n    fontSize?: TextStyle['fontSize'];\n    fontWeight?: Exclude<TextStyle['fontWeight'], number>;\n    // TODO(@ubax): This should be ColorValue, but react-navigation types\n    // currently only accept string for color props. In RN v8 we can change this to ColorValue.\n    color?: string;\n    textAlign?: 'left' | 'center';\n  }>;\n  largeStyle?: StyleProp<{\n    fontFamily?: TextStyle['fontFamily'];\n    fontSize?: TextStyle['fontSize'];\n    fontWeight?: Exclude<TextStyle['fontWeight'], number>;\n    // TODO(@ubax): This should be ColorValue, but react-navigation types\n    // currently only accept string for color props. In RN v8 we can change this to ColorValue.\n    color?: string;\n  }>;\n  large?: boolean;\n};\n\n/**\n * Component to set the screen title.\n *\n * Can be used inside Stack.Screen in a layout or directly inside a screen component.\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.Screen.Title large>Home</Stack.Screen.Title>\n *       </Stack.Screen>\n *     </Stack>\n *   );\n * }\n * ```\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Screen.Title>My Page</Stack.Screen.Title>\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * @platform ios\n */\nexport function StackScreenTitle(props: StackScreenTitleProps) {\n  const updatedOptions = useMemo(() => appendStackScreenTitlePropsToOptions({}, props), [props]);\n  return <Screen options={updatedOptions} />;\n}\n\nexport function appendStackScreenTitlePropsToOptions(\n  options: NativeStackNavigationOptions,\n  props: StackScreenTitleProps\n): NativeStackNavigationOptions {\n  const flattenedStyle = StyleSheet.flatten(props.style);\n  const flattenedLargeStyle = StyleSheet.flatten(props.largeStyle);\n\n  return {\n    ...options,\n    title: props.children,\n    headerLargeTitle: props.large,\n    headerTitleAlign: flattenedStyle?.textAlign,\n    headerTitleStyle: {\n      ...flattenedStyle,\n      ...(flattenedStyle?.fontWeight\n        ? {\n            fontWeight: convertFontWeightToStringFontWeight(flattenedStyle?.fontWeight),\n          }\n        : {}),\n    },\n    headerLargeTitleStyle: {\n      ...flattenedLargeStyle,\n      ...(flattenedLargeStyle?.fontWeight\n        ? {\n            fontWeight: convertFontWeightToStringFontWeight(flattenedLargeStyle?.fontWeight),\n          }\n        : {}),\n    },\n  };\n}\n"]}

package/build/layouts/stack-utils/screen/index.d.ts

@@ -0,0 +1,3 @@
+export { StackScreenTitle, appendStackScreenTitlePropsToOptions, type StackScreenTitleProps, } from './StackScreenTitle';
+export { StackScreenBackButton, appendStackScreenBackButtonPropsToOptions, type StackScreenBackButtonProps, } from './StackScreenBackButton';
+//# sourceMappingURL=index.d.ts.map

package/build/layouts/stack-utils/screen/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/screen/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,oCAAoC,EACpC,KAAK,qBAAqB,GAC3B,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EACL,qBAAqB,EACrB,yCAAyC,EACzC,KAAK,0BAA0B,GAChC,MAAM,yBAAyB,CAAC"}

package/build/layouts/stack-utils/screen/index.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.appendStackScreenBackButtonPropsToOptions = exports.StackScreenBackButton = exports.appendStackScreenTitlePropsToOptions = exports.StackScreenTitle = void 0;
+var StackScreenTitle_1 = require("./StackScreenTitle");
+Object.defineProperty(exports, "StackScreenTitle", { enumerable: true, get: function () { return StackScreenTitle_1.StackScreenTitle; } });
+Object.defineProperty(exports, "appendStackScreenTitlePropsToOptions", { enumerable: true, get: function () { return StackScreenTitle_1.appendStackScreenTitlePropsToOptions; } });
+var StackScreenBackButton_1 = require("./StackScreenBackButton");
+Object.defineProperty(exports, "StackScreenBackButton", { enumerable: true, get: function () { return StackScreenBackButton_1.StackScreenBackButton; } });
+Object.defineProperty(exports, "appendStackScreenBackButtonPropsToOptions", { enumerable: true, get: function () { return StackScreenBackButton_1.appendStackScreenBackButtonPropsToOptions; } });
+//# sourceMappingURL=index.js.map

package/build/layouts/stack-utils/screen/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/screen/index.tsx"],"names":[],"mappings":";;;AAAA,uDAI4B;AAH1B,oHAAA,gBAAgB,OAAA;AAChB,wIAAA,oCAAoC,OAAA;AAItC,iEAIiC;AAH/B,8HAAA,qBAAqB,OAAA;AACrB,kJAAA,yCAAyC,OAAA","sourcesContent":["export {\n  StackScreenTitle,\n  appendStackScreenTitlePropsToOptions,\n  type StackScreenTitleProps,\n} from './StackScreenTitle';\n\nexport {\n  StackScreenBackButton,\n  appendStackScreenBackButtonPropsToOptions,\n  type StackScreenBackButtonProps,\n} from './StackScreenBackButton';\n"]}

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

@@ -10,14 +10,14 @@ function convertStackHeaderSharedPropsToRNSharedHeaderItem(props) {
     const stringChildren = react_1.Children.toArray(children)
         .filter((child) => typeof child === 'string')
         .join('');
-    const label = (0, children_1.getFirstChildOfType)(children, common_primitives_1.StackHeaderLabel);
+    const label = (0, children_1.getFirstChildOfType)(children, common_primitives_1.StackToolbarLabel);
     const iconPropConvertedToIcon = props.icon
         ? typeof props.icon === 'string'
             ? { sf: props.icon }
             : { src: props.icon }
         : undefined;
-    const iconComponentProps = (0, children_1.getFirstChildOfType)(children, common_primitives_1.StackHeaderIcon)?.props ?? iconPropConvertedToIcon;
-    const badgeComponent = (0, children_1.getFirstChildOfType)(children, common_primitives_1.StackHeaderBadge);
+    const iconComponentProps = (0, children_1.getFirstChildOfType)(children, common_primitives_1.StackToolbarIcon)?.props ?? iconPropConvertedToIcon;
+    const badgeComponent = (0, children_1.getFirstChildOfType)(children, common_primitives_1.StackToolbarBadge);
     const rnsIcon = (() => {
         if (!iconComponentProps) {
             return undefined;

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

@@ -1 +1 @@
-{"version":3,"file":"shared.js","sourceRoot":"","sources":["../../../src/layouts/stack-utils/shared.ts"],"names":[],"mappings":";;AA2CA,8GAqDC;AA/FD,iCAAiD;AAIjD,2DAA0F;AAC1F,mDAA2D;AAC3D,2CAAsF;AAoCtF,SAAgB,iDAAiD,CAC/D,KAAiC;IAEjC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IACrE,MAAM,cAAc,GAAG,gBAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC;SAC9C,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC;SAC5C,IAAI,CAAC,EAAE,CAAC,CAAC;IACZ,MAAM,KAAK,GAAG,IAAA,8BAAmB,EAAC,QAAQ,EAAE,oCAAgB,CAAC,CAAC;IAC9D,MAAM,uBAAuB,GAAG,KAAK,CAAC,IAAI;QACxC,CAAC,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ;YAC9B,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,IAAI,EAAE;YACpB,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,IAAI,EAAE;QACvB,CAAC,CAAC,SAAS,CAAC;IACd,MAAM,kBAAkB,GACtB,IAAA,8BAAmB,EAAC,QAAQ,EAAE,mCAAe,CAAC,EAAE,KAAK,IAAI,uBAAuB,CAAC;IACnF,MAAM,cAAc,GAAG,IAAA,8BAAmB,EAAC,QAAQ,EAAE,oCAAgB,CAAC,CAAC;IACvE,MAAM,OAAO,GAAwC,CAAC,GAAG,EAAE;QACzD,IAAI,CAAC,kBAAkB,EAAE,CAAC;YACxB,OAAO,SAAS,CAAC;QACnB,CAAC;QACD,IAAI,KAAK,IAAI,kBAAkB,EAAE,CAAC;YAChC,OAAO;gBACL,IAAI,EAAE,OAAO;gBACb,MAAM,EAAE,kBAAkB,CAAC,GAAG;aAC/B,CAAC;QACJ,CAAC;QACD,OAAO;YACL,IAAI,EAAE,UAAU;YAChB,IAAI,EAAE,kBAAkB,CAAC,EAAE;SAC5B,CAAC;IACJ,CAAC,CAAC,EAAE,CAAC;IACL,MAAM,IAAI,GAAuB;QAC/B,GAAG,IAAI;QACP,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,QAAQ,IAAI,cAAc;QAC9C,gBAAgB,EAAE,CAAC,kBAAkB;KACtC,CAAC;IACF,IAAI,KAAK,EAAE,CAAC;QACV,MAAM,cAAc,GAAG,IAAA,oCAA6B,EAAC,KAAK,CAAC,IAAI,EAAE,CAAC;QAClE,IAAI,CAAC,UAAU,GAAG,cAAc,CAAC;IACnC,CAAC;IACD,IAAI,cAAc,EAAE,CAAC;QACnB,IAAI,CAAC,KAAK,GAAG;YACX,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,QAAQ,IAAI,EAAE;SAC3C,CAAC;QACF,MAAM,UAAU,GAAG,IAAA,oCAA6B,EAAC,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC7E,IAAI,UAAU,EAAE,CAAC;YACf,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,UAAU,CAAC;QAChC,CAAC;IACH,CAAC;IACD,IAAI,OAAO,EAAE,CAAC;QACZ,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC;IACtB,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC","sourcesContent":["import type { NativeStackHeaderItemButton } from '@react-navigation/native-stack';\nimport { Children, type ReactNode } from 'react';\nimport { type ColorValue, type ImageSourcePropType, type StyleProp } from 'react-native';\nimport type { SFSymbol } from 'sf-symbols-typescript';\n\nimport { StackHeaderBadge, StackHeaderIcon, StackHeaderLabel } from './common-primitives';\nimport { getFirstChildOfType } from '../../utils/children';\nimport { convertTextStyleToRNTextStyle, type BasicTextStyle } from '../../utils/font';\n\nexport interface StackHeaderItemSharedProps {\n  children?: ReactNode;\n  style?: StyleProp<BasicTextStyle>;\n  hidesSharedBackground?: boolean;\n  separateBackground?: boolean;\n  accessibilityLabel?: string;\n  accessibilityHint?: string;\n  disabled?: boolean;\n  tintColor?: ColorValue;\n  icon?: SFSymbol | ImageSourcePropType;\n  /**\n   * @default 'plain'\n   */\n  variant?: 'plain' | 'done' | 'prominent';\n}\n\n// We need to pick these properties, as the SharedHeaderItem is not exported by React Navigation\ntype RNSharedHeaderItem = Pick<\n  NativeStackHeaderItemButton,\n  | 'label'\n  | 'labelStyle'\n  | 'icon'\n  | 'variant'\n  | 'tintColor'\n  | 'disabled'\n  | 'width'\n  | 'hidesSharedBackground'\n  | 'sharesBackground'\n  | 'identifier'\n  | 'badge'\n  | 'accessibilityLabel'\n  | 'accessibilityHint'\n>;\n\nexport function convertStackHeaderSharedPropsToRNSharedHeaderItem(\n  props: StackHeaderItemSharedProps\n): RNSharedHeaderItem {\n  const { children, style, separateBackground, icon, ...rest } = props;\n  const stringChildren = Children.toArray(children)\n    .filter((child) => typeof child === 'string')\n    .join('');\n  const label = getFirstChildOfType(children, StackHeaderLabel);\n  const iconPropConvertedToIcon = props.icon\n    ? typeof props.icon === 'string'\n      ? { sf: props.icon }\n      : { src: props.icon }\n    : undefined;\n  const iconComponentProps =\n    getFirstChildOfType(children, StackHeaderIcon)?.props ?? iconPropConvertedToIcon;\n  const badgeComponent = getFirstChildOfType(children, StackHeaderBadge);\n  const rnsIcon: NativeStackHeaderItemButton['icon'] = (() => {\n    if (!iconComponentProps) {\n      return undefined;\n    }\n    if ('src' in iconComponentProps) {\n      return {\n        type: 'image',\n        source: iconComponentProps.src,\n      };\n    }\n    return {\n      type: 'sfSymbol',\n      name: iconComponentProps.sf,\n    };\n  })();\n  const item: RNSharedHeaderItem = {\n    ...rest,\n    label: label?.props.children ?? stringChildren,\n    sharesBackground: !separateBackground,\n  };\n  if (style) {\n    const convertedStyle = convertTextStyleToRNTextStyle(style) ?? {};\n    item.labelStyle = convertedStyle;\n  }\n  if (badgeComponent) {\n    item.badge = {\n      value: badgeComponent.props.children ?? '',\n    };\n    const badgeStyle = convertTextStyleToRNTextStyle(badgeComponent.props.style);\n    if (badgeStyle) {\n      item.badge.style = badgeStyle;\n    }\n  }\n  if (rnsIcon) {\n    item.icon = rnsIcon;\n  }\n  return item;\n}\n"]}
+{"version":3,"file":"shared.js","sourceRoot":"","sources":["../../../src/layouts/stack-utils/shared.ts"],"names":[],"mappings":";;AA2CA,8GAqDC;AA/FD,iCAAiD;AAIjD,2DAA6F;AAC7F,mDAA2D;AAC3D,2CAAsF;AAoCtF,SAAgB,iDAAiD,CAC/D,KAAiC;IAEjC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IACrE,MAAM,cAAc,GAAG,gBAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC;SAC9C,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC;SAC5C,IAAI,CAAC,EAAE,CAAC,CAAC;IACZ,MAAM,KAAK,GAAG,IAAA,8BAAmB,EAAC,QAAQ,EAAE,qCAAiB,CAAC,CAAC;IAC/D,MAAM,uBAAuB,GAAG,KAAK,CAAC,IAAI;QACxC,CAAC,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ;YAC9B,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,IAAI,EAAE;YACpB,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,IAAI,EAAE;QACvB,CAAC,CAAC,SAAS,CAAC;IACd,MAAM,kBAAkB,GACtB,IAAA,8BAAmB,EAAC,QAAQ,EAAE,oCAAgB,CAAC,EAAE,KAAK,IAAI,uBAAuB,CAAC;IACpF,MAAM,cAAc,GAAG,IAAA,8BAAmB,EAAC,QAAQ,EAAE,qCAAiB,CAAC,CAAC;IACxE,MAAM,OAAO,GAAwC,CAAC,GAAG,EAAE;QACzD,IAAI,CAAC,kBAAkB,EAAE,CAAC;YACxB,OAAO,SAAS,CAAC;QACnB,CAAC;QACD,IAAI,KAAK,IAAI,kBAAkB,EAAE,CAAC;YAChC,OAAO;gBACL,IAAI,EAAE,OAAO;gBACb,MAAM,EAAE,kBAAkB,CAAC,GAAG;aAC/B,CAAC;QACJ,CAAC;QACD,OAAO;YACL,IAAI,EAAE,UAAU;YAChB,IAAI,EAAE,kBAAkB,CAAC,EAAE;SAC5B,CAAC;IACJ,CAAC,CAAC,EAAE,CAAC;IACL,MAAM,IAAI,GAAuB;QAC/B,GAAG,IAAI;QACP,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,QAAQ,IAAI,cAAc;QAC9C,gBAAgB,EAAE,CAAC,kBAAkB;KACtC,CAAC;IACF,IAAI,KAAK,EAAE,CAAC;QACV,MAAM,cAAc,GAAG,IAAA,oCAA6B,EAAC,KAAK,CAAC,IAAI,EAAE,CAAC;QAClE,IAAI,CAAC,UAAU,GAAG,cAAc,CAAC;IACnC,CAAC;IACD,IAAI,cAAc,EAAE,CAAC;QACnB,IAAI,CAAC,KAAK,GAAG;YACX,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,QAAQ,IAAI,EAAE;SAC3C,CAAC;QACF,MAAM,UAAU,GAAG,IAAA,oCAA6B,EAAC,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC7E,IAAI,UAAU,EAAE,CAAC;YACf,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,UAAU,CAAC;QAChC,CAAC;IACH,CAAC;IACD,IAAI,OAAO,EAAE,CAAC;QACZ,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC;IACtB,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC","sourcesContent":["import type { NativeStackHeaderItemButton } from '@react-navigation/native-stack';\nimport { Children, type ReactNode } from 'react';\nimport { type ColorValue, type ImageSourcePropType, type StyleProp } from 'react-native';\nimport type { SFSymbol } from 'sf-symbols-typescript';\n\nimport { StackToolbarBadge, StackToolbarIcon, StackToolbarLabel } from './common-primitives';\nimport { getFirstChildOfType } from '../../utils/children';\nimport { convertTextStyleToRNTextStyle, type BasicTextStyle } from '../../utils/font';\n\nexport interface StackHeaderItemSharedProps {\n  children?: ReactNode;\n  style?: StyleProp<BasicTextStyle>;\n  hidesSharedBackground?: boolean;\n  separateBackground?: boolean;\n  accessibilityLabel?: string;\n  accessibilityHint?: string;\n  disabled?: boolean;\n  tintColor?: ColorValue;\n  icon?: SFSymbol | ImageSourcePropType;\n  /**\n   * @default 'plain'\n   */\n  variant?: 'plain' | 'done' | 'prominent';\n}\n\n// We need to pick these properties, as the SharedHeaderItem is not exported by React Navigation\ntype RNSharedHeaderItem = Pick<\n  NativeStackHeaderItemButton,\n  | 'label'\n  | 'labelStyle'\n  | 'icon'\n  | 'variant'\n  | 'tintColor'\n  | 'disabled'\n  | 'width'\n  | 'hidesSharedBackground'\n  | 'sharesBackground'\n  | 'identifier'\n  | 'badge'\n  | 'accessibilityLabel'\n  | 'accessibilityHint'\n>;\n\nexport function convertStackHeaderSharedPropsToRNSharedHeaderItem(\n  props: StackHeaderItemSharedProps\n): RNSharedHeaderItem {\n  const { children, style, separateBackground, icon, ...rest } = props;\n  const stringChildren = Children.toArray(children)\n    .filter((child) => typeof child === 'string')\n    .join('');\n  const label = getFirstChildOfType(children, StackToolbarLabel);\n  const iconPropConvertedToIcon = props.icon\n    ? typeof props.icon === 'string'\n      ? { sf: props.icon }\n      : { src: props.icon }\n    : undefined;\n  const iconComponentProps =\n    getFirstChildOfType(children, StackToolbarIcon)?.props ?? iconPropConvertedToIcon;\n  const badgeComponent = getFirstChildOfType(children, StackToolbarBadge);\n  const rnsIcon: NativeStackHeaderItemButton['icon'] = (() => {\n    if (!iconComponentProps) {\n      return undefined;\n    }\n    if ('src' in iconComponentProps) {\n      return {\n        type: 'image',\n        source: iconComponentProps.src,\n      };\n    }\n    return {\n      type: 'sfSymbol',\n      name: iconComponentProps.sf,\n    };\n  })();\n  const item: RNSharedHeaderItem = {\n    ...rest,\n    label: label?.props.children ?? stringChildren,\n    sharesBackground: !separateBackground,\n  };\n  if (style) {\n    const convertedStyle = convertTextStyleToRNTextStyle(style) ?? {};\n    item.labelStyle = convertedStyle;\n  }\n  if (badgeComponent) {\n    item.badge = {\n      value: badgeComponent.props.children ?? '',\n    };\n    const badgeStyle = convertTextStyleToRNTextStyle(badgeComponent.props.style);\n    if (badgeStyle) {\n      item.badge.style = badgeStyle;\n    }\n  }\n  if (rnsIcon) {\n    item.icon = rnsIcon;\n  }\n  return item;\n}\n"]}

package/build/layouts/stack-utils/toolbar/StackToolbar.d.ts

@@ -0,0 +1,3 @@
+import StackToolbar from './StackToolbarClient';
+export { StackToolbar };
+//# sourceMappingURL=StackToolbar.d.ts.map

package/build/layouts/stack-utils/toolbar/StackToolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackToolbar.d.ts","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/toolbar/StackToolbar.tsx"],"names":[],"mappings":"AACA,OAAO,YAAY,MAAM,sBAAsB,CAAC;AAiBhD,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/build/layouts/stack-utils/toolbar/StackToolbar.js

@@ -0,0 +1,24 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StackToolbar = void 0;
+const StackToolbarButton_1 = require("./StackToolbarButton");
+const StackToolbarClient_1 = __importDefault(require("./StackToolbarClient"));
+exports.StackToolbar = StackToolbarClient_1.default;
+const StackToolbarMenu_1 = require("./StackToolbarMenu");
+const StackToolbarSearchBarSlot_1 = require("./StackToolbarSearchBarSlot");
+const StackToolbarSpacer_1 = require("./StackToolbarSpacer");
+const StackToolbarView_1 = require("./StackToolbarView");
+const common_primitives_1 = require("../common-primitives");
+StackToolbarClient_1.default.Button = StackToolbarButton_1.StackToolbarButton;
+StackToolbarClient_1.default.Menu = StackToolbarMenu_1.StackToolbarMenu;
+StackToolbarClient_1.default.MenuAction = StackToolbarMenu_1.StackToolbarMenuAction;
+StackToolbarClient_1.default.SearchBarSlot = StackToolbarSearchBarSlot_1.StackToolbarSearchBarSlot;
+StackToolbarClient_1.default.Spacer = StackToolbarSpacer_1.StackToolbarSpacer;
+StackToolbarClient_1.default.View = StackToolbarView_1.StackToolbarView;
+StackToolbarClient_1.default.Label = common_primitives_1.StackToolbarLabel;
+StackToolbarClient_1.default.Icon = common_primitives_1.StackToolbarIcon;
+StackToolbarClient_1.default.Badge = common_primitives_1.StackToolbarBadge;
+//# sourceMappingURL=StackToolbar.js.map

package/build/layouts/stack-utils/toolbar/StackToolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackToolbar.js","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/toolbar/StackToolbar.tsx"],"names":[],"mappings":";;;;;;AAAA,6DAA0D;AAC1D,8EAAgD;AAiBvC,uBAjBF,4BAAY,CAiBE;AAhBrB,yDAA8E;AAC9E,2EAAwE;AACxE,6DAA0D;AAC1D,yDAAsD;AACtD,4DAA8F;AAE9F,4BAAY,CAAC,MAAM,GAAG,uCAAkB,CAAC;AACzC,4BAAY,CAAC,IAAI,GAAG,mCAAgB,CAAC;AACrC,4BAAY,CAAC,UAAU,GAAG,yCAAsB,CAAC;AACjD,4BAAY,CAAC,aAAa,GAAG,qDAAyB,CAAC;AACvD,4BAAY,CAAC,MAAM,GAAG,uCAAkB,CAAC;AACzC,4BAAY,CAAC,IAAI,GAAG,mCAAgB,CAAC;AACrC,4BAAY,CAAC,KAAK,GAAG,qCAAiB,CAAC;AACvC,4BAAY,CAAC,IAAI,GAAG,oCAAgB,CAAC;AACrC,4BAAY,CAAC,KAAK,GAAG,qCAAiB,CAAC","sourcesContent":["import { StackToolbarButton } from './StackToolbarButton';\nimport StackToolbar from './StackToolbarClient';\nimport { StackToolbarMenu, StackToolbarMenuAction } from './StackToolbarMenu';\nimport { StackToolbarSearchBarSlot } from './StackToolbarSearchBarSlot';\nimport { StackToolbarSpacer } from './StackToolbarSpacer';\nimport { StackToolbarView } from './StackToolbarView';\nimport { StackToolbarBadge, StackToolbarIcon, StackToolbarLabel } from '../common-primitives';\n\nStackToolbar.Button = StackToolbarButton;\nStackToolbar.Menu = StackToolbarMenu;\nStackToolbar.MenuAction = StackToolbarMenuAction;\nStackToolbar.SearchBarSlot = StackToolbarSearchBarSlot;\nStackToolbar.Spacer = StackToolbarSpacer;\nStackToolbar.View = StackToolbarView;\nStackToolbar.Label = StackToolbarLabel;\nStackToolbar.Icon = StackToolbarIcon;\nStackToolbar.Badge = StackToolbarBadge;\n\nexport { StackToolbar };\n"]}

package/build/layouts/stack-utils/toolbar/StackToolbarButton.d.ts

@@ -0,0 +1,144 @@
+import type { NativeStackHeaderItemButton } from '@react-navigation/native-stack';
+import type { ImageRef } from 'expo-image';
+import type { ReactNode } from 'react';
+import type { StyleProp, TextStyle } from 'react-native';
+import { type StackHeaderItemSharedProps } from '../shared';
+export interface StackToolbarButtonProps {
+    accessibilityLabel?: string;
+    accessibilityHint?: string;
+    /**
+     * There are two ways to specify the content of the button:
+     *
+     * @example
+     * ```tsx
+     * import { Stack } from 'expo-router';
+     *
+     * export default function Page() {
+     *   return (
+     *     <>
+     *       <Stack.Toolbar placement="left">
+     *         <Stack.Toolbar.Button icon="star.fill">As text passed as children</Stack.Toolbar.Button>
+     *       </Stack.Toolbar>
+     *       <ScreenContent />
+     *     </>
+     *   );
+     * }
+     * ```
+     *
+     * @example
+     * ```tsx
+     * import { Stack } from 'expo-router';
+     *
+     * export default function Page() {
+     *   return (
+     *     <>
+     *       <Stack.Toolbar placement="left">
+     *         <Stack.Toolbar.Button>
+     *           <Stack.Toolbar.Icon sf="star.fill" />
+     *           <Stack.Toolbar.Label>As components</Stack.Toolbar.Label>
+     *           <Stack.Toolbar.Badge>3</Stack.Toolbar.Badge>
+     *         </Stack.Toolbar.Button>
+     *       </Stack.Toolbar>
+     *       <ScreenContent />
+     *     </>
+     *   );
+     * }
+     * ```
+     *
+     * > **Note**: When icon is used, the label will not be shown and will be used for accessibility purposes only. Badge is only supported in left/right placements, not in bottom (iOS toolbar limitation).
+     */
+    children?: ReactNode;
+    disabled?: boolean;
+    /**
+     * Whether the button should be hidden.
+     *
+     * @default false
+     */
+    hidden?: boolean;
+    /**
+     * Whether to hide the shared background.
+     *
+     * @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'];
+    /**
+     * Image to display in the button.
+     *
+     * > **Note**: This prop is only supported in `Stack.Toolbar.Bottom`.
+     */
+    image?: ImageRef;
+    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?: StyleProp<TextStyle>;
+    /**
+     * 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 button used inside `Stack.Toolbar`.
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Layout() {
+ *   return (
+ *     <Stack>
+ *       <Stack.Screen name="index">
+ *         <Stack.Toolbar placement="left">
+ *           <Stack.Toolbar.Button icon="arrow.left.circle" onPress={() => alert('Left pressed')} />
+ *         </Stack.Toolbar>
+ *       </Stack.Screen>
+ *     </Stack>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Toolbar placement="left">
+ *         <Stack.Toolbar.Button icon="arrow.left.circle" onPress={() => alert('Left pressed')} />
+ *       </Stack.Toolbar>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @platform ios
+ */
+export declare const StackToolbarButton: React.FC<StackToolbarButtonProps>;
+export declare function convertStackToolbarButtonPropsToRNHeaderItem(props: StackToolbarButtonProps): NativeStackHeaderItemButton | undefined;
+//# sourceMappingURL=StackToolbarButton.d.ts.map

package/build/layouts/stack-utils/toolbar/StackToolbarButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackToolbarButton.d.ts","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/toolbar/StackToolbarButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,gCAAgC,CAAC;AAClF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIzD,OAAO,EAEL,KAAK,0BAA0B,EAChC,MAAM,WAAW,CAAC;AAEnB,MAAM,WAAW,uBAAuB;IACtC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAwCG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,IAAI,CAAC,EAAE,0BAA0B,CAAC,MAAM,CAAC,CAAC;IAE1C;;;;OAIG;IACH,KAAK,CAAC,EAAE,QAAQ,CAAC;IACjB,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,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;;;OAIG;IACH,SAAS,CAAC,EAAE,0BAA0B,CAAC,WAAW,CAAC,CAAC;IACpD;;OAEG;IACH,OAAO,CAAC,EAAE,0BAA0B,CAAC,SAAS,CAAC,CAAC;CACjD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAUhE,CAAC;AAEF,wBAAgB,4CAA4C,CAC1D,KAAK,EAAE,uBAAuB,GAC7B,2BAA2B,GAAG,SAAS,CAWzC"}

package/build/layouts/stack-utils/toolbar/StackToolbarButton.js

@@ -0,0 +1,68 @@
+"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StackToolbarButton = void 0;
+exports.convertStackToolbarButtonPropsToRNHeaderItem = convertStackToolbarButtonPropsToRNHeaderItem;
+const bottom_toolbar_native_elements_1 = require("./bottom-toolbar-native-elements");
+const context_1 = require("./context");
+const shared_1 = require("../shared");
+/**
+ * A button used inside `Stack.Toolbar`.
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Layout() {
+ *   return (
+ *     <Stack>
+ *       <Stack.Screen name="index">
+ *         <Stack.Toolbar placement="left">
+ *           <Stack.Toolbar.Button icon="arrow.left.circle" onPress={() => alert('Left pressed')} />
+ *         </Stack.Toolbar>
+ *       </Stack.Screen>
+ *     </Stack>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Toolbar placement="left">
+ *         <Stack.Toolbar.Button icon="arrow.left.circle" onPress={() => alert('Left pressed')} />
+ *       </Stack.Toolbar>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @platform ios
+ */
+const StackToolbarButton = (props) => {
+    const placement = (0, context_1.useToolbarPlacement)();
+    if (placement === 'bottom') {
+        // TODO(@ubax): Handle image loading using useImage in a follow-up PR.
+        const icon = typeof props.icon === 'string' ? props.icon : undefined;
+        return <bottom_toolbar_native_elements_1.NativeToolbarButton {...props} icon={icon} image={props.image}/>;
+    }
+    return null;
+};
+exports.StackToolbarButton = StackToolbarButton;
+function convertStackToolbarButtonPropsToRNHeaderItem(props) {
+    if (props.hidden) {
+        return undefined;
+    }
+    return {
+        ...(0, shared_1.convertStackHeaderSharedPropsToRNSharedHeaderItem)(props),
+        type: 'button',
+        onPress: props.onPress ?? (() => { }),
+        selected: !!props.selected,
+    };
+}
+//# sourceMappingURL=StackToolbarButton.js.map

package/build/layouts/stack-utils/toolbar/StackToolbarButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackToolbarButton.js","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/toolbar/StackToolbarButton.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;AAmKb,oGAaC;AA1KD,qFAAuE;AACvE,uCAAgD;AAChD,sCAGmB;AAsGnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACI,MAAM,kBAAkB,GAAsC,CAAC,KAAK,EAAE,EAAE;IAC7E,MAAM,SAAS,GAAG,IAAA,6BAAmB,GAAE,CAAC;IAExC,IAAI,SAAS,KAAK,QAAQ,EAAE,CAAC;QAC3B,sEAAsE;QACtE,MAAM,IAAI,GAAG,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;QACrE,OAAO,CAAC,oDAAmB,CAAC,IAAI,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,EAAG,CAAC;IAC5E,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAVW,QAAA,kBAAkB,sBAU7B;AAEF,SAAgB,4CAA4C,CAC1D,KAA8B;IAE9B,IAAI,KAAK,CAAC,MAAM,EAAE,CAAC;QACjB,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,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":["'use client';\nimport type { NativeStackHeaderItemButton } from '@react-navigation/native-stack';\nimport type { ImageRef } from 'expo-image';\nimport type { ReactNode } from 'react';\nimport type { StyleProp, TextStyle } from 'react-native';\n\nimport { NativeToolbarButton } from './bottom-toolbar-native-elements';\nimport { useToolbarPlacement } from './context';\nimport {\n  convertStackHeaderSharedPropsToRNSharedHeaderItem,\n  type StackHeaderItemSharedProps,\n} from '../shared';\n\nexport interface StackToolbarButtonProps {\n  accessibilityLabel?: string;\n  accessibilityHint?: string;\n  /**\n   * There are two ways to specify the content of the button:\n   *\n   * @example\n   * ```tsx\n   * import { Stack } from 'expo-router';\n   *\n   * export default function Page() {\n   *   return (\n   *     <>\n   *       <Stack.Toolbar placement=\"left\">\n   *         <Stack.Toolbar.Button icon=\"star.fill\">As text passed as children</Stack.Toolbar.Button>\n   *       </Stack.Toolbar>\n   *       <ScreenContent />\n   *     </>\n   *   );\n   * }\n   * ```\n   *\n   * @example\n   * ```tsx\n   * import { Stack } from 'expo-router';\n   *\n   * export default function Page() {\n   *   return (\n   *     <>\n   *       <Stack.Toolbar placement=\"left\">\n   *         <Stack.Toolbar.Button>\n   *           <Stack.Toolbar.Icon sf=\"star.fill\" />\n   *           <Stack.Toolbar.Label>As components</Stack.Toolbar.Label>\n   *           <Stack.Toolbar.Badge>3</Stack.Toolbar.Badge>\n   *         </Stack.Toolbar.Button>\n   *       </Stack.Toolbar>\n   *       <ScreenContent />\n   *     </>\n   *   );\n   * }\n   * ```\n   *\n   * > **Note**: When icon is used, the label will not be shown and will be used for accessibility purposes only. Badge is only supported in left/right placements, not in bottom (iOS toolbar limitation).\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   * @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  // TODO(@ubax): Add useImage support in a follow-up PR.\n  /**\n   * Image to display in the button.\n   *\n   * > **Note**: This prop is only supported in `Stack.Toolbar.Bottom`.\n   */\n  image?: ImageRef;\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?: StyleProp<TextStyle>;\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 button used inside `Stack.Toolbar`.\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.Toolbar placement=\"left\">\n *           <Stack.Toolbar.Button icon=\"arrow.left.circle\" onPress={() => alert('Left pressed')} />\n *         </Stack.Toolbar>\n *       </Stack.Screen>\n *     </Stack>\n *   );\n * }\n * ```\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Toolbar placement=\"left\">\n *         <Stack.Toolbar.Button icon=\"arrow.left.circle\" onPress={() => alert('Left pressed')} />\n *       </Stack.Toolbar>\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * @platform ios\n */\nexport const StackToolbarButton: React.FC<StackToolbarButtonProps> = (props) => {\n  const placement = useToolbarPlacement();\n\n  if (placement === 'bottom') {\n    // TODO(@ubax): Handle image loading using useImage in a follow-up PR.\n    const icon = typeof props.icon === 'string' ? props.icon : undefined;\n    return <NativeToolbarButton {...props} icon={icon} image={props.image} />;\n  }\n\n  return null;\n};\n\nexport function convertStackToolbarButtonPropsToRNHeaderItem(\n  props: StackToolbarButtonProps\n): NativeStackHeaderItemButton | undefined {\n  if (props.hidden) {\n    return undefined;\n  }\n\n  return {\n    ...convertStackHeaderSharedPropsToRNSharedHeaderItem(props),\n    type: 'button',\n    onPress: props.onPress ?? (() => {}),\n    selected: !!props.selected,\n  };\n}\n"]}