expo-router 7.0.0-canary-20260114-d8e19f5 → 7.0.0-canary-20260120-bb71700

package/build/layouts/stack-utils/{StackHeaderMenu.d.ts → toolbar/StackToolbarMenu.d.ts}

@@ -1,38 +1,23 @@
 import type { NativeStackHeaderItemMenu, NativeStackHeaderItemMenuAction } from '@react-navigation/native-stack';
+import type { ImageRef } from 'expo-image';
 import { type ReactNode } from 'react';
 import type { ImageSourcePropType } from 'react-native';
 import type { SFSymbol } from 'sf-symbols-typescript';
-import { type StackHeaderItemSharedProps } from './shared';
-export interface StackHeaderMenuProps {
+import { type StackHeaderItemSharedProps } from '../shared';
+export interface StackToolbarMenuProps {
     accessibilityLabel?: string;
     accessibilityHint?: string;
     /**
-     * There are two ways to specify the content of the menu header item - using props or child components:
+     * Menu content - can include icons, labels, badges and menu actions.
      *
      * @example
      * ```tsx
-     * import { Stack } from 'expo-router';
-     *
-     * ...
-     * <Stack.Header.Menu icon="star.fill" title="As props">
-     *  <Stack.Header.MenuAction>Action 1</Stack.Header.MenuAction>
-     * </Stack.Header.Menu>
+     * <Stack.Toolbar.Menu>
+     *   <Stack.Toolbar.Icon sfSymbol="ellipsis.circle" />
+     *   <Stack.Toolbar.Label>Options</Stack.Toolbar.Label>
+     *   <Stack.Toolbar.MenuAction onPress={() => {}}>Action 1</Stack.Toolbar.MenuAction>
+     * </Stack.Toolbar.Menu>
      * ```
-     *
-     * @example
-     * ```tsx
-     * import { Stack } from 'expo-router';
-     *
-     * ...
-     * <Stack.Header.Menu>
-     *   <Stack.Header.Icon sf="star.fill" />
-     *   <Stack.Header.Label>As components</Stack.Header.Label>
-     *   <Stack.Header.Badge>3</Stack.Header.Badge>
-     *   <Stack.Header.MenuAction>Action 1</Stack.Header.MenuAction>
-     * </Stack.Header.Menu>
-     * ```
-     *
-     * **Note**: When icon is used, the label will not be shown and will be used for accessibility purposes only.
      */
     children?: ReactNode;
     /**
@@ -42,6 +27,12 @@ export interface StackHeaderMenuProps {
      */
     destructive?: boolean;
     disabled?: boolean;
+    /**
+     * Image to display for the menu item.
+     *
+     * > **Note**: This prop is only supported in `Stack.Toolbar.Bottom`.
+     */
+    image?: ImageRef;
     /**
      * Whether to hide the shared background.
      *
@@ -66,7 +57,7 @@ export interface StackHeaderMenuProps {
      * If `true`, the menu will be displayed inline.
      * This means that the menu will not be collapsed
      *
-     * > **Note*: Inline menus are only supported in submenus.
+     * > **Note**: Inline menus are only supported in submenus.
      *
      * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenu/options-swift.struct/displayinline) for more information.
      */
@@ -104,12 +95,20 @@ export interface StackHeaderMenuProps {
      * @default 'plain'
      */
     variant?: StackHeaderItemSharedProps['variant'];
+    /**
+     * The preferred size of the menu elements.
+     *
+     * > **Note**: This prop is only supported in `Stack.Toolbar.Bottom`.
+     *
+     * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenu/preferredelementsize) for more information.
+     *
+     * @platform iOS 16.0+
+     */
+    elementSize?: 'auto' | 'small' | 'medium' | 'large';
 }
 /**
- * Component representing menu for `Stack.Header.Right` or `Stack.Header.Left`.
- *
- * Use as `Stack.Header.Menu` to provide top-level menus on iOS header bars.
- * It accepts `Stack.Header.MenuAction` and nested `Stack.Header.Menu`
+ * Use as `Stack.Toolbar.Menu` to provide menus in iOS toolbar.
+ * It accepts `Stack.Toolbar.MenuAction` and nested `Stack.Toolbar.Menu`
  * elements. Menu can be configured using both component props and child
  * elements.
  *
@@ -118,58 +117,17 @@ export interface StackHeaderMenuProps {
  * import { Stack } from 'expo-router';
  * import { Alert } from 'react-native';
  *
- * export default function Screen() {
+ * export default function Page() {
  *   return (
  *     <>
+ *       <Stack.Toolbar placement="right">
+ *         <Stack.Toolbar.Menu icon="ellipsis.circle">
+ *           <Stack.Toolbar.MenuAction onPress={() => Alert.alert('Action pressed!')}>
+ *             Action 1
+ *           </Stack.Toolbar.MenuAction>
+ *         </Stack.Toolbar.Menu>
+ *       </Stack.Toolbar>
  *       <ScreenContent />
- *       <Stack.Screen>
- *         <Stack.Header>
- *           <Stack.Header.Right>
- *             <Stack.Header.Menu>
- *               <Stack.Header.Label>Menu</Stack.Header.Label>
- *               <Stack.Header.Icon sf="ellipsis.circle" />
- *               <Stack.Header.MenuAction onPress={() => Alert.alert('Action 1 pressed!')}>
- *                 Action 1
- *               </Stack.Header.MenuAction>
- *               <Stack.Header.MenuAction isOn icon="star.fill">
- *                 Action 2
- *               </Stack.Header.MenuAction>
- *               <Stack.Header.Menu inline>
- *                 <Stack.Header.MenuAction isOn>Sub Action</Stack.Header.MenuAction>
- *               </Stack.Header.Menu>
- *             </Stack.Header.Menu>
- *           </Stack.Header.Right>
- *         </Stack.Header>
- *       </Stack.Screen>
- *     </>
- *   );
- * }
- * ```
- *
- * @example
- * ```tsx
- * import { Stack } from 'expo-router';
- * import { Text } from 'react-native';
- *
- * export default function Screen() {
- *   return (
- *     <>
- *       <ScreenContent />
- *       <Stack.Screen>
- *         <Stack.Header>
- *           <Stack.Header.Left>
- *             <Stack.Header.Menu>
- *               <Stack.Header.MenuAction onPress={() => Alert.alert('Action 1 pressed!')}>
- *                 Action 1
- *               </Stack.Header.MenuAction>
- *               <Stack.Header.Menu inline palette title="Icons">
- *                 <Stack.Header.MenuAction isOn icon="star.fill" />
- *                 <Stack.Header.MenuAction icon="heart.fill" />
- *               </Stack.Header.Menu>
- *             </Stack.Header.Menu>
- *           </Stack.Header.Left>
- *         </Stack.Header>
- *       </Stack.Screen>
  *     </>
  *   );
  * }
@@ -179,9 +137,9 @@ export interface StackHeaderMenuProps {
  *
  * @platform ios
  */
-export declare const StackHeaderMenu: React.FC<StackHeaderMenuProps>;
-export declare function convertStackHeaderMenuPropsToRNHeaderItem(props: StackHeaderMenuProps): NativeStackHeaderItemMenu | undefined;
-export interface StackHeaderMenuActionProps {
+export declare const StackToolbarMenu: React.FC<StackToolbarMenuProps>;
+export declare function convertStackToolbarMenuPropsToRNHeaderItem(props: StackToolbarMenuProps): NativeStackHeaderItemMenu | undefined;
+export interface StackToolbarMenuActionProps {
     /**
      * Can be an Icon, Label or string title.
      */
@@ -193,6 +151,12 @@ export interface StackHeaderMenuActionProps {
      */
     disabled?: boolean;
     icon?: SFSymbol | ImageSourcePropType;
+    /**
+     * Image to display for the menu action.
+     *
+     * > **Note**: This prop is only supported in `Stack.Toolbar.Bottom`.
+     */
+    image?: ImageRef;
     /**
      * If `true`, the menu item will be displayed as destructive.
      *
@@ -226,42 +190,30 @@ export interface StackHeaderMenuActionProps {
     hidden?: boolean;
 }
 /**
- * An action item for a `Stack.Header.Menu`.
+ * An action item for a `Stack.Toolbar.Menu`.
  *
  * @example
  * ```tsx
- * import React from 'react';
- * import { Alert } from 'react-native';
- * import { Stack, Label, Icon } from 'expo-router';
+ * import { Stack } from 'expo-router';
  *
- * export default function ExampleScreen() {
+ * export default function Page() {
  *   return (
  *     <>
+ *       <Stack.Toolbar placement="right">
+ *         <Stack.Toolbar.Menu icon="ellipsis.circle">
+ *           <Stack.Toolbar.MenuAction onPress={() => alert('Action pressed!')}>
+ *             Action 1
+ *           </Stack.Toolbar.MenuAction>
+ *         </Stack.Toolbar.Menu>
+ *       </Stack.Toolbar>
  *       <ScreenContent />
- *       <Stack.Screen>
- *         <Stack.Header>
- *           <Stack.Header.Right>
- *             <Stack.Header.Menu icon="ellipsis.circle">
- *               <Stack.Header.MenuAction onPress={() => Alert.alert('Action 1 pressed!')}>
- *                 Action 1
- *               </Stack.Header.MenuAction>
- *               <Stack.Header.MenuAction isOn onPress={() => Alert.alert('Action 2 pressed!')}>
- *                 <Label>Action 2</Label>
- *                 <Icon sf="star.fill" />
- *               </Stack.Header.MenuAction>
- *             </Stack.Header.Menu>
- *           </Stack.Header.Right>
- *         </Stack.Header>
- *       </Stack.Screen>
  *     </>
  *   );
  * }
  * ```
  *
- * @see [Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/menus) for more information about menus on iOS.
- *
  * @platform ios
  */
-export declare const StackHeaderMenuAction: React.FC<StackHeaderMenuActionProps>;
-export declare function convertStackHeaderMenuActionPropsToRNHeaderItem(props: StackHeaderMenuActionProps): NativeStackHeaderItemMenuAction;
-//# sourceMappingURL=StackHeaderMenu.d.ts.map
+export declare const StackToolbarMenuAction: React.FC<StackToolbarMenuActionProps>;
+export declare function convertStackToolbarMenuActionPropsToRNHeaderItem(props: StackToolbarMenuActionProps): NativeStackHeaderItemMenuAction;
+//# sourceMappingURL=StackToolbarMenu.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StackToolbarMenu.d.ts","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/toolbar/StackToolbarMenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,yBAAyB,EACzB,+BAA+B,EAEhC,MAAM,gCAAgC,CAAC;AACxC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAMtD,OAAO,EAEL,KAAK,0BAA0B,EAChC,MAAM,WAAW,CAAC;AAEnB,MAAM,WAAW,qBAAqB;IACpC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;;;;;;;;;OAWG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,KAAK,CAAC,EAAE,QAAQ,CAAC;IACjB;;;;;;OAMG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;OAIG;IACH,IAAI,CAAC,EAAE,0BAA0B,CAAC,MAAM,CAAC,CAAC;IAC1C;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;OAEG;IACH,KAAK,CAAC,EAAE,0BAA0B,CAAC,OAAO,CAAC,CAAC;IAC5C;;;;OAIG;IACH,SAAS,CAAC,EAAE,0BAA0B,CAAC,WAAW,CAAC,CAAC;IACpD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,0BAA0B,CAAC,SAAS,CAAC,CAAC;IAEhD;;;;;;;;OAQG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA+B5D,CAAC;AAEF,wBAAgB,0CAA0C,CACxD,KAAK,EAAE,qBAAqB,GAC3B,yBAAyB,GAAG,SAAS,CA4BvC;AAwDD,MAAM,WAAW,2BAA2B;IAC1C;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,mBAAmB,CAAC;IAEtC;;;;OAIG;IACH,KAAK,CAAC,EAAE,QAAQ,CAAC;IACjB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;;;;OAOG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAUxE,CAAC;AAEF,wBAAgB,gDAAgD,CAC9D,KAAK,EAAE,2BAA2B,GACjC,+BAA+B,CAyBjC"}

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

@@ -0,0 +1,190 @@
+"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StackToolbarMenuAction = exports.StackToolbarMenu = void 0;
+exports.convertStackToolbarMenuPropsToRNHeaderItem = convertStackToolbarMenuPropsToRNHeaderItem;
+exports.convertStackToolbarMenuActionPropsToRNHeaderItem = convertStackToolbarMenuActionPropsToRNHeaderItem;
+const react_1 = require("react");
+const bottom_toolbar_native_elements_1 = require("./bottom-toolbar-native-elements");
+const context_1 = require("./context");
+const primitives_1 = require("../../../primitives");
+const children_1 = require("../../../utils/children");
+const shared_1 = require("../shared");
+/**
+ * Use as `Stack.Toolbar.Menu` to provide menus in iOS toolbar.
+ * It accepts `Stack.Toolbar.MenuAction` and nested `Stack.Toolbar.Menu`
+ * elements. Menu can be configured using both component props and child
+ * elements.
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ * import { Alert } from 'react-native';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Toolbar placement="right">
+ *         <Stack.Toolbar.Menu icon="ellipsis.circle">
+ *           <Stack.Toolbar.MenuAction onPress={() => Alert.alert('Action pressed!')}>
+ *             Action 1
+ *           </Stack.Toolbar.MenuAction>
+ *         </Stack.Toolbar.Menu>
+ *       </Stack.Toolbar>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @see [Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/menus) for more information about menus on iOS.
+ *
+ * @platform ios
+ */
+const StackToolbarMenu = ({ children, ...props }) => {
+    const placement = (0, context_1.useToolbarPlacement)();
+    const allowedChildren = (0, react_1.useMemo)(() => placement === 'bottom'
+        ? [exports.StackToolbarMenu, exports.StackToolbarMenuAction, bottom_toolbar_native_elements_1.NativeToolbarMenu, bottom_toolbar_native_elements_1.NativeToolbarMenuAction]
+        : [exports.StackToolbarMenu, exports.StackToolbarMenuAction], [placement]);
+    const validChildren = (0, react_1.useMemo)(() => (0, children_1.filterAllowedChildrenElements)(children, allowedChildren), [children, allowedChildren]);
+    if (process.env.NODE_ENV !== 'production') {
+        const allChildren = react_1.Children.toArray(children);
+        if (allChildren.length !== validChildren.length) {
+            throw new Error(`Stack.Toolbar.Menu only accepts Stack.Toolbar.Menu and Stack.Toolbar.MenuAction as its children.`);
+        }
+    }
+    if (placement === 'bottom') {
+        // TODO(@ubax): Handle image loading using useImage in a follow-up PR.
+        return <bottom_toolbar_native_elements_1.NativeToolbarMenu {...props} image={props.image} children={validChildren}/>;
+    }
+    return <primitives_1.Menu {...props} children={validChildren}/>;
+};
+exports.StackToolbarMenu = StackToolbarMenu;
+function convertStackToolbarMenuPropsToRNHeaderItem(props) {
+    if (props.hidden) {
+        return undefined;
+    }
+    const { title, ...rest } = props;
+    const actions = react_1.Children.toArray(props.children).filter((child) => (0, children_1.isChildOfType)(child, exports.StackToolbarMenuAction) || (0, children_1.isChildOfType)(child, exports.StackToolbarMenu));
+    const item = {
+        ...(0, shared_1.convertStackHeaderSharedPropsToRNSharedHeaderItem)(rest),
+        type: 'menu',
+        menu: {
+            items: actions
+                .map((action) => {
+                if ((0, children_1.isChildOfType)(action, exports.StackToolbarMenu)) {
+                    return convertStackToolbarSubmenuMenuPropsToRNHeaderItem(action.props);
+                }
+                return convertStackToolbarMenuActionPropsToRNHeaderItem(action.props);
+            })
+                .filter((i) => !!i),
+        },
+    };
+    if (title) {
+        item.menu.title = title;
+    }
+    return item;
+}
+function convertStackToolbarSubmenuMenuPropsToRNHeaderItem(props) {
+    if (props.hidden) {
+        return undefined;
+    }
+    const sharedProps = (0, shared_1.convertStackHeaderSharedPropsToRNSharedHeaderItem)(props);
+    const actions = react_1.Children.toArray(props.children).filter((child) => (0, children_1.isChildOfType)(child, exports.StackToolbarMenuAction) || (0, children_1.isChildOfType)(child, exports.StackToolbarMenu));
+    // TODO: Remove  Pick<HeaderBarButtonItemSubmenu> when this PR is merged and released in react-navigation:
+    // https://github.com/react-navigation/react-navigation/pull/12895
+    const item = {
+        type: 'submenu',
+        items: actions
+            .map((action) => {
+            if ((0, children_1.isChildOfType)(action, exports.StackToolbarMenu)) {
+                return convertStackToolbarSubmenuMenuPropsToRNHeaderItem(action.props);
+            }
+            return convertStackToolbarMenuActionPropsToRNHeaderItem(action.props);
+        })
+            .filter((i) => !!i),
+        label: sharedProps.label || props.title || '',
+    };
+    if (props.inline !== undefined) {
+        item.displayInline = props.inline;
+    }
+    if (props.palette !== undefined) {
+        item.displayAsPalette = props.palette;
+    }
+    if (props.destructive !== undefined) {
+        item.destructive = props.destructive;
+    }
+    // TODO: Add elementSize to react-native-screens
+    if (sharedProps.icon) {
+        // Only SF Symbols are supported in submenu icons
+        // TODO(@ubax): Add support for other images in react-native-screens
+        if (sharedProps.icon.type === 'sfSymbol') {
+            item.icon = sharedProps.icon;
+        }
+        else {
+            console.warn('When Icon is used inside Stack.Toolbar.Menu used as a submenu, only sfSymbol icons are supported. This is a limitation of React Native Screens.');
+        }
+    }
+    return item;
+}
+/**
+ * An action item for a `Stack.Toolbar.Menu`.
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Toolbar placement="right">
+ *         <Stack.Toolbar.Menu icon="ellipsis.circle">
+ *           <Stack.Toolbar.MenuAction onPress={() => alert('Action pressed!')}>
+ *             Action 1
+ *           </Stack.Toolbar.MenuAction>
+ *         </Stack.Toolbar.Menu>
+ *       </Stack.Toolbar>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @platform ios
+ */
+const StackToolbarMenuAction = (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.NativeToolbarMenuAction {...props} icon={icon} image={props.image}/>;
+    }
+    return <primitives_1.MenuAction {...props}/>;
+};
+exports.StackToolbarMenuAction = StackToolbarMenuAction;
+function convertStackToolbarMenuActionPropsToRNHeaderItem(props) {
+    const { children, isOn, unstable_keepPresented, icon, ...rest } = props;
+    const sharedProps = (0, shared_1.convertStackHeaderSharedPropsToRNSharedHeaderItem)(props);
+    const item = {
+        ...rest,
+        type: 'action',
+        label: sharedProps.label,
+        state: isOn ? 'on' : 'off',
+        onPress: props.onPress ?? (() => { }),
+    };
+    if (unstable_keepPresented !== undefined) {
+        item.keepsMenuPresented = unstable_keepPresented;
+    }
+    if (sharedProps.icon) {
+        // Only SF Symbols are supported in submenu icons
+        // TODO(@ubax): Add support for other images in react-native-screens
+        if (sharedProps.icon.type === 'sfSymbol') {
+            item.icon = sharedProps.icon;
+        }
+        else {
+            console.warn('When Icon is used inside Stack.Toolbar.MenuAction, only sfSymbol icons are supported. This is a limitation of React Native Screens.');
+        }
+    }
+    return item;
+}
+//# sourceMappingURL=StackToolbarMenu.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StackToolbarMenu.js","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/toolbar/StackToolbarMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\nimport type {\n  NativeStackHeaderItemMenu,\n  NativeStackHeaderItemMenuAction,\n  NativeStackHeaderItemMenuSubmenu,\n} from '@react-navigation/native-stack';\nimport type { ImageRef } from 'expo-image';\nimport { Children, useMemo, type ReactNode } from 'react';\nimport type { ImageSourcePropType } from 'react-native';\nimport type { HeaderBarButtonItemSubmenu } from 'react-native-screens';\nimport type { SFSymbol } from 'sf-symbols-typescript';\n\nimport { NativeToolbarMenu, NativeToolbarMenuAction } from './bottom-toolbar-native-elements';\nimport { useToolbarPlacement } from './context';\nimport { Menu, MenuAction } from '../../../primitives';\nimport { filterAllowedChildrenElements, isChildOfType } from '../../../utils/children';\nimport {\n  convertStackHeaderSharedPropsToRNSharedHeaderItem,\n  type StackHeaderItemSharedProps,\n} from '../shared';\n\nexport interface StackToolbarMenuProps {\n  accessibilityLabel?: string;\n  accessibilityHint?: string;\n  /**\n   * Menu content - can include icons, labels, badges and menu actions.\n   *\n   * @example\n   * ```tsx\n   * <Stack.Toolbar.Menu>\n   *   <Stack.Toolbar.Icon sfSymbol=\"ellipsis.circle\" />\n   *   <Stack.Toolbar.Label>Options</Stack.Toolbar.Label>\n   *   <Stack.Toolbar.MenuAction onPress={() => {}}>Action 1</Stack.Toolbar.MenuAction>\n   * </Stack.Toolbar.Menu>\n   * ```\n   */\n  children?: ReactNode;\n  /**\n   * If `true`, the menu item will be displayed as destructive.\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenuelement/attributes/destructive) for more information.\n   */\n  destructive?: boolean;\n  disabled?: boolean;\n  // TODO(@ubax): Add useImage support in a follow-up PR.\n  /**\n   * Image to display for the menu item.\n   *\n   * > **Note**: This prop is only supported in `Stack.Toolbar.Bottom`.\n   */\n  image?: ImageRef;\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   * Whether the menu should be hidden.\n   *\n   * @default false\n   */\n  hidden?: boolean;\n  /**\n   * Icon for the menu item.\n   *\n   * Can be an SF Symbol name or an image source.\n   */\n  icon?: StackHeaderItemSharedProps['icon'];\n  /**\n   * If `true`, the menu will be displayed inline.\n   * This means that the menu will not be collapsed\n   *\n   * > **Note**: Inline menus are only supported in submenus.\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenu/options-swift.struct/displayinline) for more information.\n   */\n  inline?: boolean;\n  /**\n   * If `true`, the menu will be displayed as a palette.\n   * This means that the menu will be displayed as one row\n   *\n   * > **Note**: Palette menus are only supported in submenus.\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenu/options-swift.struct/displayaspalette) for more information.\n   */\n  palette?: boolean;\n  /**\n   * Whether to separate the background of this item from other header items.\n   *\n   * @default false\n   */\n  separateBackground?: 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   * Optional title to show on top of the menu.\n   */\n  title?: string;\n  /**\n   * @default 'plain'\n   */\n  variant?: StackHeaderItemSharedProps['variant'];\n  // TODO(@ubax): Add elementSize support in react-native-screens for header menus.\n  /**\n   * The preferred size of the menu elements.\n   *\n   * > **Note**: This prop is only supported in `Stack.Toolbar.Bottom`.\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenu/preferredelementsize) for more information.\n   *\n   * @platform iOS 16.0+\n   */\n  elementSize?: 'auto' | 'small' | 'medium' | 'large';\n}\n\n/**\n * Use as `Stack.Toolbar.Menu` to provide menus in iOS toolbar.\n * It accepts `Stack.Toolbar.MenuAction` and nested `Stack.Toolbar.Menu`\n * elements. Menu can be configured using both component props and child\n * elements.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n * import { Alert } from 'react-native';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Toolbar placement=\"right\">\n *         <Stack.Toolbar.Menu icon=\"ellipsis.circle\">\n *           <Stack.Toolbar.MenuAction onPress={() => Alert.alert('Action pressed!')}>\n *             Action 1\n *           </Stack.Toolbar.MenuAction>\n *         </Stack.Toolbar.Menu>\n *       </Stack.Toolbar>\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * @see [Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/menus) for more information about menus on iOS.\n *\n * @platform ios\n */\nexport const StackToolbarMenu: React.FC<StackToolbarMenuProps> = ({ children, ...props }) => {\n  const placement = useToolbarPlacement();\n\n  const allowedChildren = useMemo(\n    () =>\n      placement === 'bottom'\n        ? [StackToolbarMenu, StackToolbarMenuAction, NativeToolbarMenu, NativeToolbarMenuAction]\n        : [StackToolbarMenu, StackToolbarMenuAction],\n    [placement]\n  );\n\n  const validChildren = useMemo(\n    () => filterAllowedChildrenElements(children, allowedChildren),\n    [children, allowedChildren]\n  );\n\n  if (process.env.NODE_ENV !== 'production') {\n    const allChildren = Children.toArray(children);\n    if (allChildren.length !== validChildren.length) {\n      throw new Error(\n        `Stack.Toolbar.Menu only accepts Stack.Toolbar.Menu and Stack.Toolbar.MenuAction as its children.`\n      );\n    }\n  }\n\n  if (placement === 'bottom') {\n    // TODO(@ubax): Handle image loading using useImage in a follow-up PR.\n    return <NativeToolbarMenu {...props} image={props.image} children={validChildren} />;\n  }\n\n  return <Menu {...props} children={validChildren} />;\n};\n\nexport function convertStackToolbarMenuPropsToRNHeaderItem(\n  props: StackToolbarMenuProps\n): NativeStackHeaderItemMenu | undefined {\n  if (props.hidden) {\n    return undefined;\n  }\n  const { title, ...rest } = props;\n  const actions = Children.toArray(props.children).filter(\n    (child) =>\n      isChildOfType(child, StackToolbarMenuAction) || isChildOfType(child, StackToolbarMenu)\n  );\n  const item: NativeStackHeaderItemMenu = {\n    ...convertStackHeaderSharedPropsToRNSharedHeaderItem(rest),\n    type: 'menu',\n    menu: {\n      items: actions\n        .map((action) => {\n          if (isChildOfType(action, StackToolbarMenu)) {\n            return convertStackToolbarSubmenuMenuPropsToRNHeaderItem(action.props);\n          }\n          return convertStackToolbarMenuActionPropsToRNHeaderItem(action.props);\n        })\n        .filter((i) => !!i),\n    },\n  };\n  if (title) {\n    item.menu.title = title;\n  }\n\n  return item;\n}\n\nfunction convertStackToolbarSubmenuMenuPropsToRNHeaderItem(\n  props: StackToolbarMenuProps\n): NativeStackHeaderItemMenuSubmenu | undefined {\n  if (props.hidden) {\n    return undefined;\n  }\n  const sharedProps = convertStackHeaderSharedPropsToRNSharedHeaderItem(props);\n  const actions = Children.toArray(props.children).filter(\n    (child) =>\n      isChildOfType(child, StackToolbarMenuAction) || isChildOfType(child, StackToolbarMenu)\n  );\n\n  // TODO: Remove  Pick<HeaderBarButtonItemSubmenu> when this PR is merged and released in react-navigation:\n  // https://github.com/react-navigation/react-navigation/pull/12895\n  const item: NativeStackHeaderItemMenuSubmenu &\n    Pick<HeaderBarButtonItemSubmenu, 'displayAsPalette' | 'displayInline' | 'destructive'> = {\n    type: 'submenu',\n    items: actions\n      .map((action) => {\n        if (isChildOfType(action, StackToolbarMenu)) {\n          return convertStackToolbarSubmenuMenuPropsToRNHeaderItem(action.props);\n        }\n        return convertStackToolbarMenuActionPropsToRNHeaderItem(action.props);\n      })\n      .filter((i) => !!i),\n    label: sharedProps.label || props.title || '',\n  };\n\n  if (props.inline !== undefined) {\n    item.displayInline = props.inline;\n  }\n  if (props.palette !== undefined) {\n    item.displayAsPalette = props.palette;\n  }\n  if (props.destructive !== undefined) {\n    item.destructive = props.destructive;\n  }\n  // TODO: Add elementSize to react-native-screens\n\n  if (sharedProps.icon) {\n    // Only SF Symbols are supported in submenu icons\n    // TODO(@ubax): Add support for other images in react-native-screens\n    if (sharedProps.icon.type === 'sfSymbol') {\n      item.icon = sharedProps.icon;\n    } else {\n      console.warn(\n        'When Icon is used inside Stack.Toolbar.Menu used as a submenu, only sfSymbol icons are supported. This is a limitation of React Native Screens.'\n      );\n    }\n  }\n\n  return item;\n}\n\nexport interface StackToolbarMenuActionProps {\n  /**\n   * Can be an Icon, Label or string title.\n   */\n  children?: ReactNode;\n  /**\n   * If `true`, the menu item will be disabled and not selectable.\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenuelement/attributes/disabled) for more information.\n   */\n  disabled?: boolean;\n  icon?: SFSymbol | ImageSourcePropType;\n  // TODO(@ubax): Add useImage support in a follow-up PR.\n  /**\n   * Image to display for the menu action.\n   *\n   * > **Note**: This prop is only supported in `Stack.Toolbar.Bottom`.\n   */\n  image?: ImageRef;\n  /**\n   * If `true`, the menu item will be displayed as destructive.\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenuelement/attributes/destructive) for more information.\n   */\n  destructive?: boolean;\n  /**\n   * If `true`, the menu will be kept presented after the action is selected.\n   *\n   * This is marked as unstable, because when action is selected it will recreate the menu,\n   * which will close all opened submenus and reset the scroll position.\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenuelement/attributes/keepsmenupresented) for more information.\n   */\n  unstable_keepPresented?: boolean;\n  /**\n   * If `true`, the menu item will be displayed as selected.\n   */\n  isOn?: boolean;\n  onPress?: () => void;\n  /**\n   * An elaborated title that explains the purpose of the action.\n   */\n  discoverabilityLabel?: string;\n  /**\n   * An optional subtitle for the menu item.\n   *\n   * @see [Apple documentation](https://developer.apple.com/documentation/uikit/uimenuelement/subtitle) for more information.\n   */\n  subtitle?: string;\n  hidden?: boolean;\n}\n\n/**\n * An action item for a `Stack.Toolbar.Menu`.\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Toolbar placement=\"right\">\n *         <Stack.Toolbar.Menu icon=\"ellipsis.circle\">\n *           <Stack.Toolbar.MenuAction onPress={() => alert('Action pressed!')}>\n *             Action 1\n *           </Stack.Toolbar.MenuAction>\n *         </Stack.Toolbar.Menu>\n *       </Stack.Toolbar>\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * @platform ios\n */\nexport const StackToolbarMenuAction: React.FC<StackToolbarMenuActionProps> = (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 <NativeToolbarMenuAction {...props} icon={icon} image={props.image} />;\n  }\n\n  return <MenuAction {...props} />;\n};\n\nexport function convertStackToolbarMenuActionPropsToRNHeaderItem(\n  props: StackToolbarMenuActionProps\n): NativeStackHeaderItemMenuAction {\n  const { children, isOn, unstable_keepPresented, icon, ...rest } = props;\n  const sharedProps = convertStackHeaderSharedPropsToRNSharedHeaderItem(props);\n  const item: NativeStackHeaderItemMenuAction = {\n    ...rest,\n    type: 'action',\n    label: sharedProps.label,\n    state: isOn ? 'on' : 'off',\n    onPress: props.onPress ?? (() => {}),\n  };\n  if (unstable_keepPresented !== undefined) {\n    item.keepsMenuPresented = unstable_keepPresented;\n  }\n  if (sharedProps.icon) {\n    // Only SF Symbols are supported in submenu icons\n    // TODO(@ubax): Add support for other images in react-native-screens\n    if (sharedProps.icon.type === 'sfSymbol') {\n      item.icon = sharedProps.icon;\n    } else {\n      console.warn(\n        'When Icon is used inside Stack.Toolbar.MenuAction, only sfSymbol icons are supported. This is a limitation of React Native Screens.'\n      );\n    }\n  }\n  return item;\n}\n"]}

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

@@ -0,0 +1,48 @@
+export interface StackToolbarSearchBarSlotProps {
+    /**
+     * Whether the search bar slot should be hidden.
+     *
+     * @default false
+     */
+    hidden?: boolean;
+    /**
+     * Whether to hide the shared background.
+     *
+     * @platform iOS 26+
+     */
+    hidesSharedBackground?: boolean;
+    /**
+     * Whether this search bar slot shares background with adjacent items.
+     *
+     * @platform iOS 26+
+     */
+    sharesBackground?: boolean;
+}
+/**
+ * A search bar slot for the bottom toolbar. This reserves space for the search bar
+ * in the toolbar and allows positioning it among other toolbar items.
+ *
+ * This component is only available in bottom placement (`<Stack.Toolbar>` or `<Stack.Toolbar placement="bottom">`).
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Toolbar>
+ *         <Stack.Toolbar.Button icon="folder" />
+ *         <Stack.Toolbar.SearchBarSlot />
+ *         <Stack.Toolbar.Button icon="ellipsis.circle" />
+ *       </Stack.Toolbar>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @platform iOS 26+
+ */
+export declare const StackToolbarSearchBarSlot: React.FC<StackToolbarSearchBarSlotProps>;
+//# sourceMappingURL=StackToolbarSearchBarSlot.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StackToolbarSearchBarSlot.d.ts","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/toolbar/StackToolbarSearchBarSlot.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,8BAA8B;IAC7C;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,yBAAyB,EAAE,KAAK,CAAC,EAAE,CAAC,8BAA8B,CAa9E,CAAC"}

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

@@ -0,0 +1,44 @@
+"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StackToolbarSearchBarSlot = void 0;
+const bottom_toolbar_native_elements_1 = require("./bottom-toolbar-native-elements");
+const context_1 = require("./context");
+/**
+ * A search bar slot for the bottom toolbar. This reserves space for the search bar
+ * in the toolbar and allows positioning it among other toolbar items.
+ *
+ * This component is only available in bottom placement (`<Stack.Toolbar>` or `<Stack.Toolbar placement="bottom">`).
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Toolbar>
+ *         <Stack.Toolbar.Button icon="folder" />
+ *         <Stack.Toolbar.SearchBarSlot />
+ *         <Stack.Toolbar.Button icon="ellipsis.circle" />
+ *       </Stack.Toolbar>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @platform iOS 26+
+ */
+const StackToolbarSearchBarSlot = (props) => {
+    const placement = (0, context_1.useToolbarPlacement)();
+    if (placement !== 'bottom') {
+        if (process.env.NODE_ENV !== 'production') {
+            console.warn('Stack.Toolbar.SearchBarSlot is only available in Bottom placement. It will not render in Left or Right placement.');
+        }
+        return null;
+    }
+    return <bottom_toolbar_native_elements_1.NativeToolbarSearchBarSlot {...props}/>;
+};
+exports.StackToolbarSearchBarSlot = StackToolbarSearchBarSlot;
+//# sourceMappingURL=StackToolbarSearchBarSlot.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StackToolbarSearchBarSlot.js","sourceRoot":"","sources":["../../../../src/layouts/stack-utils/toolbar/StackToolbarSearchBarSlot.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;AACb,qFAA8E;AAC9E,uCAAgD;AAuBhD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACI,MAAM,yBAAyB,GAA6C,CAAC,KAAK,EAAE,EAAE;IAC3F,MAAM,SAAS,GAAG,IAAA,6BAAmB,GAAE,CAAC;IAExC,IAAI,SAAS,KAAK,QAAQ,EAAE,CAAC;QAC3B,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE,CAAC;YAC1C,OAAO,CAAC,IAAI,CACV,mHAAmH,CACpH,CAAC;QACJ,CAAC;QACD,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CAAC,2DAA0B,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AACnD,CAAC,CAAC;AAbW,QAAA,yBAAyB,6BAapC","sourcesContent":["'use client';\nimport { NativeToolbarSearchBarSlot } from './bottom-toolbar-native-elements';\nimport { useToolbarPlacement } from './context';\n\nexport interface StackToolbarSearchBarSlotProps {\n  /**\n   * Whether the search bar slot 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   * Whether this search bar slot shares background with adjacent items.\n   *\n   * @platform iOS 26+\n   */\n  sharesBackground?: boolean;\n}\n\n/**\n * A search bar slot for the bottom toolbar. This reserves space for the search bar\n * in the toolbar and allows positioning it among other toolbar items.\n *\n * This component is only available in bottom placement (`<Stack.Toolbar>` or `<Stack.Toolbar placement=\"bottom\">`).\n *\n * @example\n * ```tsx\n * import { Stack } from 'expo-router';\n *\n * export default function Page() {\n *   return (\n *     <>\n *       <Stack.Toolbar>\n *         <Stack.Toolbar.Button icon=\"folder\" />\n *         <Stack.Toolbar.SearchBarSlot />\n *         <Stack.Toolbar.Button icon=\"ellipsis.circle\" />\n *       </Stack.Toolbar>\n *       <ScreenContent />\n *     </>\n *   );\n * }\n * ```\n *\n * @platform iOS 26+\n */\nexport const StackToolbarSearchBarSlot: React.FC<StackToolbarSearchBarSlotProps> = (props) => {\n  const placement = useToolbarPlacement();\n\n  if (placement !== 'bottom') {\n    if (process.env.NODE_ENV !== 'production') {\n      console.warn(\n        'Stack.Toolbar.SearchBarSlot is only available in Bottom placement. It will not render in Left or Right placement.'\n      );\n    }\n    return null;\n  }\n\n  return <NativeToolbarSearchBarSlot {...props} />;\n};\n"]}

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

@@ -0,0 +1,80 @@
+import type { NativeStackHeaderItemSpacing } from '@react-navigation/native-stack';
+export interface StackToolbarSpacerProps {
+    /**
+     * Whether the spacer should be hidden.
+     *
+     * @default false
+     */
+    hidden?: boolean;
+    /**
+     * The width of the spacing element.
+     *
+     * In Left/Right placements, width is required.
+     * In Bottom placement, if width is not provided, the spacer will be flexible
+     * and expand to fill available space.
+     */
+    width?: number;
+    /**
+     * Whether to hide the shared background.
+     *
+     * Only available in bottom placement.
+     *
+     * @platform iOS 26+
+     */
+    hidesSharedBackground?: boolean;
+    /**
+     * Whether this spacer shares background with adjacent items.
+     *
+     * Only available in bottom placement.
+     *
+     * @platform iOS 26+
+     */
+    sharesBackground?: boolean;
+}
+/**
+ * A spacing helper used inside `Stack.Toolbar` to create empty space between toolbar items.
+ *
+ * In left/right placements, width is required.
+ * In bottom placement, if width is not provided, creates a flexible spacer that expands to fill space.
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Toolbar placement="left">
+ *         <Stack.Toolbar.Button icon="arrow.left" />
+ *         <Stack.Toolbar.Spacer width={8} />
+ *         <Stack.Toolbar.Button icon="arrow.right" />
+ *       </Stack.Toolbar>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { Stack } from 'expo-router';
+ *
+ * export default function Page() {
+ *   return (
+ *     <>
+ *       <Stack.Toolbar>
+ *         <Stack.Toolbar.Spacer />
+ *         <Stack.Toolbar.Button icon="search" />
+ *         <Stack.Toolbar.Spacer />
+ *       </Stack.Toolbar>
+ *       <ScreenContent />
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @platform ios
+ */
+export declare const StackToolbarSpacer: React.FC<StackToolbarSpacerProps>;
+export declare function convertStackToolbarSpacerPropsToRNHeaderItem(props: StackToolbarSpacerProps): NativeStackHeaderItemSpacing | undefined;
+//# sourceMappingURL=StackToolbarSpacer.d.ts.map