@mortenbrudvik/waveui 0.7.0 → 0.9.0

package/dist/components/navigation/Menu.root.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.root.mjs","names":["useId","useId$1","React","noop","HOVER_DELAY_MS","hasPopupParts","flattenChildren","children","isElementOfType","node","MenuTrigger","MenuPopover","listProps","quoted","names","name","MenuRoot","openProp","persistOnItemClickProp","openOnHoverProp","openDelayProp","closeDelayProp","openOnContextProp","rest","list","useMenuListContext","portalDepth","PortalDepthContext","parentList","parent","isSubmenu","openState","setOpen","openControlled","useControllable","defaultOpen","onOpenChange","isClient","useIsClient","parentOpen","open","popup","triggerId","menuId","labelledBy","setLabelledBy","triggerRef","triggerElement","setTriggerElementState","setTriggerElement","element","surfaceApiRef","surfaceElement","setSurfaceElement","surfaceLayerId","setSurfaceLayerId","registerSurface","api","ownChecked","useCheckedValues","checkedValues","defaultCheckedValues","onCheckedValuesChange","parentChecked","ownsCheckedState","listens","listener","useEventCallback","sharedChecked","withCheckedValuesListener","checked","persistOnItemClick","openDelay","closeDelay","contextMode","hoverMode","ignoredProps","className","onKeyDown","onKeyDownCapture","onFocus","onPointerMove","value","ref","ignoredMessage","warnOnce","staticPopupProps","hoverAndContext","verb","pronoun","staticMenuRef","openSubmenuRef","containsFocus","surfaceApi","active","getLayerTreeElements","el","listContainsFocus","hoverCloseRef","isHoverClose","closeMenu","byHover","requestClose","requestHoverClose","openReasonRef","hoverOpenPendingRef","initialFocusRef","isHoverOpen","hoverIntentTriggerHandlers","hoverSurfaceHandlers","cancelHover","startHoverClose","useHoverIntent","forgetHoverOpening","hoverTriggerHandlers","event","openWithFocus","target","takeInitialFocus","contextAnchor","contextOpener","contextTriggerHandlers","contextSurfaceHandlers","useContextMenuAnchor","parentListHoverFocusing","parentHoverFocusing","isHoverFocusing","contextPressRef","doc","onPointerDown","onPointerEnd","dismiss","reason","registerOpenSubmenu","previous","submenu","submenuHandle","registerWithParent","parentCloseChain","closeChain","contextValue","fromContext","rovingRef","rovingKeyDown","rovingKeyDownCapture","rovingFocus","useRovingTabIndex","MENU_ITEM_SELECTOR","mergedRef","useMergedRefs","menuIsTabStop","setMenuIsTabStop","menu","noItemTabStop","getFirstTabbable","focusFirst","getTabIndex","registerCheckable","useCheckableRegistry","isListHoverFocusing","listPointerMove","useMenuListPointer","listContext","hoverGroup","MenuContext","MenuListContext","composeEventHandlers","withTypeaheadText","cn","menuSurfaceClasses","focusRing"],"sources":["../../../src/components/navigation/Menu.root.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { composeEventHandlers } from '../../lib/composeEventHandlers';\nimport { warnOnce } from '../../lib/dev';\nimport { flattenChildren, isElementOfType } from '../../lib/children';\nimport { getFirstTabbable } from '../../lib/focus';\nimport { getLayerTreeElements, type DismissReason } from '../../lib/layers';\nimport { focusRing } from '../../lib/styles';\nimport type { CheckedValues, CheckedValuesChangeHandler } from '../../lib/types';\nimport { useCheckedValues, withCheckedValuesListener } from '../../hooks/useCheckedValues';\nimport { useContextMenuAnchor } from '../../hooks/useContextMenuAnchor';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useEventCallback } from '../../hooks/useEventCallback';\nimport { useHoverIntent, type HoverIntent } from '../../hooks/useHoverIntent';\nimport { useId } from '../../hooks/useId';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { useRovingTabIndex } from '../../hooks/useRovingTabIndex';\nimport { PortalDepthContext } from '../portal/Portal';\nimport {\n  MenuContext,\n  MenuListContext,\n  useCheckableRegistry,\n  useMenuListContext,\n} from './Menu.context';\nimport type {\n  InitialFocus,\n  MenuContextValue,\n  MenuListContextValue,\n  MenuSurfaceApi,\n  OpenSubmenu,\n} from './Menu.context';\nimport { MENU_ITEM_SELECTOR, menuSurfaceClasses, withTypeaheadText } from './Menu.shared';\nimport { MenuPopover, useMenuListPointer } from './Menu.popover';\nimport { MenuTrigger } from './Menu.trigger';\n\n/** Properties for the Menu component. */\nexport interface MenuProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Menu items and dividers (static menu), or a `Menu.Trigger` and a `Menu.Popover` (popup menu).\n   */\n  children: React.ReactNode;\n  /**\n   * Controlled open state of a popup menu (`Menu.Trigger` + `Menu.Popover`). Passing it, even\n   * `false` (like passing `defaultOpen` or `onOpenChange`), makes Menu a popup menu that renders no\n   * element of its own: use it only with `Menu.Trigger`/`Menu.Popover`. Items outside\n   * `Menu.Popover` then have no `role=\"menu\"` parent (development warning). Leave all three out\n   * for a static menu. The popup renders only in the browser: an open menu is closed in the\n   * server HTML and opens once it has hydrated.\n   */\n  open?: boolean;\n  /**\n   * Initial open state of an uncontrolled popup menu; a popup menu starts closed without it.\n   * Passing it, even `false`, makes Menu a popup menu (see `open`), so for a Menu without\n   * `Menu.Trigger`/`Menu.Popover` children, leaving it out is not the same as `false`. The popup\n   * renders only in the browser: a menu open by default is closed in the server HTML and opens\n   * once it has hydrated.\n   */\n  defaultOpen?: boolean;\n  /**\n   * Called with the next open state when the popup menu opens or closes (only on change). Passing\n   * it makes Menu a popup menu (see `open`).\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Checked items of the menu's checkbox, radio and switch items, per group `name` (controlled).\n   * A submenu without its own `checkedValues` or `defaultCheckedValues` shares its parent menu's\n   * state. Works for static and popup menus; unlike `open`, it does not make Menu a popup menu.\n   */\n  checkedValues?: CheckedValues;\n  /** Initial checked items for uncontrolled usage (gives a submenu its own state). @default {} */\n  defaultCheckedValues?: CheckedValues;\n  /**\n   * Called when an item changes the checked items (only on change): the new checked values of every\n   * group first, then `details` with the group's `name`, its `checkedItems` and the `event` (Fluent's\n   * `onCheckedValueChange(event, { name, checkedItems })`). WaveUI always passes `details`; it is\n   * typed optional until 1.0. On a submenu that shares its parent's state it only listens: it is\n   * called after the parent's callback, for changes made in this submenu.\n   */\n  onCheckedValuesChange?: CheckedValuesChangeHandler;\n  /**\n   * Keep a popup menu open after any of its items is activated; an item's own `persistOnClick`\n   * wins. A submenu inherits it unless it sets it.\n   * @default false\n   */\n  persistOnItemClick?: boolean;\n  /**\n   * Open the popup menu when a mouse pointer rests on its trigger, and close it once the pointer\n   * has been off the trigger and the menu for `closeDelay` while focus is not inside the menu. A\n   * menu opened by hover does not take focus; a click (or Enter, Space, ArrowDown) on its trigger\n   * keeps it open and moves focus into it, as opening it that way does. After Escape or an\n   * outside press it does not reopen until the pointer has left the trigger. Touch and pen never\n   * open it by hover, and an `aria-disabled` trigger never opens. A triangle between the trigger\n   * and the menu keeps it open while the pointer moves diagonally into it. Ignored with\n   * `openOnContext` (development warning) and on a static menu (development warning).\n   * @default false (true for a submenu)\n   */\n  openOnHover?: boolean;\n  /**\n   * Milliseconds a hovering mouse pointer rests on the trigger before the menu opens (mouse hover\n   * only). A submenu inherits its parent's, also from a static menu. @default 250\n   */\n  openDelay?: number;\n  /**\n   * Milliseconds before a hover-opened menu closes once the mouse pointer has left it and its\n   * trigger (mouse hover only). A submenu inherits its parent's, also from a static menu.\n   * @default 250\n   */\n  closeDelay?: number;\n  /**\n   * Make `Menu.Trigger` a context-menu region: a right click (a Ctrl+click on macOS, a long press\n   * where the browser reports one) opens the menu at the pointer, and Shift+F10 or the\n   * ContextMenu key opens it at the focused element inside the region, instead of a click; a\n   * second gesture while it is open moves it there. Focus returns to the element that had it.\n   * The browser's context menu is suppressed there and inside the menu, except in text fields\n   * inside the region, which keep it. A press elsewhere, a right click outside or a scroll that\n   * moves the region or the row of the gesture (the one under the pointer, or the focused one)\n   * closes it. The trigger gets no `aria-haspopup`/`aria-expanded` (it is not a menu button; with\n   * a render-prop child, do not spread them): name the menu with `aria-label` on `Menu.Popover`,\n   * and consider `aria-keyshortcuts=\"Shift+F10\"` on the region. iOS Safari reports no long press.\n   * Ignored on a submenu; `openOnHover` is ignored with it.\n   * @default false\n   */\n  openOnContext?: boolean;\n  /**\n   * Ref to the static menu element (`role=\"menu\"`). A popup menu renders no root element, so it\n   * ignores `ref`, `className` and other DOM props (development warning): pass them to\n   * `Menu.Popover`.\n   */\n  ref?: React.Ref<HTMLDivElement>;\n}\n\nconst noop = () => {};\n\n/** Default of `openDelay` and `closeDelay` (InfoLabel's hover delays). */\nconst HOVER_DELAY_MS = 250;\n\n/**\n * Whether the children contain a `Menu.Trigger` or `Menu.Popover`: direct children and the\n * children of Fragments only (other elements and components are not searched). Parts written in\n * a Server Component (lazy client references) are recognised too.\n */\nexport function hasPopupParts(children: React.ReactNode): boolean {\n  return flattenChildren(children).some(({ node }) =>\n    isElementOfType(node, MenuTrigger, MenuPopover),\n  );\n}\n\n/** Joins prop names for a message: `a`, `` `a` and `b` ``. */\nfunction listProps(names: string[]): string {\n  const quoted = names.map((name) => `\\`${name}\\``);\n  return quoted.length > 1\n    ? `${quoted.slice(0, -1).join(', ')} and ${quoted[quoted.length - 1]}`\n    : quoted.join('');\n}\n\n// The root of the `Menu` compound. Its component JSDoc is on the `Menu` export (Menu.tsx) only\n// (C-DOCS): a docblock here would replace it as the Storybook description.\nexport const MenuRoot = ({\n  children,\n  open: openProp,\n  defaultOpen,\n  onOpenChange,\n  checkedValues,\n  defaultCheckedValues,\n  onCheckedValuesChange,\n  persistOnItemClick: persistOnItemClickProp,\n  openOnHover: openOnHoverProp,\n  openDelay: openDelayProp,\n  closeDelay: closeDelayProp,\n  openOnContext: openOnContextProp,\n  className,\n  onKeyDown,\n  onKeyDownCapture,\n  onFocus,\n  onPointerMove,\n  ref,\n  ...rest\n}: MenuProps) => {\n  // A Menu rendered in a menu list with no portal between them is a submenu of that list's menu.\n  // A Menu inside a Popover or Dialog opened from an item sits one portal deeper: a root menu.\n  const list = useMenuListContext();\n  const portalDepth = React.useContext(PortalDepthContext);\n  const parentList = list !== null && list.portalDepth === portalDepth ? list : null;\n  const parent = parentList?.menu ?? null;\n  const isSubmenu = parent !== null;\n\n  const [openState, setOpen, openControlled] = useControllable(\n    openProp,\n    defaultOpen ?? false,\n    onOpenChange,\n  );\n  // The popup menu lives in a portal, which renders only in the browser: until then (the server\n  // HTML, hydration) the menu reports itself closed, so the trigger's aria-expanded and\n  // aria-controls never describe a menu that is not there. A submenu of a popup menu is open only\n  // while that menu is: a parent that closes (through its controlled prop, or while it runs an\n  // exit motion) takes the submenu's surface, layer and focus restore along in the same commit.\n  const isClient = useIsClient();\n  const parentOpen = parent === null || !parent.popup || parent.open;\n  const open = openState && isClient && parentOpen;\n  // A parent that closed without closing this submenu (its controlled `open` prop): an\n  // uncontrolled submenu closes too, so it does not reopen with the parent. A controlled\n  // submenu's state is the app's.\n  React.useLayoutEffect(() => {\n    if (parentOpen || !openState || openControlled) return;\n    setOpen(false);\n  }, [parentOpen, openState, openControlled, setOpen]);\n\n  const popup =\n    openProp !== undefined ||\n    defaultOpen !== undefined ||\n    onOpenChange !== undefined ||\n    hasPopupParts(children);\n\n  const triggerId = useId('wave-menu-trigger');\n  const menuId = useId('wave-menu');\n  const [labelledBy, setLabelledBy] = React.useState(triggerId);\n  const triggerRef = React.useRef<HTMLElement | null>(null);\n  const [triggerElement, setTriggerElementState] = React.useState<HTMLElement | null>(null);\n  const setTriggerElement = React.useCallback((element: HTMLElement | null) => {\n    triggerRef.current = element;\n    setTriggerElementState(element);\n  }, []);\n\n  // The open surface: its API in a ref (read in events), its element and layer in state (the\n  // hover and context-menu hooks observe them).\n  const surfaceApiRef = React.useRef<MenuSurfaceApi | null>(null);\n  const [surfaceElement, setSurfaceElement] = React.useState<HTMLElement | null>(null);\n  const [surfaceLayerId, setSurfaceLayerId] = React.useState('');\n  const registerSurface = React.useCallback((api: MenuSurfaceApi | null) => {\n    surfaceApiRef.current = api;\n    setSurfaceElement(api?.surface ?? null);\n    // Kept after the surface closes: a context gesture records its opener against the last layer.\n    if (api) setSurfaceLayerId(api.layerId);\n  }, []);\n\n  // Checked values: one state per menu tree. A Menu owns its state when it sets `checkedValues` or\n  // `defaultCheckedValues`, or has no parent; otherwise it uses its parent's, and its own\n  // `onCheckedValuesChange` only listens to the changes its items make (called after the owner's).\n  const ownChecked = useCheckedValues(checkedValues, defaultCheckedValues, onCheckedValuesChange);\n  const parentChecked = parent?.checked ?? null;\n  const ownsCheckedState =\n    parentChecked === null || checkedValues !== undefined || defaultCheckedValues !== undefined;\n  const listens = onCheckedValuesChange !== undefined;\n  const listener = useEventCallback(onCheckedValuesChange);\n  const sharedChecked = React.useMemo(\n    () =>\n      parentChecked && listens ? withCheckedValuesListener(parentChecked, listener) : parentChecked,\n    [parentChecked, listens, listener],\n  );\n  const checked = ownsCheckedState || sharedChecked === null ? ownChecked : sharedChecked;\n  const persistOnItemClick = persistOnItemClickProp ?? parent?.persistOnItemClick ?? false;\n  const openDelay = openDelayProp ?? parent?.openDelay ?? HOVER_DELAY_MS;\n  const closeDelay = closeDelayProp ?? parent?.closeDelay ?? HOVER_DELAY_MS;\n\n  // Context mode applies to a root popup menu; hover to a popup menu outside context mode.\n  const contextMode = popup && !isSubmenu && openOnContextProp === true;\n  const hoverMode = popup && !contextMode && (openOnHoverProp ?? isSubmenu);\n\n  // C-DEV: a popup menu renders no root element, so root DOM props and the ref go nowhere.\n  const ignoredProps: string[] = [];\n  if (popup) {\n    if (className !== undefined) ignoredProps.push('className');\n    if (onKeyDown !== undefined) ignoredProps.push('onKeyDown');\n    if (onKeyDownCapture !== undefined) ignoredProps.push('onKeyDownCapture');\n    if (onFocus !== undefined) ignoredProps.push('onFocus');\n    if (onPointerMove !== undefined) ignoredProps.push('onPointerMove');\n    for (const [name, value] of Object.entries(rest)) {\n      if (value !== undefined) ignoredProps.push(name);\n    }\n    if (ref != null) ignoredProps.push('ref');\n  }\n  const ignoredMessage =\n    ignoredProps.length === 0\n      ? ''\n      : `Menu: a popup menu (Menu.Trigger + Menu.Popover) renders no element of its own, so ${ignoredProps\n          .map((name) => `\\`${name}\\``)\n          .join(', ')} on Menu ${ignoredProps.length === 1 ? 'is' : 'are'} ignored. Pass ${\n          ignoredProps.length === 1 ? 'it' : 'them'\n        } to Menu.Popover (the menu surface) or to the trigger's child instead.`;\n  React.useEffect(() => {\n    if (ignoredMessage) warnOnce('Menu:popup-ignored-props', ignoredMessage);\n  }, [ignoredMessage]);\n\n  // C-DEV: the popup openings do nothing on a static menu; hover gives way to context gestures.\n  const staticPopupProps = popup\n    ? ''\n    : listProps(\n        [openOnHoverProp ? 'openOnHover' : null, openOnContextProp ? 'openOnContext' : null].filter(\n          (name): name is string => name !== null,\n        ),\n      );\n  const hoverAndContext = contextMode && openOnHoverProp === true;\n  React.useEffect(() => {\n    if (!staticPopupProps) return;\n    const [verb, pronoun] = staticPopupProps.includes(' and ') ? ['are', 'they'] : ['is', 'it'];\n    warnOnce(\n      'Menu:static-popup-props',\n      `Menu: ${staticPopupProps} ${verb} ignored on a static menu: ${pronoun} apply to a popup menu (Menu.Trigger + Menu.Popover). A static menu passes openDelay and closeDelay on to its submenus.`,\n    );\n  }, [staticPopupProps]);\n  React.useEffect(() => {\n    if (!hoverAndContext) return;\n    warnOnce(\n      'Menu:hover-and-context',\n      'Menu: openOnHover is ignored with openOnContext: a context menu opens only from a context gesture (a right click, Shift+F10 or the ContextMenu key).',\n    );\n  }, [hoverAndContext]);\n\n  const staticMenuRef = React.useRef<HTMLDivElement | null>(null);\n\n  // The open submenu of this menu's list (one at a time) and what focus inside means for the chain.\n  const openSubmenuRef = React.useRef<OpenSubmenu | null>(null);\n  const containsFocus = useEventCallback((): boolean => {\n    const surfaceApi = surfaceApiRef.current;\n    const element = surfaceApi?.surface ?? staticMenuRef.current;\n    const active = element?.ownerDocument.activeElement;\n    if (!element || !active) return false;\n    if (element.contains(active)) return true;\n    // A popup menu's layer tree holds its submenus and the portals opened from its items; its own\n    // elements (the trigger) do not count.\n    if (surfaceApi) {\n      return getLayerTreeElements(surfaceApi.layerId, { includeOwnElements: false }).some((el) =>\n        el.contains(active),\n      );\n    }\n    return openSubmenuRef.current?.containsFocus() ?? false;\n  });\n  // Focus in a list of the chain: this menu's list, else (recursively) its open submenu's. A\n  // portal opened from an item does not count, so hover never takes focus from it.\n  const listContainsFocus = useEventCallback((): boolean => {\n    const element = surfaceApiRef.current?.surface ?? staticMenuRef.current;\n    const active = element?.ownerDocument.activeElement;\n    if (element && active && element.contains(active)) return true;\n    return openSubmenuRef.current?.listContainsFocus() ?? false;\n  });\n\n  // Every close of this menu closes its open submenu first, innermost first, through the\n  // submenu's own state: each controlled submenu hears onOpenChange(false) once. A close asked for\n  // by the hover intent is marked (before the request, in case the app applies it synchronously),\n  // so the surface's focus restore moves no focus; every other close request, and the next\n  // opening, clears the mark. A submenu closed along with it is taken along by the restore itself.\n  const hoverCloseRef = React.useRef(false);\n  const isHoverClose = React.useCallback(() => hoverCloseRef.current, []);\n  const closeMenu = (byHover: boolean) => {\n    hoverCloseRef.current = byHover;\n    openSubmenuRef.current?.close();\n    setOpen(false);\n  };\n  const requestClose = useEventCallback(() => closeMenu(false));\n  const requestHoverClose = useEventCallback(() => closeMenu(true));\n\n  // Why the open menu is open: a hover opening stays unpinned (the hover close applies) until the\n  // trigger is activated; every other opening (click, keys, context, a controlled `open`) pins it.\n  const openReasonRef = React.useRef<'hover' | 'other'>('other');\n  const hoverOpenPendingRef = React.useRef(false);\n  const initialFocusRef = React.useRef<InitialFocus>('first');\n  React.useLayoutEffect(() => {\n    if (open) {\n      openReasonRef.current = hoverOpenPendingRef.current ? 'hover' : 'other';\n      hoverCloseRef.current = false;\n    }\n    hoverOpenPendingRef.current = false;\n  }, [open]);\n  const isHoverOpen = React.useCallback(() => openReasonRef.current === 'hover', []);\n\n  const {\n    triggerHandlers: hoverIntentTriggerHandlers,\n    surfaceHandlers: hoverSurfaceHandlers,\n    cancel: cancelHover,\n    startClose: startHoverClose,\n  } = useHoverIntent({\n    enabled: hoverMode,\n    open,\n    openDelay,\n    closeDelay,\n    trigger: triggerElement,\n    surface: surfaceElement,\n    group: parentList?.hoverGroup,\n    onOpen: () => {\n      hoverOpenPendingRef.current = true;\n      initialFocusRef.current = 'none';\n      setOpen(true);\n    },\n    onClose: requestHoverClose,\n    // Pinned, or focus inside the menu (not on its trigger): the hover close waits.\n    canClose: () => openReasonRef.current === 'hover' && !containsFocus(),\n  });\n\n  // A hover opening stays pending until the menu opens, in a later render too (an app that\n  // applies it in a transition). One the app has not applied when the pointer leaves the trigger\n  // (a controlled menu whose app kept `open` false) is forgotten then, so a later opening by the\n  // app is an ordinary one: it focuses the first item and is pinned.\n  const forgetHoverOpening = useEventCallback(() => {\n    if (open) return;\n    hoverOpenPendingRef.current = false;\n    if (initialFocusRef.current === 'none') initialFocusRef.current = 'first';\n  });\n  const hoverTriggerHandlers = React.useMemo<HoverIntent['triggerHandlers']>(\n    () => ({\n      ...hoverIntentTriggerHandlers,\n      onPointerLeave: (event) => {\n        hoverIntentTriggerHandlers.onPointerLeave(event);\n        forgetHoverOpening();\n      },\n    }),\n    [hoverIntentTriggerHandlers, forgetHoverOpening],\n  );\n\n  const openWithFocus = React.useCallback(\n    (target: InitialFocus) => {\n      // Any opening but hover pins the menu; an open, hover-opened menu is pinned and focused.\n      openReasonRef.current = 'other';\n      hoverOpenPendingRef.current = false;\n      cancelHover();\n      const surfaceApi = surfaceApiRef.current;\n      if (surfaceApi) {\n        if (target === 'last') surfaceApi.focusLast();\n        else if (target === 'first') surfaceApi.focusFirst();\n        return;\n      }\n      initialFocusRef.current = target;\n      setOpen(true);\n    },\n    [setOpen, cancelHover],\n  );\n  const takeInitialFocus = React.useCallback((): InitialFocus => {\n    const target = initialFocusRef.current;\n    initialFocusRef.current = 'first';\n    return target;\n  }, []);\n\n  // Context gestures on the trigger region: a context gesture opens the menu (focus on its first\n  // item) at the pointer or the focused row; a right click outside or an anchor-moving scroll\n  // closes it.\n  const {\n    anchor: contextAnchor,\n    fromContext,\n    opener: contextOpener,\n    triggerHandlers: contextTriggerHandlers,\n    surfaceHandlers: contextSurfaceHandlers,\n  } = useContextMenuAnchor({\n    enabled: contextMode,\n    open,\n    trigger: triggerElement,\n    layerId: surfaceLayerId,\n    onOpen: () => openWithFocus('first'),\n    onClose: requestClose,\n  });\n\n  // Focus follows the mouse: a submenu that loses focus to an item the pointer is focusing in an\n  // enclosing list becomes a hover-opened submenu and closes through the hover close. A submenu\n  // with `openOnHover={false}` has no hover close, so it closes at once, as for a keyboard move.\n  const parentListHoverFocusing = parentList?.isHoverFocusing;\n  const parentHoverFocusing = parent?.isHoverFocusing;\n  const isHoverFocusing = useEventCallback(\n    (): boolean => (parentListHoverFocusing?.() ?? false) || (parentHoverFocusing?.() ?? false),\n  );\n  // A press in progress that can be a context gesture: the right button, a Ctrl+press (the macOS\n  // context click) or a touch or pen press (a long press). Recorded at its pointerdown and\n  // forgotten at its pointerup, while a context menu is open.\n  const contextPressRef = React.useRef(false);\n  React.useEffect(() => {\n    if (!contextMode || !open || !triggerElement) return undefined;\n    const doc = triggerElement.ownerDocument;\n    const onPointerDown = (event: PointerEvent) => {\n      contextPressRef.current =\n        event.button === 2 ||\n        (event.button === 0 &&\n          (event.ctrlKey || event.pointerType === 'touch' || event.pointerType === 'pen'));\n    };\n    const onPointerEnd = () => {\n      contextPressRef.current = false;\n    };\n    doc.addEventListener('pointerdown', onPointerDown, true);\n    doc.addEventListener('pointerup', onPointerEnd, true);\n    doc.addEventListener('pointercancel', onPointerEnd, true);\n    return () => {\n      doc.removeEventListener('pointerdown', onPointerDown, true);\n      doc.removeEventListener('pointerup', onPointerEnd, true);\n      doc.removeEventListener('pointercancel', onPointerEnd, true);\n      contextPressRef.current = false;\n    };\n  }, [contextMode, open, triggerElement]);\n\n  const dismiss = useEventCallback((reason: DismissReason, event: Event) => {\n    // Focus that such a press moves into a context menu's region does not close the menu: a\n    // right-button (or macOS Ctrl+) press focuses the row under the pointer before the contextmenu\n    // event that moves the menu there (Chromium, Firefox). Any other focus move into the region (a\n    // primary press, the app) closes it, as does an outside press and Tab (the surface's handler).\n    if (\n      reason === 'focus-outside' &&\n      contextMode &&\n      contextPressRef.current &&\n      event.target instanceof Node &&\n      triggerRef.current?.contains(event.target)\n    ) {\n      return;\n    }\n    if (reason === 'focus-outside' && isSubmenu && hoverMode && isHoverFocusing()) {\n      openReasonRef.current = 'hover';\n      startHoverClose(event);\n      return;\n    }\n    requestClose();\n  });\n\n  const registerOpenSubmenu = React.useCallback((submenu: OpenSubmenu) => {\n    const previous = openSubmenuRef.current;\n    openSubmenuRef.current = submenu;\n    // One open submenu per list: the one open before closes.\n    if (previous && previous !== submenu) previous.close();\n    return () => {\n      if (openSubmenuRef.current === submenu) openSubmenuRef.current = null;\n    };\n  }, []);\n\n  // A submenu registers with its parent while it is open.\n  const submenuHandle = React.useMemo<OpenSubmenu>(\n    () => ({ close: requestClose, containsFocus, listContainsFocus }),\n    [requestClose, containsFocus, listContainsFocus],\n  );\n  const registerWithParent = parent?.registerOpenSubmenu;\n  React.useLayoutEffect(() => {\n    if (!open || !registerWithParent) return undefined;\n    return registerWithParent(submenuHandle);\n  }, [open, registerWithParent, submenuHandle]);\n\n  // Item activation and Tab close the whole chain: a submenu of a popup menu hands the close up,\n  // and the top menu (the root, or a submenu of a static menu) puts focus on its return target\n  // first (focus before close: a Dialog an item opens returns focus there), then closes.\n  const parentCloseChain = parent?.popup ? parent.closeChain : null;\n  const closeChain = useEventCallback(() => {\n    if (parentCloseChain) {\n      parentCloseChain();\n      return;\n    }\n    if (!popup) return;\n    const target = surfaceApiRef.current?.getReturnFocus() ?? null;\n    if (target) {\n      const doc = target.ownerDocument;\n      const active = doc.activeElement;\n      const lost = !active || active === doc.body || active === doc.documentElement;\n      if (lost || containsFocus()) target.focus({ preventScroll: true });\n    }\n    requestClose();\n  });\n\n  const contextValue = React.useMemo<MenuContextValue>(\n    () => ({\n      popup,\n      open,\n      setOpen,\n      openWithFocus,\n      takeInitialFocus,\n      registerSurface,\n      triggerId,\n      labelledBy,\n      onTriggerId: setLabelledBy,\n      menuId,\n      triggerRef,\n      triggerElement,\n      setTriggerElement,\n      parent,\n      checked,\n      persistOnItemClick,\n      isSubmenu,\n      requestClose,\n      closeChain,\n      registerOpenSubmenu,\n      listContainsFocus,\n      openDelay,\n      closeDelay,\n      dismiss,\n      isHoverFocusing,\n      isHoverOpen,\n      isHoverClose,\n      hoverTriggerHandlers,\n      hoverSurfaceHandlers,\n      openOnContext: contextMode,\n      contextTriggerHandlers,\n      contextSurfaceHandlers,\n      contextAnchor,\n      fromContext,\n      contextOpener,\n    }),\n    [\n      popup,\n      open,\n      setOpen,\n      openWithFocus,\n      takeInitialFocus,\n      registerSurface,\n      triggerId,\n      labelledBy,\n      menuId,\n      triggerElement,\n      setTriggerElement,\n      parent,\n      checked,\n      persistOnItemClick,\n      isSubmenu,\n      requestClose,\n      closeChain,\n      registerOpenSubmenu,\n      listContainsFocus,\n      openDelay,\n      closeDelay,\n      dismiss,\n      isHoverFocusing,\n      isHoverOpen,\n      isHoverClose,\n      hoverTriggerHandlers,\n      hoverSurfaceHandlers,\n      contextMode,\n      contextTriggerHandlers,\n      contextSurfaceHandlers,\n      contextAnchor,\n      fromContext,\n      contextOpener,\n    ],\n  );\n\n  // Static menu: roving tab stop over the items (the last focused one keeps it).\n  const {\n    containerProps: { ref: rovingRef },\n    handleKeyDown: rovingKeyDown,\n    handleKeyDownCapture: rovingKeyDownCapture,\n    handleFocus: rovingFocus,\n    focusFirst,\n    getTabIndex,\n  } = useRovingTabIndex({\n    orientation: 'vertical',\n    loop: true,\n    typeahead: true,\n    tabStop: 'last-focused',\n    manageTabIndex: true,\n    itemSelector: MENU_ITEM_SELECTOR,\n  });\n  const mergedRef = useMergedRefs<HTMLDivElement>(ref, rovingRef, staticMenuRef);\n\n  // Disabled items never hold the tab stop, so with no enabled item the static menu itself does:\n  // Tab still reaches it and a screen reader announces it. Checked whenever the roving hook's tab\n  // stop changes (`getTabIndex` changes with it: an item enabled, disabled, added or removed), and\n  // after it is stamped (this effect runs after the hook's).\n  const [menuIsTabStop, setMenuIsTabStop] = React.useState(false);\n  React.useLayoutEffect(() => {\n    const menu = staticMenuRef.current;\n    if (popup || !menu) return;\n    const noItemTabStop = getFirstTabbable(menu) === null;\n    if (noItemTabStop === menuIsTabStop) return;\n    setMenuIsTabStop(noItemTabStop);\n    // An item became enabled while the menu itself had focus: focus moves on to it, rather than\n    // staying on an element that is no longer focusable.\n    if (!noItemTabStop && menu.ownerDocument.activeElement === menu) focusFirst();\n  }, [popup, menuIsTabStop, focusFirst, getTabIndex]);\n\n  // The static menu is a menu list: its items close nothing when activated, and the item under\n  // the mouse takes focus while focus is inside the menu tree.\n  const registerCheckable = useCheckableRegistry();\n  const {\n    hoverGroup,\n    isHoverFocusing: isListHoverFocusing,\n    onPointerMove: listPointerMove,\n  } = useMenuListPointer(contextValue);\n  const listContext = React.useMemo<MenuListContextValue>(\n    () => ({\n      menu: contextValue,\n      isStatic: true,\n      portalDepth,\n      closeFromItem: noop,\n      registerCheckable,\n      hoverGroup,\n      isHoverFocusing: isListHoverFocusing,\n    }),\n    [contextValue, portalDepth, registerCheckable, hoverGroup, isListHoverFocusing],\n  );\n\n  if (popup) {\n    return <MenuContext.Provider value={contextValue}>{children}</MenuContext.Provider>;\n  }\n\n  return (\n    <MenuContext.Provider value={contextValue}>\n      <MenuListContext.Provider value={listContext}>\n        <div\n          role=\"menu\"\n          {...rest}\n          ref={mergedRef}\n          tabIndex={rest.tabIndex ?? (menuIsTabStop ? 0 : undefined)}\n          data-roving-container=\"\"\n          onKeyDown={composeEventHandlers(onKeyDown, rovingKeyDown)}\n          onKeyDownCapture={withTypeaheadText(\n            composeEventHandlers(onKeyDownCapture, rovingKeyDownCapture),\n          )}\n          onFocus={composeEventHandlers(onFocus, rovingFocus, { checkDefaultPrevented: false })}\n          onPointerMove={composeEventHandlers(onPointerMove, listPointerMove)}\n          className={cn(menuSurfaceClasses, focusRing, className)}\n        >\n          {children}\n        </div>\n      </MenuListContext.Provider>\n    </MenuContext.Provider>\n  );\n};\nMenuRoot.displayName = 'Menu';\n"],"mappings":"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"}
+{"version":3,"file":"Menu.root.mjs","names":["useId","useId$1","React","noop","HOVER_DELAY_MS","hasPopupParts","flattenChildren","children","isElementOfType","node","MenuTrigger","MenuPopover","listProps","quoted","names","name","MenuRoot","openProp","persistOnItemClickProp","openOnHoverProp","openDelayProp","closeDelayProp","openOnContextProp","rest","list","useMenuListContext","portalDepth","PortalDepthContext","parentList","parent","isSubmenu","openState","setOpen","openControlled","useControllable","defaultOpen","onOpenChange","isClient","useIsClient","parentOpen","open","popup","triggerId","menuId","labelledBy","setLabelledBy","triggerRef","triggerElement","setTriggerElementState","setTriggerElement","element","surfaceApiRef","surfaceElement","setSurfaceElement","surfaceLayerId","setSurfaceLayerId","registerSurface","api","ownChecked","useCheckedValues","checkedValues","defaultCheckedValues","onCheckedValuesChange","parentChecked","ownsCheckedState","listens","listener","useEventCallback","sharedChecked","withCheckedValuesListener","checked","persistOnItemClick","openDelay","closeDelay","contextMode","hoverMode","ignoredProps","className","onKeyDown","onKeyDownCapture","onFocus","onPointerMove","value","ref","ignoredMessage","warnOnce","staticPopupProps","hoverAndContext","verb","pronoun","staticMenuRef","openSubmenuRef","containsFocus","surfaceApi","active","getLayerTreeElements","el","listContainsFocus","hoverCloseRef","isHoverClose","closeMenu","byHover","requestClose","requestHoverClose","openReasonRef","hoverOpenPendingRef","initialFocusRef","isHoverOpen","hoverIntentTriggerHandlers","hoverSurfaceHandlers","cancelHover","startHoverClose","useHoverIntent","forgetHoverOpening","hoverTriggerHandlers","event","openWithFocus","target","takeInitialFocus","contextAnchor","contextOpener","contextTriggerHandlers","contextSurfaceHandlers","useContextMenuAnchor","parentListHoverFocusing","parentHoverFocusing","isHoverFocusing","contextPressRef","doc","onPointerDown","onPointerEnd","dismiss","reason","registerOpenSubmenu","previous","submenu","submenuHandle","registerWithParent","parentCloseChain","closeChain","contextValue","fromContext","rovingRef","rovingKeyDown","rovingKeyDownCapture","rovingFocus","useRovingTabIndex","MENU_ITEM_SELECTOR","mergedRef","useMergedRefs","menuIsTabStop","setMenuIsTabStop","menu","noItemTabStop","getFirstTabbable","focusFirst","getTabIndex","registerCheckable","useCheckableRegistry","isListHoverFocusing","listPointerMove","useMenuListPointer","listContext","hoverGroup","MenuContext","MenuListContext","composeEventHandlers","withTypeaheadText","cn","menuClassNames","menuSurfaceClasses","focusRing"],"sources":["../../../src/components/navigation/Menu.root.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { menuClassNames } from '../../lib/classNames';\nimport { composeEventHandlers } from '../../lib/composeEventHandlers';\nimport { warnOnce } from '../../lib/dev';\nimport { flattenChildren, isElementOfType } from '../../lib/children';\nimport { getFirstTabbable } from '../../lib/focus';\nimport { getLayerTreeElements, type DismissReason } from '../../lib/layers';\nimport { focusRing } from '../../lib/styles';\nimport type { CheckedValues, CheckedValuesChangeHandler } from '../../lib/types';\nimport { useCheckedValues, withCheckedValuesListener } from '../../hooks/useCheckedValues';\nimport { useContextMenuAnchor } from '../../hooks/useContextMenuAnchor';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useEventCallback } from '../../hooks/useEventCallback';\nimport { useHoverIntent, type HoverIntent } from '../../hooks/useHoverIntent';\nimport { useId } from '../../hooks/useId';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { useRovingTabIndex } from '../../hooks/useRovingTabIndex';\nimport { PortalDepthContext } from '../portal/Portal';\nimport {\n  MenuContext,\n  MenuListContext,\n  useCheckableRegistry,\n  useMenuListContext,\n} from './Menu.context';\nimport type {\n  InitialFocus,\n  MenuContextValue,\n  MenuListContextValue,\n  MenuSurfaceApi,\n  OpenSubmenu,\n} from './Menu.context';\nimport { MENU_ITEM_SELECTOR, menuSurfaceClasses, withTypeaheadText } from './Menu.shared';\nimport { MenuPopover, useMenuListPointer } from './Menu.popover';\nimport { MenuTrigger } from './Menu.trigger';\n\n/** Properties for the Menu component. */\nexport interface MenuProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Menu items and dividers (static menu), or a `Menu.Trigger` and a `Menu.Popover` (popup menu).\n   */\n  children: React.ReactNode;\n  /**\n   * Controlled open state of a popup menu (`Menu.Trigger` + `Menu.Popover`). Passing it, even\n   * `false` (like passing `defaultOpen` or `onOpenChange`), makes Menu a popup menu that renders no\n   * element of its own: use it only with `Menu.Trigger`/`Menu.Popover`. Items outside\n   * `Menu.Popover` then have no `role=\"menu\"` parent (development warning). Leave all three out\n   * for a static menu. The popup renders only in the browser: an open menu is closed in the\n   * server HTML and opens once it has hydrated.\n   */\n  open?: boolean;\n  /**\n   * Initial open state of an uncontrolled popup menu; a popup menu starts closed without it.\n   * Passing it, even `false`, makes Menu a popup menu (see `open`), so for a Menu without\n   * `Menu.Trigger`/`Menu.Popover` children, leaving it out is not the same as `false`. The popup\n   * renders only in the browser: a menu open by default is closed in the server HTML and opens\n   * once it has hydrated.\n   */\n  defaultOpen?: boolean;\n  /**\n   * Called with the next open state when the popup menu opens or closes (only on change). Passing\n   * it makes Menu a popup menu (see `open`).\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Checked items of the menu's checkbox, radio and switch items, per group `name` (controlled).\n   * A submenu without its own `checkedValues` or `defaultCheckedValues` shares its parent menu's\n   * state. Works for static and popup menus; unlike `open`, it does not make Menu a popup menu.\n   */\n  checkedValues?: CheckedValues;\n  /** Initial checked items for uncontrolled usage (gives a submenu its own state). @default {} */\n  defaultCheckedValues?: CheckedValues;\n  /**\n   * Called when an item changes the checked items (only on change): the new checked values of every\n   * group first, then `details` with the group's `name`, its `checkedItems` and the `event` (Fluent's\n   * `onCheckedValueChange(event, { name, checkedItems })`). WaveUI always passes `details`; it is\n   * typed optional until 1.0. On a submenu that shares its parent's state it only listens: it is\n   * called after the parent's callback, for changes made in this submenu.\n   */\n  onCheckedValuesChange?: CheckedValuesChangeHandler;\n  /**\n   * Keep a popup menu open after any of its items is activated; an item's own `persistOnClick`\n   * wins. A submenu inherits it unless it sets it.\n   * @default false\n   */\n  persistOnItemClick?: boolean;\n  /**\n   * Open the popup menu when a mouse pointer rests on its trigger, and close it once the pointer\n   * has been off the trigger and the menu for `closeDelay` while focus is not inside the menu. A\n   * menu opened by hover does not take focus; a click (or Enter, Space, ArrowDown) on its trigger\n   * keeps it open and moves focus into it, as opening it that way does. After Escape or an\n   * outside press it does not reopen until the pointer has left the trigger. Touch and pen never\n   * open it by hover, and an `aria-disabled` trigger never opens. A triangle between the trigger\n   * and the menu keeps it open while the pointer moves diagonally into it. Ignored with\n   * `openOnContext` (development warning) and on a static menu (development warning).\n   * @default false (true for a submenu)\n   */\n  openOnHover?: boolean;\n  /**\n   * Milliseconds a hovering mouse pointer rests on the trigger before the menu opens (mouse hover\n   * only). A submenu inherits its parent's, also from a static menu. @default 250\n   */\n  openDelay?: number;\n  /**\n   * Milliseconds before a hover-opened menu closes once the mouse pointer has left it and its\n   * trigger (mouse hover only). A submenu inherits its parent's, also from a static menu.\n   * @default 250\n   */\n  closeDelay?: number;\n  /**\n   * Make `Menu.Trigger` a context-menu region: a right click (a Ctrl+click on macOS, a long press\n   * where the browser reports one) opens the menu at the pointer, and Shift+F10 or the\n   * ContextMenu key opens it at the focused element inside the region, instead of a click; a\n   * second gesture while it is open moves it there. Focus returns to the element that had it.\n   * The browser's context menu is suppressed there and inside the menu, except in text fields\n   * inside the region, which keep it. A press elsewhere, a right click outside or a scroll that\n   * moves the region or the row of the gesture (the one under the pointer, or the focused one)\n   * closes it. The trigger gets no `aria-haspopup`/`aria-expanded` (it is not a menu button; with\n   * a render-prop child, do not spread them): name the menu with `aria-label` on `Menu.Popover`,\n   * and consider `aria-keyshortcuts=\"Shift+F10\"` on the region. iOS Safari reports no long press.\n   * Ignored on a submenu; `openOnHover` is ignored with it.\n   * @default false\n   */\n  openOnContext?: boolean;\n  /**\n   * Ref to the static menu element (`role=\"menu\"`). A popup menu renders no root element, so it\n   * ignores `ref`, `className` and other DOM props (development warning): pass them to\n   * `Menu.Popover`.\n   */\n  ref?: React.Ref<HTMLDivElement>;\n}\n\nconst noop = () => {};\n\n/** Default of `openDelay` and `closeDelay` (InfoLabel's hover delays). */\nconst HOVER_DELAY_MS = 250;\n\n/**\n * Whether the children contain a `Menu.Trigger` or `Menu.Popover`: direct children and the\n * children of Fragments only (other elements and components are not searched). Parts written in\n * a Server Component (lazy client references) are recognised too.\n */\nexport function hasPopupParts(children: React.ReactNode): boolean {\n  return flattenChildren(children).some(({ node }) =>\n    isElementOfType(node, MenuTrigger, MenuPopover),\n  );\n}\n\n/** Joins prop names for a message: `a`, `` `a` and `b` ``. */\nfunction listProps(names: string[]): string {\n  const quoted = names.map((name) => `\\`${name}\\``);\n  return quoted.length > 1\n    ? `${quoted.slice(0, -1).join(', ')} and ${quoted[quoted.length - 1]}`\n    : quoted.join('');\n}\n\n// The root of the `Menu` compound. Its component JSDoc is on the `Menu` export (Menu.tsx) only\n// (C-DOCS): a docblock here would replace it as the Storybook description.\nexport const MenuRoot = ({\n  children,\n  open: openProp,\n  defaultOpen,\n  onOpenChange,\n  checkedValues,\n  defaultCheckedValues,\n  onCheckedValuesChange,\n  persistOnItemClick: persistOnItemClickProp,\n  openOnHover: openOnHoverProp,\n  openDelay: openDelayProp,\n  closeDelay: closeDelayProp,\n  openOnContext: openOnContextProp,\n  className,\n  onKeyDown,\n  onKeyDownCapture,\n  onFocus,\n  onPointerMove,\n  ref,\n  ...rest\n}: MenuProps) => {\n  // A Menu rendered in a menu list with no portal between them is a submenu of that list's menu.\n  // A Menu inside a Popover or Dialog opened from an item sits one portal deeper: a root menu.\n  const list = useMenuListContext();\n  const portalDepth = React.useContext(PortalDepthContext);\n  const parentList = list !== null && list.portalDepth === portalDepth ? list : null;\n  const parent = parentList?.menu ?? null;\n  const isSubmenu = parent !== null;\n\n  const [openState, setOpen, openControlled] = useControllable(\n    openProp,\n    defaultOpen ?? false,\n    onOpenChange,\n  );\n  // The popup menu lives in a portal, which renders only in the browser: until then (the server\n  // HTML, hydration) the menu reports itself closed, so the trigger's aria-expanded and\n  // aria-controls never describe a menu that is not there. A submenu of a popup menu is open only\n  // while that menu is: a parent that closes (through its controlled prop, or while it runs an\n  // exit motion) takes the submenu's surface, layer and focus restore along in the same commit.\n  const isClient = useIsClient();\n  const parentOpen = parent === null || !parent.popup || parent.open;\n  const open = openState && isClient && parentOpen;\n  // A parent that closed without closing this submenu (its controlled `open` prop): an\n  // uncontrolled submenu closes too, so it does not reopen with the parent. A controlled\n  // submenu's state is the app's.\n  React.useLayoutEffect(() => {\n    if (parentOpen || !openState || openControlled) return;\n    setOpen(false);\n  }, [parentOpen, openState, openControlled, setOpen]);\n\n  const popup =\n    openProp !== undefined ||\n    defaultOpen !== undefined ||\n    onOpenChange !== undefined ||\n    hasPopupParts(children);\n\n  const triggerId = useId('wave-menu-trigger');\n  const menuId = useId('wave-menu');\n  const [labelledBy, setLabelledBy] = React.useState(triggerId);\n  const triggerRef = React.useRef<HTMLElement | null>(null);\n  const [triggerElement, setTriggerElementState] = React.useState<HTMLElement | null>(null);\n  const setTriggerElement = React.useCallback((element: HTMLElement | null) => {\n    triggerRef.current = element;\n    setTriggerElementState(element);\n  }, []);\n\n  // The open surface: its API in a ref (read in events), its element and layer in state (the\n  // hover and context-menu hooks observe them).\n  const surfaceApiRef = React.useRef<MenuSurfaceApi | null>(null);\n  const [surfaceElement, setSurfaceElement] = React.useState<HTMLElement | null>(null);\n  const [surfaceLayerId, setSurfaceLayerId] = React.useState('');\n  const registerSurface = React.useCallback((api: MenuSurfaceApi | null) => {\n    surfaceApiRef.current = api;\n    setSurfaceElement(api?.surface ?? null);\n    // Kept after the surface closes: a context gesture records its opener against the last layer.\n    if (api) setSurfaceLayerId(api.layerId);\n  }, []);\n\n  // Checked values: one state per menu tree. A Menu owns its state when it sets `checkedValues` or\n  // `defaultCheckedValues`, or has no parent; otherwise it uses its parent's, and its own\n  // `onCheckedValuesChange` only listens to the changes its items make (called after the owner's).\n  const ownChecked = useCheckedValues(checkedValues, defaultCheckedValues, onCheckedValuesChange);\n  const parentChecked = parent?.checked ?? null;\n  const ownsCheckedState =\n    parentChecked === null || checkedValues !== undefined || defaultCheckedValues !== undefined;\n  const listens = onCheckedValuesChange !== undefined;\n  const listener = useEventCallback(onCheckedValuesChange);\n  const sharedChecked = React.useMemo(\n    () =>\n      parentChecked && listens ? withCheckedValuesListener(parentChecked, listener) : parentChecked,\n    [parentChecked, listens, listener],\n  );\n  const checked = ownsCheckedState || sharedChecked === null ? ownChecked : sharedChecked;\n  const persistOnItemClick = persistOnItemClickProp ?? parent?.persistOnItemClick ?? false;\n  const openDelay = openDelayProp ?? parent?.openDelay ?? HOVER_DELAY_MS;\n  const closeDelay = closeDelayProp ?? parent?.closeDelay ?? HOVER_DELAY_MS;\n\n  // Context mode applies to a root popup menu; hover to a popup menu outside context mode.\n  const contextMode = popup && !isSubmenu && openOnContextProp === true;\n  const hoverMode = popup && !contextMode && (openOnHoverProp ?? isSubmenu);\n\n  // C-DEV: a popup menu renders no root element, so root DOM props and the ref go nowhere.\n  const ignoredProps: string[] = [];\n  if (popup) {\n    if (className !== undefined) ignoredProps.push('className');\n    if (onKeyDown !== undefined) ignoredProps.push('onKeyDown');\n    if (onKeyDownCapture !== undefined) ignoredProps.push('onKeyDownCapture');\n    if (onFocus !== undefined) ignoredProps.push('onFocus');\n    if (onPointerMove !== undefined) ignoredProps.push('onPointerMove');\n    for (const [name, value] of Object.entries(rest)) {\n      if (value !== undefined) ignoredProps.push(name);\n    }\n    if (ref != null) ignoredProps.push('ref');\n  }\n  const ignoredMessage =\n    ignoredProps.length === 0\n      ? ''\n      : `Menu: a popup menu (Menu.Trigger + Menu.Popover) renders no element of its own, so ${ignoredProps\n          .map((name) => `\\`${name}\\``)\n          .join(', ')} on Menu ${ignoredProps.length === 1 ? 'is' : 'are'} ignored. Pass ${\n          ignoredProps.length === 1 ? 'it' : 'them'\n        } to Menu.Popover (the menu surface) or to the trigger's child instead.`;\n  React.useEffect(() => {\n    if (ignoredMessage) warnOnce('Menu:popup-ignored-props', ignoredMessage);\n  }, [ignoredMessage]);\n\n  // C-DEV: the popup openings do nothing on a static menu; hover gives way to context gestures.\n  const staticPopupProps = popup\n    ? ''\n    : listProps(\n        [openOnHoverProp ? 'openOnHover' : null, openOnContextProp ? 'openOnContext' : null].filter(\n          (name): name is string => name !== null,\n        ),\n      );\n  const hoverAndContext = contextMode && openOnHoverProp === true;\n  React.useEffect(() => {\n    if (!staticPopupProps) return;\n    const [verb, pronoun] = staticPopupProps.includes(' and ') ? ['are', 'they'] : ['is', 'it'];\n    warnOnce(\n      'Menu:static-popup-props',\n      `Menu: ${staticPopupProps} ${verb} ignored on a static menu: ${pronoun} apply to a popup menu (Menu.Trigger + Menu.Popover). A static menu passes openDelay and closeDelay on to its submenus.`,\n    );\n  }, [staticPopupProps]);\n  React.useEffect(() => {\n    if (!hoverAndContext) return;\n    warnOnce(\n      'Menu:hover-and-context',\n      'Menu: openOnHover is ignored with openOnContext: a context menu opens only from a context gesture (a right click, Shift+F10 or the ContextMenu key).',\n    );\n  }, [hoverAndContext]);\n\n  const staticMenuRef = React.useRef<HTMLDivElement | null>(null);\n\n  // The open submenu of this menu's list (one at a time) and what focus inside means for the chain.\n  const openSubmenuRef = React.useRef<OpenSubmenu | null>(null);\n  const containsFocus = useEventCallback((): boolean => {\n    const surfaceApi = surfaceApiRef.current;\n    const element = surfaceApi?.surface ?? staticMenuRef.current;\n    const active = element?.ownerDocument.activeElement;\n    if (!element || !active) return false;\n    if (element.contains(active)) return true;\n    // A popup menu's layer tree holds its submenus and the portals opened from its items; its own\n    // elements (the trigger) do not count.\n    if (surfaceApi) {\n      return getLayerTreeElements(surfaceApi.layerId, { includeOwnElements: false }).some((el) =>\n        el.contains(active),\n      );\n    }\n    return openSubmenuRef.current?.containsFocus() ?? false;\n  });\n  // Focus in a list of the chain: this menu's list, else (recursively) its open submenu's. A\n  // portal opened from an item does not count, so hover never takes focus from it.\n  const listContainsFocus = useEventCallback((): boolean => {\n    const element = surfaceApiRef.current?.surface ?? staticMenuRef.current;\n    const active = element?.ownerDocument.activeElement;\n    if (element && active && element.contains(active)) return true;\n    return openSubmenuRef.current?.listContainsFocus() ?? false;\n  });\n\n  // Every close of this menu closes its open submenu first, innermost first, through the\n  // submenu's own state: each controlled submenu hears onOpenChange(false) once. A close asked for\n  // by the hover intent is marked (before the request, in case the app applies it synchronously),\n  // so the surface's focus restore moves no focus; every other close request, and the next\n  // opening, clears the mark. A submenu closed along with it is taken along by the restore itself.\n  const hoverCloseRef = React.useRef(false);\n  const isHoverClose = React.useCallback(() => hoverCloseRef.current, []);\n  const closeMenu = (byHover: boolean) => {\n    hoverCloseRef.current = byHover;\n    openSubmenuRef.current?.close();\n    setOpen(false);\n  };\n  const requestClose = useEventCallback(() => closeMenu(false));\n  const requestHoverClose = useEventCallback(() => closeMenu(true));\n\n  // Why the open menu is open: a hover opening stays unpinned (the hover close applies) until the\n  // trigger is activated; every other opening (click, keys, context, a controlled `open`) pins it.\n  const openReasonRef = React.useRef<'hover' | 'other'>('other');\n  const hoverOpenPendingRef = React.useRef(false);\n  const initialFocusRef = React.useRef<InitialFocus>('first');\n  React.useLayoutEffect(() => {\n    if (open) {\n      openReasonRef.current = hoverOpenPendingRef.current ? 'hover' : 'other';\n      hoverCloseRef.current = false;\n    }\n    hoverOpenPendingRef.current = false;\n  }, [open]);\n  const isHoverOpen = React.useCallback(() => openReasonRef.current === 'hover', []);\n\n  const {\n    triggerHandlers: hoverIntentTriggerHandlers,\n    surfaceHandlers: hoverSurfaceHandlers,\n    cancel: cancelHover,\n    startClose: startHoverClose,\n  } = useHoverIntent({\n    enabled: hoverMode,\n    open,\n    openDelay,\n    closeDelay,\n    trigger: triggerElement,\n    surface: surfaceElement,\n    group: parentList?.hoverGroup,\n    onOpen: () => {\n      hoverOpenPendingRef.current = true;\n      initialFocusRef.current = 'none';\n      setOpen(true);\n    },\n    onClose: requestHoverClose,\n    // Pinned, or focus inside the menu (not on its trigger): the hover close waits.\n    canClose: () => openReasonRef.current === 'hover' && !containsFocus(),\n  });\n\n  // A hover opening stays pending until the menu opens, in a later render too (an app that\n  // applies it in a transition). One the app has not applied when the pointer leaves the trigger\n  // (a controlled menu whose app kept `open` false) is forgotten then, so a later opening by the\n  // app is an ordinary one: it focuses the first item and is pinned.\n  const forgetHoverOpening = useEventCallback(() => {\n    if (open) return;\n    hoverOpenPendingRef.current = false;\n    if (initialFocusRef.current === 'none') initialFocusRef.current = 'first';\n  });\n  const hoverTriggerHandlers = React.useMemo<HoverIntent['triggerHandlers']>(\n    () => ({\n      ...hoverIntentTriggerHandlers,\n      onPointerLeave: (event) => {\n        hoverIntentTriggerHandlers.onPointerLeave(event);\n        forgetHoverOpening();\n      },\n    }),\n    [hoverIntentTriggerHandlers, forgetHoverOpening],\n  );\n\n  const openWithFocus = React.useCallback(\n    (target: InitialFocus) => {\n      // Any opening but hover pins the menu; an open, hover-opened menu is pinned and focused.\n      openReasonRef.current = 'other';\n      hoverOpenPendingRef.current = false;\n      cancelHover();\n      const surfaceApi = surfaceApiRef.current;\n      if (surfaceApi) {\n        if (target === 'last') surfaceApi.focusLast();\n        else if (target === 'first') surfaceApi.focusFirst();\n        return;\n      }\n      initialFocusRef.current = target;\n      setOpen(true);\n    },\n    [setOpen, cancelHover],\n  );\n  const takeInitialFocus = React.useCallback((): InitialFocus => {\n    const target = initialFocusRef.current;\n    initialFocusRef.current = 'first';\n    return target;\n  }, []);\n\n  // Context gestures on the trigger region: a context gesture opens the menu (focus on its first\n  // item) at the pointer or the focused row; a right click outside or an anchor-moving scroll\n  // closes it.\n  const {\n    anchor: contextAnchor,\n    fromContext,\n    opener: contextOpener,\n    triggerHandlers: contextTriggerHandlers,\n    surfaceHandlers: contextSurfaceHandlers,\n  } = useContextMenuAnchor({\n    enabled: contextMode,\n    open,\n    trigger: triggerElement,\n    layerId: surfaceLayerId,\n    onOpen: () => openWithFocus('first'),\n    onClose: requestClose,\n  });\n\n  // Focus follows the mouse: a submenu that loses focus to an item the pointer is focusing in an\n  // enclosing list becomes a hover-opened submenu and closes through the hover close. A submenu\n  // with `openOnHover={false}` has no hover close, so it closes at once, as for a keyboard move.\n  const parentListHoverFocusing = parentList?.isHoverFocusing;\n  const parentHoverFocusing = parent?.isHoverFocusing;\n  const isHoverFocusing = useEventCallback(\n    (): boolean => (parentListHoverFocusing?.() ?? false) || (parentHoverFocusing?.() ?? false),\n  );\n  // A press in progress that can be a context gesture: the right button, a Ctrl+press (the macOS\n  // context click) or a touch or pen press (a long press). Recorded at its pointerdown and\n  // forgotten at its pointerup, while a context menu is open.\n  const contextPressRef = React.useRef(false);\n  React.useEffect(() => {\n    if (!contextMode || !open || !triggerElement) return undefined;\n    const doc = triggerElement.ownerDocument;\n    const onPointerDown = (event: PointerEvent) => {\n      contextPressRef.current =\n        event.button === 2 ||\n        (event.button === 0 &&\n          (event.ctrlKey || event.pointerType === 'touch' || event.pointerType === 'pen'));\n    };\n    const onPointerEnd = () => {\n      contextPressRef.current = false;\n    };\n    doc.addEventListener('pointerdown', onPointerDown, true);\n    doc.addEventListener('pointerup', onPointerEnd, true);\n    doc.addEventListener('pointercancel', onPointerEnd, true);\n    return () => {\n      doc.removeEventListener('pointerdown', onPointerDown, true);\n      doc.removeEventListener('pointerup', onPointerEnd, true);\n      doc.removeEventListener('pointercancel', onPointerEnd, true);\n      contextPressRef.current = false;\n    };\n  }, [contextMode, open, triggerElement]);\n\n  const dismiss = useEventCallback((reason: DismissReason, event: Event) => {\n    // Focus that such a press moves into a context menu's region does not close the menu: a\n    // right-button (or macOS Ctrl+) press focuses the row under the pointer before the contextmenu\n    // event that moves the menu there (Chromium, Firefox). Any other focus move into the region (a\n    // primary press, the app) closes it, as does an outside press and Tab (the surface's handler).\n    if (\n      reason === 'focus-outside' &&\n      contextMode &&\n      contextPressRef.current &&\n      event.target instanceof Node &&\n      triggerRef.current?.contains(event.target)\n    ) {\n      return;\n    }\n    if (reason === 'focus-outside' && isSubmenu && hoverMode && isHoverFocusing()) {\n      openReasonRef.current = 'hover';\n      startHoverClose(event);\n      return;\n    }\n    requestClose();\n  });\n\n  const registerOpenSubmenu = React.useCallback((submenu: OpenSubmenu) => {\n    const previous = openSubmenuRef.current;\n    openSubmenuRef.current = submenu;\n    // One open submenu per list: the one open before closes.\n    if (previous && previous !== submenu) previous.close();\n    return () => {\n      if (openSubmenuRef.current === submenu) openSubmenuRef.current = null;\n    };\n  }, []);\n\n  // A submenu registers with its parent while it is open.\n  const submenuHandle = React.useMemo<OpenSubmenu>(\n    () => ({ close: requestClose, containsFocus, listContainsFocus }),\n    [requestClose, containsFocus, listContainsFocus],\n  );\n  const registerWithParent = parent?.registerOpenSubmenu;\n  React.useLayoutEffect(() => {\n    if (!open || !registerWithParent) return undefined;\n    return registerWithParent(submenuHandle);\n  }, [open, registerWithParent, submenuHandle]);\n\n  // Item activation and Tab close the whole chain: a submenu of a popup menu hands the close up,\n  // and the top menu (the root, or a submenu of a static menu) puts focus on its return target\n  // first (focus before close: a Dialog an item opens returns focus there), then closes.\n  const parentCloseChain = parent?.popup ? parent.closeChain : null;\n  const closeChain = useEventCallback(() => {\n    if (parentCloseChain) {\n      parentCloseChain();\n      return;\n    }\n    if (!popup) return;\n    const target = surfaceApiRef.current?.getReturnFocus() ?? null;\n    if (target) {\n      const doc = target.ownerDocument;\n      const active = doc.activeElement;\n      const lost = !active || active === doc.body || active === doc.documentElement;\n      if (lost || containsFocus()) target.focus({ preventScroll: true });\n    }\n    requestClose();\n  });\n\n  const contextValue = React.useMemo<MenuContextValue>(\n    () => ({\n      popup,\n      open,\n      setOpen,\n      openWithFocus,\n      takeInitialFocus,\n      registerSurface,\n      triggerId,\n      labelledBy,\n      onTriggerId: setLabelledBy,\n      menuId,\n      triggerRef,\n      triggerElement,\n      setTriggerElement,\n      parent,\n      checked,\n      persistOnItemClick,\n      isSubmenu,\n      requestClose,\n      closeChain,\n      registerOpenSubmenu,\n      listContainsFocus,\n      openDelay,\n      closeDelay,\n      dismiss,\n      isHoverFocusing,\n      isHoverOpen,\n      isHoverClose,\n      hoverTriggerHandlers,\n      hoverSurfaceHandlers,\n      openOnContext: contextMode,\n      contextTriggerHandlers,\n      contextSurfaceHandlers,\n      contextAnchor,\n      fromContext,\n      contextOpener,\n    }),\n    [\n      popup,\n      open,\n      setOpen,\n      openWithFocus,\n      takeInitialFocus,\n      registerSurface,\n      triggerId,\n      labelledBy,\n      menuId,\n      triggerElement,\n      setTriggerElement,\n      parent,\n      checked,\n      persistOnItemClick,\n      isSubmenu,\n      requestClose,\n      closeChain,\n      registerOpenSubmenu,\n      listContainsFocus,\n      openDelay,\n      closeDelay,\n      dismiss,\n      isHoverFocusing,\n      isHoverOpen,\n      isHoverClose,\n      hoverTriggerHandlers,\n      hoverSurfaceHandlers,\n      contextMode,\n      contextTriggerHandlers,\n      contextSurfaceHandlers,\n      contextAnchor,\n      fromContext,\n      contextOpener,\n    ],\n  );\n\n  // Static menu: roving tab stop over the items (the last focused one keeps it).\n  const {\n    containerProps: { ref: rovingRef },\n    handleKeyDown: rovingKeyDown,\n    handleKeyDownCapture: rovingKeyDownCapture,\n    handleFocus: rovingFocus,\n    focusFirst,\n    getTabIndex,\n  } = useRovingTabIndex({\n    orientation: 'vertical',\n    loop: true,\n    typeahead: true,\n    tabStop: 'last-focused',\n    manageTabIndex: true,\n    itemSelector: MENU_ITEM_SELECTOR,\n  });\n  const mergedRef = useMergedRefs<HTMLDivElement>(ref, rovingRef, staticMenuRef);\n\n  // Disabled items never hold the tab stop, so with no enabled item the static menu itself does:\n  // Tab still reaches it and a screen reader announces it. Checked whenever the roving hook's tab\n  // stop changes (`getTabIndex` changes with it: an item enabled, disabled, added or removed), and\n  // after it is stamped (this effect runs after the hook's).\n  const [menuIsTabStop, setMenuIsTabStop] = React.useState(false);\n  React.useLayoutEffect(() => {\n    const menu = staticMenuRef.current;\n    if (popup || !menu) return;\n    const noItemTabStop = getFirstTabbable(menu) === null;\n    if (noItemTabStop === menuIsTabStop) return;\n    setMenuIsTabStop(noItemTabStop);\n    // An item became enabled while the menu itself had focus: focus moves on to it, rather than\n    // staying on an element that is no longer focusable.\n    if (!noItemTabStop && menu.ownerDocument.activeElement === menu) focusFirst();\n  }, [popup, menuIsTabStop, focusFirst, getTabIndex]);\n\n  // The static menu is a menu list: its items close nothing when activated, and the item under\n  // the mouse takes focus while focus is inside the menu tree.\n  const registerCheckable = useCheckableRegistry();\n  const {\n    hoverGroup,\n    isHoverFocusing: isListHoverFocusing,\n    onPointerMove: listPointerMove,\n  } = useMenuListPointer(contextValue);\n  const listContext = React.useMemo<MenuListContextValue>(\n    () => ({\n      menu: contextValue,\n      isStatic: true,\n      portalDepth,\n      closeFromItem: noop,\n      registerCheckable,\n      hoverGroup,\n      isHoverFocusing: isListHoverFocusing,\n    }),\n    [contextValue, portalDepth, registerCheckable, hoverGroup, isListHoverFocusing],\n  );\n\n  if (popup) {\n    return <MenuContext.Provider value={contextValue}>{children}</MenuContext.Provider>;\n  }\n\n  return (\n    <MenuContext.Provider value={contextValue}>\n      <MenuListContext.Provider value={listContext}>\n        <div\n          role=\"menu\"\n          {...rest}\n          ref={mergedRef}\n          tabIndex={rest.tabIndex ?? (menuIsTabStop ? 0 : undefined)}\n          data-roving-container=\"\"\n          onKeyDown={composeEventHandlers(onKeyDown, rovingKeyDown)}\n          onKeyDownCapture={withTypeaheadText(\n            composeEventHandlers(onKeyDownCapture, rovingKeyDownCapture),\n          )}\n          onFocus={composeEventHandlers(onFocus, rovingFocus, { checkDefaultPrevented: false })}\n          onPointerMove={composeEventHandlers(onPointerMove, listPointerMove)}\n          className={cn(menuClassNames.root, menuSurfaceClasses, focusRing, className)}\n        >\n          {children}\n        </div>\n      </MenuListContext.Provider>\n    </MenuContext.Provider>\n  );\n};\nMenuRoot.displayName = 'Menu';\n"],"mappings":"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"}

package/dist/components/navigation/Menu.selectable.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/dev.cjs"),r=require("../../lib/slot.cjs"),i=require("../../lib/styles.cjs"),a=require("../../lib/icons.cjs"),o=require("./Menu.context.cjs"),s=require("./Menu.shared.cjs"),c=require("./Menu.items.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("react/jsx-runtime");var d=`forced-colors:border-[Highlight] forced-colors:bg-[Highlight]`,f=`forced-colors:border-[GrayText] forced-colors:bg-[Canvas]`;function p(e,n){return(0,u.jsx)(`span`,{"aria-hidden":`true`,"data-menu-switch":``,className:t.cn(`relative inline-flex h-[16px] w-[32px] shrink-0 items-center rounded-full border transition-colors duration-200 motion-reduce:transition-none`,e?t.cn(`border-primary bg-primary`,n?f:d):t.cn(`border-stroke-accessible bg-transparent`,n?i.forcedColors.disabled:i.forcedColors.control)),children:(0,u.jsx)(`span`,{className:t.cn(`block h-[10px] w-[10px] rounded-full transition-transform duration-200 motion-reduce:transition-none forced-colors:forced-color-adjust-none`,e?`translate-x-[18px] wave-rtl:-translate-x-[18px] bg-primary-foreground`:`translate-x-[2px] wave-rtl:-translate-x-[2px] bg-stroke-accessible`,n?`forced-colors:bg-[GrayText]`:e?`forced-colors:bg-[HighlightText]`:`forced-colors:bg-[ButtonText]`)})})}function m({kind:e,componentName:i,name:d,value:f,checkmark:m,icon:h,shortcut:g,disabled:_=!1,persistOnClick:v,onClick:y,onKeyDown:b,children:x,className:S,ref:C,...w}){let T=o.useMenuContext(i),E=o.useMenuListContext();c.useMenuItemPlacementWarning(i);let D=(E?.menu??T).checked,O=D.isChecked(d,f),k=E?.registerCheckable;l.useEffect(()=>k?.(d,f),[k,d,f]);let A=m!=null&&r.slotRendersContent(m),j=m!=null&&!A;l.useEffect(()=>{j&&n.warnOnce(`${i}:checkmark-empty`,`${i}: \`checkmark\` renders nothing, so the item shows the default check glyph. A checked item always shows an indicator: pass an icon, or leave \`checkmark\` unset.`)},[j,i]);let M=c.useMenuItemActivation({disabled:_,persistOnClick:v,onClick:y,onKeyDown:b,keepOpenOnSpace:!0,onActivate:t=>{e===`radio`?D.select(d,f,t.nativeEvent):D.toggle(d,f,t.nativeEvent)}}),N=typeof x==`string`?x:void 0,P=w[`data-roving-text`]!==void 0,F;return e!==`switch`&&(F=O?A?r.renderSlot(m,`span`,`inline-flex shrink-0 items-center justify-center`,{"aria-hidden":!0}):(0,u.jsx)(a.CheckIcon,{size:16}):null),(0,u.jsx)(`div`,{role:e===`radio`?`menuitemradio`:`menuitemcheckbox`,"data-roving-text":N,...w,ref:C,"aria-checked":O,"data-checked":O?``:void 0,"aria-disabled":_?!0:w[`aria-disabled`],"data-disabled":_?``:void 0,onClick:M.onClick,onKeyDown:M.onKeyDown,className:t.cn(s.menuItemClasses,S),children:(0,u.jsx)(c.MenuItemRow,{checkmark:F,icon:h,label:x,shortcut:g,markLabel:!P,end:e===`switch`?p(O,_):void 0})})}m.displayName=`SelectableMenuItem`;var h=e=>(0,u.jsx)(m,{...e,kind:`checkbox`,componentName:`Menu.ItemCheckbox`});h.displayName=`MenuItemCheckbox`;var g=e=>(0,u.jsx)(m,{...e,kind:`radio`,componentName:`Menu.ItemRadio`});g.displayName=`MenuItemRadio`;var _=e=>(0,u.jsx)(m,{...e,kind:`switch`,componentName:`Menu.ItemSwitch`});_.displayName=`MenuItemSwitch`,exports.MenuItemCheckbox=h,exports.MenuItemRadio=g,exports.MenuItemSwitch=_;
+"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/dev.cjs"),r=require("../../lib/slot.cjs"),i=require("../../lib/classNames.cjs"),a=require("../../lib/styles.cjs"),o=require("../../lib/icons.cjs"),s=require("./Menu.context.cjs"),c=require("./Menu.shared.cjs"),l=require("./Menu.items.cjs");let u=require("react");u=e.__toESM(u,1);let d=require("react/jsx-runtime");var f=`forced-colors:border-[Highlight] forced-colors:bg-[Highlight]`,p=`forced-colors:border-[GrayText] forced-colors:bg-[Canvas]`;function m(e,n){return(0,d.jsx)(`span`,{"aria-hidden":`true`,"data-menu-switch":``,className:t.cn(i.menuItemSwitchClassNames.track,`relative inline-flex h-[16px] w-[32px] shrink-0 items-center rounded-full border transition-colors duration-200 motion-reduce:transition-none`,e?t.cn(`border-primary bg-primary`,n?p:f):t.cn(`border-stroke-accessible bg-transparent`,n?a.forcedColors.disabled:a.forcedColors.control)),children:(0,d.jsx)(`span`,{className:t.cn(i.menuItemSwitchClassNames.thumb,`block h-[10px] w-[10px] rounded-full transition-transform duration-200 motion-reduce:transition-none forced-colors:forced-color-adjust-none`,e?`translate-x-[18px] wave-rtl:-translate-x-[18px] bg-primary-foreground`:`translate-x-[2px] wave-rtl:-translate-x-[2px] bg-stroke-accessible`,n?`forced-colors:bg-[GrayText]`:e?`forced-colors:bg-[HighlightText]`:`forced-colors:bg-[ButtonText]`)})})}function h({kind:e,componentName:i,rootClassName:a,partClassNames:f,name:p,value:h,checkmark:g,icon:_,shortcut:v,disabled:y=!1,persistOnClick:b,onClick:x,onKeyDown:S,children:C,className:w,ref:T,...E}){let D=s.useMenuContext(i),O=s.useMenuListContext();l.useMenuItemPlacementWarning(i);let k=(O?.menu??D).checked,A=k.isChecked(p,h),j=O?.registerCheckable;u.useEffect(()=>j?.(p,h),[j,p,h]);let M=g!=null&&r.slotRendersContent(g),N=g!=null&&!M;u.useEffect(()=>{N&&n.warnOnce(`${i}:checkmark-empty`,`${i}: \`checkmark\` renders nothing, so the item shows the default check glyph. A checked item always shows an indicator: pass an icon, or leave \`checkmark\` unset.`)},[N,i]);let P=l.useMenuItemActivation({disabled:y,persistOnClick:b,onClick:x,onKeyDown:S,keepOpenOnSpace:!0,onActivate:t=>{e===`radio`?k.select(p,h,t.nativeEvent):k.toggle(p,h,t.nativeEvent)}}),F=typeof C==`string`?C:void 0,I=E[`data-roving-text`]!==void 0,L;return e!==`switch`&&(L=A?M?r.renderSlot(g,`span`,`inline-flex shrink-0 items-center justify-center`,{"aria-hidden":!0}):(0,d.jsx)(o.CheckIcon,{size:16}):null),(0,d.jsx)(`div`,{role:e===`radio`?`menuitemradio`:`menuitemcheckbox`,"data-roving-text":F,...E,ref:T,"aria-checked":A,"data-checked":A?``:void 0,"aria-disabled":y?!0:E[`aria-disabled`],"data-disabled":y?``:void 0,onClick:P.onClick,onKeyDown:P.onKeyDown,className:t.cn(a,c.menuItemClasses,w),children:(0,d.jsx)(l.MenuItemRow,{checkmark:L,icon:_,label:C,shortcut:v,markLabel:!I,partClassNames:f,end:e===`switch`?m(A,y):void 0})})}h.displayName=`SelectableMenuItem`;var g=e=>(0,d.jsx)(h,{...e,kind:`checkbox`,componentName:`Menu.ItemCheckbox`,rootClassName:t.cn(i.menuItemClassNames.root,i.menuItemCheckboxClassNames.root),partClassNames:{checkmark:t.cn(i.menuItemClassNames.checkmark,i.menuItemCheckboxClassNames.checkmark),icon:t.cn(i.menuItemClassNames.icon,i.menuItemCheckboxClassNames.icon),content:t.cn(i.menuItemClassNames.content,i.menuItemCheckboxClassNames.content),shortcut:t.cn(i.menuItemClassNames.shortcut,i.menuItemCheckboxClassNames.shortcut)}});g.displayName=`MenuItemCheckbox`;var _=e=>(0,d.jsx)(h,{...e,kind:`radio`,componentName:`Menu.ItemRadio`,rootClassName:t.cn(i.menuItemClassNames.root,i.menuItemRadioClassNames.root),partClassNames:{checkmark:t.cn(i.menuItemClassNames.checkmark,i.menuItemRadioClassNames.checkmark),icon:t.cn(i.menuItemClassNames.icon,i.menuItemRadioClassNames.icon),content:t.cn(i.menuItemClassNames.content,i.menuItemRadioClassNames.content),shortcut:t.cn(i.menuItemClassNames.shortcut,i.menuItemRadioClassNames.shortcut)}});_.displayName=`MenuItemRadio`;var v=e=>(0,d.jsx)(h,{...e,kind:`switch`,componentName:`Menu.ItemSwitch`,rootClassName:t.cn(i.menuItemClassNames.root,i.menuItemSwitchClassNames.root),partClassNames:{icon:t.cn(i.menuItemClassNames.icon,i.menuItemSwitchClassNames.icon),content:t.cn(i.menuItemClassNames.content,i.menuItemSwitchClassNames.content),shortcut:t.cn(i.menuItemClassNames.shortcut,i.menuItemSwitchClassNames.shortcut)}});v.displayName=`MenuItemSwitch`,exports.MenuItemCheckbox=g,exports.MenuItemRadio=_,exports.MenuItemSwitch=v;
 //# sourceMappingURL=Menu.selectable.cjs.map

package/dist/components/navigation/Menu.selectable.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.selectable.cjs","names":["cn","forcedColors","useMenuContext","useMenuListContext","slotRendersContent","useMenuItemActivation","renderSlot","CheckIcon","menuItemClasses","MenuItemRow","require_runtime","require_cn","require_dev","require_slot","require_styles","require_icons","require_Menu_context","require_Menu_shared","require_Menu_items","react","react_jsx_runtime","switchOnTrack","switchDisabledOnTrack","renderSwitchIndicator","checked","disabled","SelectableMenuItem","rest","menu","componentName","list","state","name","value","register","customCheckmark","checkmark","checkmarkEmpty","activation","kind","event","stringLabel","children","ownRovingText","checkColumn","className","MenuItemCheckbox","props","MenuItemRadio","MenuItemSwitch"],"sources":["../../../src/components/navigation/Menu.selectable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { warnOnce } from '../../lib/dev';\nimport { CheckIcon } from '../../lib/icons';\nimport { renderSlot, slotRendersContent } from '../../lib/slot';\nimport { forcedColors } from '../../lib/styles';\nimport type { Slot } from '../../lib/types';\nimport { useMenuContext, useMenuListContext } from './Menu.context';\nimport { menuItemClasses } from './Menu.shared';\nimport { MenuItemRow, useMenuItemActivation, useMenuItemPlacementWarning } from './Menu.items';\nimport type { MenuItemProps } from './Menu.items';\n\n/** The `checkedValues` group a checkable menu item belongs to (Fluent's `MenuItemSelectableProps`). */\nexport interface MenuItemSelectableProps {\n  /** The group: a key of the menu's `checkedValues`. Radio items with the same `name` are exclusive. */\n  name: string;\n  /** The value that is in `checkedValues[name]` while the item is checked; unique within its group. */\n  value: string;\n}\n\n/** Properties for the MenuItemCheckbox sub-component. */\nexport interface MenuItemCheckboxProps extends MenuItemProps, MenuItemSelectableProps {\n  /**\n   * Replaces the check glyph shown while the item is checked (decorative, `aria-hidden`). A\n   * checked item always shows an indicator: `null`, `undefined` and a value that renders nothing\n   * keep the default glyph (a value that renders nothing also warns in development).\n   */\n  checkmark?: Slot<'span'>;\n}\n\n/** Properties for the MenuItemRadio sub-component. */\nexport interface MenuItemRadioProps extends MenuItemProps, MenuItemSelectableProps {\n  /** As `MenuItemCheckbox.checkmark`. */\n  checkmark?: Slot<'span'>;\n}\n\n/** Properties for the MenuItemSwitch sub-component. */\nexport interface MenuItemSwitchProps extends MenuItemProps, MenuItemSelectableProps {}\n\ntype SelectableKind = 'checkbox' | 'radio' | 'switch';\n\ninterface SelectableMenuItemProps extends MenuItemCheckboxProps {\n  /** Which item: the role, the state change (toggle or select) and the indicator. */\n  kind: SelectableKind;\n  /** The part's name in diagnostics (`Menu.ItemCheckbox`). */\n  componentName: string;\n}\n\n/*\n * The switch indicator: Switch's tokens and forced-colors recipe (Switch exports no class maps), at\n * 32x16px with a 10px thumb. Sized in px like Switch, so the thumb offsets fit at any root font\n * size: the 1px border leaves a 30px inner track, so the thumb sits 2px from either end. Only the\n * thumb (the leaf indicator) opts out of forced colors; a disabled switch draws GrayText on Canvas.\n */\nconst switchOnTrack = 'forced-colors:border-[Highlight] forced-colors:bg-[Highlight]';\nconst switchDisabledOnTrack = 'forced-colors:border-[GrayText] forced-colors:bg-[Canvas]';\n\nfunction renderSwitchIndicator(checked: boolean, disabled: boolean): React.ReactElement {\n  return (\n    <span\n      aria-hidden=\"true\"\n      data-menu-switch=\"\"\n      className={cn(\n        'relative inline-flex h-[16px] w-[32px] shrink-0 items-center rounded-full border transition-colors duration-200 motion-reduce:transition-none',\n        checked\n          ? cn('border-primary bg-primary', disabled ? switchDisabledOnTrack : switchOnTrack)\n          : cn(\n              'border-stroke-accessible bg-transparent',\n              disabled ? forcedColors.disabled : forcedColors.control,\n            ),\n      )}\n    >\n      <span\n        className={cn(\n          'block h-[10px] w-[10px] rounded-full transition-transform duration-200 motion-reduce:transition-none forced-colors:forced-color-adjust-none',\n          checked\n            ? 'translate-x-[18px] wave-rtl:-translate-x-[18px] bg-primary-foreground'\n            : 'translate-x-[2px] wave-rtl:-translate-x-[2px] bg-stroke-accessible',\n          disabled\n            ? 'forced-colors:bg-[GrayText]'\n            : checked\n              ? 'forced-colors:bg-[HighlightText]'\n              : 'forced-colors:bg-[ButtonText]',\n        )}\n      />\n    </span>\n  );\n}\n\n/**\n * The three checkable item kinds: a `menuitemcheckbox` or `menuitemradio` row bound to the menu's\n * `checkedValues[name]` by `value`. Activation (a click, Enter or Space) toggles the value\n * (checkbox, switch) or makes it the group's only value (radio); Space keeps the menu open.\n */\nfunction SelectableMenuItem({\n  kind,\n  componentName,\n  name,\n  value,\n  checkmark,\n  icon,\n  shortcut,\n  disabled = false,\n  persistOnClick,\n  onClick,\n  onKeyDown,\n  children,\n  className,\n  ref,\n  ...rest\n}: SelectableMenuItemProps) {\n  const menu = useMenuContext(componentName);\n  const list = useMenuListContext();\n  useMenuItemPlacementWarning(componentName);\n  // The state of the menu that renders the list the item is in (a submenu's own or shared state).\n  const state = (list?.menu ?? menu).checked;\n  const checked = state.isChecked(name, value);\n\n  // Development only: a second item with the same name and value in one list warns.\n  const register = list?.registerCheckable;\n  React.useEffect(() => register?.(name, value), [register, name, value]);\n\n  // A checked item always shows an indicator: a `checkmark` that renders nothing keeps the glyph.\n  const customCheckmark = checkmark != null && slotRendersContent(checkmark);\n  const checkmarkEmpty = checkmark != null && !customCheckmark;\n  React.useEffect(() => {\n    if (!checkmarkEmpty) return;\n    warnOnce(\n      `${componentName}:checkmark-empty`,\n      `${componentName}: \\`checkmark\\` renders nothing, so the item shows the default check glyph. A checked item always shows an indicator: pass an icon, or leave \\`checkmark\\` unset.`,\n    );\n  }, [checkmarkEmpty, componentName]);\n\n  const activation = useMenuItemActivation({\n    disabled,\n    persistOnClick,\n    onClick,\n    onKeyDown,\n    keepOpenOnSpace: true,\n    onActivate: (event) => {\n      if (kind === 'radio') state.select(name, value, event.nativeEvent);\n      else state.toggle(name, value, event.nativeEvent);\n    },\n  });\n\n  // Typeahead text: a string label directly; any other label through its marked element.\n  const stringLabel = typeof children === 'string' ? children : undefined;\n  const ownRovingText = (rest as Record<string, unknown>)['data-roving-text'] !== undefined;\n\n  // The check column (checkbox and radio): the glyph while checked, empty while not. A switch item\n  // has no check column of its own (it keeps the placeholder) and draws the switch at the end.\n  let checkColumn: React.ReactNode = undefined;\n  if (kind !== 'switch') {\n    checkColumn = !checked ? null : customCheckmark ? (\n      renderSlot(checkmark, 'span', 'inline-flex shrink-0 items-center justify-center', {\n        'aria-hidden': true,\n      })\n    ) : (\n      <CheckIcon size={16} />\n    );\n  }\n\n  return (\n    <div\n      role={kind === 'radio' ? 'menuitemradio' : 'menuitemcheckbox'}\n      data-roving-text={stringLabel}\n      {...rest}\n      ref={ref}\n      aria-checked={checked}\n      data-checked={checked ? '' : undefined}\n      aria-disabled={disabled ? true : rest['aria-disabled']}\n      data-disabled={disabled ? '' : undefined}\n      onClick={activation.onClick}\n      onKeyDown={activation.onKeyDown}\n      className={cn(menuItemClasses, className)}\n    >\n      <MenuItemRow\n        checkmark={checkColumn}\n        icon={icon}\n        label={children}\n        shortcut={shortcut}\n        markLabel={!ownRovingText}\n        end={kind === 'switch' ? renderSwitchIndicator(checked, disabled) : undefined}\n      />\n    </div>\n  );\n}\nSelectableMenuItem.displayName = 'SelectableMenuItem';\n\n/**\n * A menu item that is checked or not (`role=\"menuitemcheckbox\"`, `aria-checked`), bound to the\n * menu's `checkedValues[name]` by `value`. A click and Enter toggle it and close a popup menu\n * (unless `persistOnClick`, or the Menu's `persistOnItemClick`); Space toggles it and keeps the\n * menu open. A check shows while it is checked, and the menu reserves the check column for all its\n * items. Works in static and popup menus. `data-checked` is set while it is checked; a consumer\n * `aria-checked` never overrides the state. Disabled items show their state and never change it.\n * Must be used within Menu.\n *\n * Also exported as `MenuItemCheckbox` (import the flat name from React Server Components).\n */\nexport const MenuItemCheckbox = (props: MenuItemCheckboxProps) => (\n  <SelectableMenuItem {...props} kind=\"checkbox\" componentName=\"Menu.ItemCheckbox\" />\n);\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n\n/**\n * A menu item that is one choice of a group (`role=\"menuitemradio\"`, `aria-checked`), bound to the\n * menu's `checkedValues[name]` by `value`: checking it unchecks the other radio items of its\n * `name`; activating a checked radio item changes nothing (no `onCheckedValuesChange`). A click and\n * Enter check it and close a popup menu (unless `persistOnClick`, or the Menu's\n * `persistOnItemClick`); Space checks it and keeps the menu open. A check shows while it is\n * checked. Works in static and popup menus. Must be used within Menu.\n *\n * Put the radio items of one `name` in a `Menu.Group` (at least separate two sets with a\n * `Menu.Divider`): assistive technology counts a radio set by its group or separators, not by\n * `name`, so two sets side by side are announced as one.\n *\n * Also exported as `MenuItemRadio` (import the flat name from React Server Components).\n */\nexport const MenuItemRadio = (props: MenuItemRadioProps) => (\n  <SelectableMenuItem {...props} kind=\"radio\" componentName=\"Menu.ItemRadio\" />\n);\nMenuItemRadio.displayName = 'MenuItemRadio';\n\n/**\n * A checkbox item drawn as a switch at the end of the row (`role=\"menuitemcheckbox\"`,\n * `aria-checked`), bound to the menu's `checkedValues[name]` by `value`. A click and Enter toggle\n * it and close a popup menu (unless `persistOnClick`, or the Menu's `persistOnItemClick`); Space\n * toggles it and keeps the menu open. The switch is decorative (`aria-hidden`). Works in static and\n * popup menus. Must be used within Menu.\n *\n * Also exported as `MenuItemSwitch` (import the flat name from React Server Components).\n */\nexport const MenuItemSwitch = (props: MenuItemSwitchProps) => (\n  <SelectableMenuItem {...props} kind=\"switch\" componentName=\"Menu.ItemSwitch\" />\n);\nMenuItemSwitch.displayName = 'MenuItemSwitch';\n"],"mappings":"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"}
+{"version":3,"file":"Menu.selectable.cjs","names":["cn","menuItemSwitchClassNames","forcedColors","useMenuContext","useMenuListContext","slotRendersContent","useMenuItemActivation","renderSlot","CheckIcon","menuItemClasses","MenuItemRow","menuItemClassNames","menuItemCheckboxClassNames","menuItemRadioClassNames","require_runtime","require_cn","require_dev","require_slot","require_classNames","require_styles","require_icons","require_Menu_context","require_Menu_shared","require_Menu_items","react","react_jsx_runtime","switchOnTrack","switchDisabledOnTrack","renderSwitchIndicator","checked","disabled","SelectableMenuItem","rest","menu","componentName","list","state","name","value","register","customCheckmark","checkmark","checkmarkEmpty","activation","kind","event","stringLabel","children","ownRovingText","checkColumn","rootClassName","className","MenuItemCheckbox","props","MenuItemRadio","MenuItemSwitch"],"sources":["../../../src/components/navigation/Menu.selectable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport {\n  menuItemCheckboxClassNames,\n  menuItemClassNames,\n  menuItemRadioClassNames,\n  menuItemSwitchClassNames,\n} from '../../lib/classNames';\nimport { warnOnce } from '../../lib/dev';\nimport { CheckIcon } from '../../lib/icons';\nimport { renderSlot, slotRendersContent } from '../../lib/slot';\nimport { forcedColors } from '../../lib/styles';\nimport type { Slot } from '../../lib/types';\nimport { useMenuContext, useMenuListContext } from './Menu.context';\nimport { menuItemClasses } from './Menu.shared';\nimport { MenuItemRow, useMenuItemActivation, useMenuItemPlacementWarning } from './Menu.items';\nimport type { MenuItemProps, MenuItemRowPartClassNames } from './Menu.items';\n\n/** The `checkedValues` group a checkable menu item belongs to (Fluent's `MenuItemSelectableProps`). */\nexport interface MenuItemSelectableProps {\n  /** The group: a key of the menu's `checkedValues`. Radio items with the same `name` are exclusive. */\n  name: string;\n  /** The value that is in `checkedValues[name]` while the item is checked; unique within its group. */\n  value: string;\n}\n\n/** Properties for the MenuItemCheckbox sub-component. */\nexport interface MenuItemCheckboxProps extends MenuItemProps, MenuItemSelectableProps {\n  /**\n   * Replaces the check glyph shown while the item is checked (decorative, `aria-hidden`). A\n   * checked item always shows an indicator: `null`, `undefined` and a value that renders nothing\n   * keep the default glyph (a value that renders nothing also warns in development).\n   */\n  checkmark?: Slot<'span'>;\n}\n\n/** Properties for the MenuItemRadio sub-component. */\nexport interface MenuItemRadioProps extends MenuItemProps, MenuItemSelectableProps {\n  /** As `MenuItemCheckbox.checkmark`. */\n  checkmark?: Slot<'span'>;\n}\n\n/** Properties for the MenuItemSwitch sub-component. */\nexport interface MenuItemSwitchProps extends MenuItemProps, MenuItemSelectableProps {}\n\ntype SelectableKind = 'checkbox' | 'radio' | 'switch';\n\ninterface SelectableMenuItemProps extends MenuItemCheckboxProps {\n  /** Which item: the role, the state change (toggle or select) and the indicator. */\n  kind: SelectableKind;\n  /** The part's name in diagnostics (`Menu.ItemCheckbox`). */\n  componentName: string;\n  /** The item element's stable classes: the base item's and the kind's own. */\n  rootClassName: string;\n  /** The row parts' stable classes (the base item's and the kind's own). */\n  partClassNames: MenuItemRowPartClassNames;\n}\n\n/*\n * The switch indicator: Switch's tokens and forced-colors recipe (Switch exports no class maps), at\n * 32x16px with a 10px thumb. Sized in px like Switch, so the thumb offsets fit at any root font\n * size: the 1px border leaves a 30px inner track, so the thumb sits 2px from either end. Only the\n * thumb (the leaf indicator) opts out of forced colors; a disabled switch draws GrayText on Canvas.\n */\nconst switchOnTrack = 'forced-colors:border-[Highlight] forced-colors:bg-[Highlight]';\nconst switchDisabledOnTrack = 'forced-colors:border-[GrayText] forced-colors:bg-[Canvas]';\n\nfunction renderSwitchIndicator(checked: boolean, disabled: boolean): React.ReactElement {\n  return (\n    <span\n      aria-hidden=\"true\"\n      data-menu-switch=\"\"\n      className={cn(\n        menuItemSwitchClassNames.track,\n        'relative inline-flex h-[16px] w-[32px] shrink-0 items-center rounded-full border transition-colors duration-200 motion-reduce:transition-none',\n        checked\n          ? cn('border-primary bg-primary', disabled ? switchDisabledOnTrack : switchOnTrack)\n          : cn(\n              'border-stroke-accessible bg-transparent',\n              disabled ? forcedColors.disabled : forcedColors.control,\n            ),\n      )}\n    >\n      <span\n        className={cn(\n          menuItemSwitchClassNames.thumb,\n          'block h-[10px] w-[10px] rounded-full transition-transform duration-200 motion-reduce:transition-none forced-colors:forced-color-adjust-none',\n          checked\n            ? 'translate-x-[18px] wave-rtl:-translate-x-[18px] bg-primary-foreground'\n            : 'translate-x-[2px] wave-rtl:-translate-x-[2px] bg-stroke-accessible',\n          disabled\n            ? 'forced-colors:bg-[GrayText]'\n            : checked\n              ? 'forced-colors:bg-[HighlightText]'\n              : 'forced-colors:bg-[ButtonText]',\n        )}\n      />\n    </span>\n  );\n}\n\n/**\n * The three checkable item kinds: a `menuitemcheckbox` or `menuitemradio` row bound to the menu's\n * `checkedValues[name]` by `value`. Activation (a click, Enter or Space) toggles the value\n * (checkbox, switch) or makes it the group's only value (radio); Space keeps the menu open.\n */\nfunction SelectableMenuItem({\n  kind,\n  componentName,\n  rootClassName,\n  partClassNames,\n  name,\n  value,\n  checkmark,\n  icon,\n  shortcut,\n  disabled = false,\n  persistOnClick,\n  onClick,\n  onKeyDown,\n  children,\n  className,\n  ref,\n  ...rest\n}: SelectableMenuItemProps) {\n  const menu = useMenuContext(componentName);\n  const list = useMenuListContext();\n  useMenuItemPlacementWarning(componentName);\n  // The state of the menu that renders the list the item is in (a submenu's own or shared state).\n  const state = (list?.menu ?? menu).checked;\n  const checked = state.isChecked(name, value);\n\n  // Development only: a second item with the same name and value in one list warns.\n  const register = list?.registerCheckable;\n  React.useEffect(() => register?.(name, value), [register, name, value]);\n\n  // A checked item always shows an indicator: a `checkmark` that renders nothing keeps the glyph.\n  const customCheckmark = checkmark != null && slotRendersContent(checkmark);\n  const checkmarkEmpty = checkmark != null && !customCheckmark;\n  React.useEffect(() => {\n    if (!checkmarkEmpty) return;\n    warnOnce(\n      `${componentName}:checkmark-empty`,\n      `${componentName}: \\`checkmark\\` renders nothing, so the item shows the default check glyph. A checked item always shows an indicator: pass an icon, or leave \\`checkmark\\` unset.`,\n    );\n  }, [checkmarkEmpty, componentName]);\n\n  const activation = useMenuItemActivation({\n    disabled,\n    persistOnClick,\n    onClick,\n    onKeyDown,\n    keepOpenOnSpace: true,\n    onActivate: (event) => {\n      if (kind === 'radio') state.select(name, value, event.nativeEvent);\n      else state.toggle(name, value, event.nativeEvent);\n    },\n  });\n\n  // Typeahead text: a string label directly; any other label through its marked element.\n  const stringLabel = typeof children === 'string' ? children : undefined;\n  const ownRovingText = (rest as Record<string, unknown>)['data-roving-text'] !== undefined;\n\n  // The check column (checkbox and radio): the glyph while checked, empty while not. A switch item\n  // has no check column of its own (it keeps the placeholder) and draws the switch at the end.\n  let checkColumn: React.ReactNode = undefined;\n  if (kind !== 'switch') {\n    checkColumn = !checked ? null : customCheckmark ? (\n      renderSlot(checkmark, 'span', 'inline-flex shrink-0 items-center justify-center', {\n        'aria-hidden': true,\n      })\n    ) : (\n      <CheckIcon size={16} />\n    );\n  }\n\n  return (\n    <div\n      role={kind === 'radio' ? 'menuitemradio' : 'menuitemcheckbox'}\n      data-roving-text={stringLabel}\n      {...rest}\n      ref={ref}\n      aria-checked={checked}\n      data-checked={checked ? '' : undefined}\n      aria-disabled={disabled ? true : rest['aria-disabled']}\n      data-disabled={disabled ? '' : undefined}\n      onClick={activation.onClick}\n      onKeyDown={activation.onKeyDown}\n      className={cn(rootClassName, menuItemClasses, className)}\n    >\n      <MenuItemRow\n        checkmark={checkColumn}\n        icon={icon}\n        label={children}\n        shortcut={shortcut}\n        markLabel={!ownRovingText}\n        partClassNames={partClassNames}\n        end={kind === 'switch' ? renderSwitchIndicator(checked, disabled) : undefined}\n      />\n    </div>\n  );\n}\nSelectableMenuItem.displayName = 'SelectableMenuItem';\n\n/**\n * A menu item that is checked or not (`role=\"menuitemcheckbox\"`, `aria-checked`), bound to the\n * menu's `checkedValues[name]` by `value`. A click and Enter toggle it and close a popup menu\n * (unless `persistOnClick`, or the Menu's `persistOnItemClick`); Space toggles it and keeps the\n * menu open. A check shows while it is checked, and the menu reserves the check column for all its\n * items. Works in static and popup menus. `data-checked` is set while it is checked; a consumer\n * `aria-checked` never overrides the state. Disabled items show their state and never change it.\n * Must be used within Menu.\n *\n * Also exported as `MenuItemCheckbox` (import the flat name from React Server Components).\n */\nexport const MenuItemCheckbox = (props: MenuItemCheckboxProps) => (\n  <SelectableMenuItem\n    {...props}\n    kind=\"checkbox\"\n    componentName=\"Menu.ItemCheckbox\"\n    rootClassName={cn(menuItemClassNames.root, menuItemCheckboxClassNames.root)}\n    partClassNames={{\n      checkmark: cn(menuItemClassNames.checkmark, menuItemCheckboxClassNames.checkmark),\n      icon: cn(menuItemClassNames.icon, menuItemCheckboxClassNames.icon),\n      content: cn(menuItemClassNames.content, menuItemCheckboxClassNames.content),\n      shortcut: cn(menuItemClassNames.shortcut, menuItemCheckboxClassNames.shortcut),\n    }}\n  />\n);\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n\n/**\n * A menu item that is one choice of a group (`role=\"menuitemradio\"`, `aria-checked`), bound to the\n * menu's `checkedValues[name]` by `value`: checking it unchecks the other radio items of its\n * `name`; activating a checked radio item changes nothing (no `onCheckedValuesChange`). A click and\n * Enter check it and close a popup menu (unless `persistOnClick`, or the Menu's\n * `persistOnItemClick`); Space checks it and keeps the menu open. A check shows while it is\n * checked. Works in static and popup menus. Must be used within Menu.\n *\n * Put the radio items of one `name` in a `Menu.Group` (at least separate two sets with a\n * `Menu.Divider`): assistive technology counts a radio set by its group or separators, not by\n * `name`, so two sets side by side are announced as one.\n *\n * Also exported as `MenuItemRadio` (import the flat name from React Server Components).\n */\nexport const MenuItemRadio = (props: MenuItemRadioProps) => (\n  <SelectableMenuItem\n    {...props}\n    kind=\"radio\"\n    componentName=\"Menu.ItemRadio\"\n    rootClassName={cn(menuItemClassNames.root, menuItemRadioClassNames.root)}\n    partClassNames={{\n      checkmark: cn(menuItemClassNames.checkmark, menuItemRadioClassNames.checkmark),\n      icon: cn(menuItemClassNames.icon, menuItemRadioClassNames.icon),\n      content: cn(menuItemClassNames.content, menuItemRadioClassNames.content),\n      shortcut: cn(menuItemClassNames.shortcut, menuItemRadioClassNames.shortcut),\n    }}\n  />\n);\nMenuItemRadio.displayName = 'MenuItemRadio';\n\n/**\n * A checkbox item drawn as a switch at the end of the row (`role=\"menuitemcheckbox\"`,\n * `aria-checked`), bound to the menu's `checkedValues[name]` by `value`. A click and Enter toggle\n * it and close a popup menu (unless `persistOnClick`, or the Menu's `persistOnItemClick`); Space\n * toggles it and keeps the menu open. The switch is decorative (`aria-hidden`). Works in static and\n * popup menus. Must be used within Menu.\n *\n * Also exported as `MenuItemSwitch` (import the flat name from React Server Components).\n */\nexport const MenuItemSwitch = (props: MenuItemSwitchProps) => (\n  <SelectableMenuItem\n    {...props}\n    kind=\"switch\"\n    componentName=\"Menu.ItemSwitch\"\n    rootClassName={cn(menuItemClassNames.root, menuItemSwitchClassNames.root)}\n    partClassNames={{\n      icon: cn(menuItemClassNames.icon, menuItemSwitchClassNames.icon),\n      content: cn(menuItemClassNames.content, menuItemSwitchClassNames.content),\n      shortcut: cn(menuItemClassNames.shortcut, menuItemSwitchClassNames.shortcut),\n    }}\n  />\n);\nMenuItemSwitch.displayName = 'MenuItemSwitch';\n"],"mappings":"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"}

package/dist/components/navigation/Menu.selectable.mjs

@@ -2,88 +2,110 @@
 import { cn as e } from "../../lib/cn.mjs";
 import { warnOnce as t } from "../../lib/dev.mjs";
 import { renderSlot as n, slotRendersContent as r } from "../../lib/slot.mjs";
-import { forcedColors as i } from "../../lib/styles.mjs";
-import { CheckIcon as a } from "../../lib/icons.mjs";
-import { useMenuContext as o, useMenuListContext as s } from "./Menu.context.mjs";
-import { menuItemClasses as c } from "./Menu.shared.mjs";
-import { MenuItemRow as l, useMenuItemActivation as u, useMenuItemPlacementWarning as d } from "./Menu.items.mjs";
-import * as f from "react";
-import { jsx as p } from "react/jsx-runtime";
+import { menuItemCheckboxClassNames as i, menuItemClassNames as a, menuItemRadioClassNames as o, menuItemSwitchClassNames as s } from "../../lib/classNames.mjs";
+import { forcedColors as c } from "../../lib/styles.mjs";
+import { CheckIcon as l } from "../../lib/icons.mjs";
+import { useMenuContext as u, useMenuListContext as d } from "./Menu.context.mjs";
+import { menuItemClasses as f } from "./Menu.shared.mjs";
+import { MenuItemRow as p, useMenuItemActivation as m, useMenuItemPlacementWarning as h } from "./Menu.items.mjs";
+import * as g from "react";
+import { jsx as _ } from "react/jsx-runtime";
 //#region src/components/navigation/Menu.selectable.tsx
-var m = "forced-colors:border-[Highlight] forced-colors:bg-[Highlight]", h = "forced-colors:border-[GrayText] forced-colors:bg-[Canvas]";
-function g(t, n) {
-	return /* @__PURE__ */ p("span", {
+var v = "forced-colors:border-[Highlight] forced-colors:bg-[Highlight]", y = "forced-colors:border-[GrayText] forced-colors:bg-[Canvas]";
+function b(t, n) {
+	return /* @__PURE__ */ _("span", {
 		"aria-hidden": "true",
 		"data-menu-switch": "",
-		className: e("relative inline-flex h-[16px] w-[32px] shrink-0 items-center rounded-full border transition-colors duration-200 motion-reduce:transition-none", t ? e("border-primary bg-primary", n ? h : m) : e("border-stroke-accessible bg-transparent", n ? i.disabled : i.control)),
-		children: /* @__PURE__ */ p("span", { className: e("block h-[10px] w-[10px] rounded-full transition-transform duration-200 motion-reduce:transition-none forced-colors:forced-color-adjust-none", t ? "translate-x-[18px] wave-rtl:-translate-x-[18px] bg-primary-foreground" : "translate-x-[2px] wave-rtl:-translate-x-[2px] bg-stroke-accessible", n ? "forced-colors:bg-[GrayText]" : t ? "forced-colors:bg-[HighlightText]" : "forced-colors:bg-[ButtonText]") })
+		className: e(s.track, "relative inline-flex h-[16px] w-[32px] shrink-0 items-center rounded-full border transition-colors duration-200 motion-reduce:transition-none", t ? e("border-primary bg-primary", n ? y : v) : e("border-stroke-accessible bg-transparent", n ? c.disabled : c.control)),
+		children: /* @__PURE__ */ _("span", { className: e(s.thumb, "block h-[10px] w-[10px] rounded-full transition-transform duration-200 motion-reduce:transition-none forced-colors:forced-color-adjust-none", t ? "translate-x-[18px] wave-rtl:-translate-x-[18px] bg-primary-foreground" : "translate-x-[2px] wave-rtl:-translate-x-[2px] bg-stroke-accessible", n ? "forced-colors:bg-[GrayText]" : t ? "forced-colors:bg-[HighlightText]" : "forced-colors:bg-[ButtonText]") })
 	});
 }
-function _({ kind: i, componentName: m, name: h, value: _, checkmark: v, icon: y, shortcut: b, disabled: x = !1, persistOnClick: S, onClick: C, onKeyDown: w, children: T, className: E, ref: D, ...O }) {
-	let k = o(m), A = s();
-	d(m);
-	let j = (A?.menu ?? k).checked, M = j.isChecked(h, _), N = A?.registerCheckable;
-	f.useEffect(() => N?.(h, _), [
-		N,
-		h,
-		_
+function x({ kind: i, componentName: a, rootClassName: o, partClassNames: s, name: c, value: v, checkmark: y, icon: x, shortcut: S, disabled: C = !1, persistOnClick: w, onClick: T, onKeyDown: E, children: D, className: O, ref: k, ...A }) {
+	let j = u(a), M = d();
+	h(a);
+	let N = (M?.menu ?? j).checked, P = N.isChecked(c, v), F = M?.registerCheckable;
+	g.useEffect(() => F?.(c, v), [
+		F,
+		c,
+		v
 	]);
-	let P = v != null && r(v), F = v != null && !P;
-	f.useEffect(() => {
-		F && t(`${m}:checkmark-empty`, `${m}: \`checkmark\` renders nothing, so the item shows the default check glyph. A checked item always shows an indicator: pass an icon, or leave \`checkmark\` unset.`);
-	}, [F, m]);
-	let I = u({
-		disabled: x,
-		persistOnClick: S,
-		onClick: C,
-		onKeyDown: w,
+	let I = y != null && r(y), L = y != null && !I;
+	g.useEffect(() => {
+		L && t(`${a}:checkmark-empty`, `${a}: \`checkmark\` renders nothing, so the item shows the default check glyph. A checked item always shows an indicator: pass an icon, or leave \`checkmark\` unset.`);
+	}, [L, a]);
+	let R = m({
+		disabled: C,
+		persistOnClick: w,
+		onClick: T,
+		onKeyDown: E,
 		keepOpenOnSpace: !0,
 		onActivate: (e) => {
-			i === "radio" ? j.select(h, _, e.nativeEvent) : j.toggle(h, _, e.nativeEvent);
+			i === "radio" ? N.select(c, v, e.nativeEvent) : N.toggle(c, v, e.nativeEvent);
 		}
-	}), L = typeof T == "string" ? T : void 0, R = O["data-roving-text"] !== void 0, z;
-	return i !== "switch" && (z = M ? P ? n(v, "span", "inline-flex shrink-0 items-center justify-center", { "aria-hidden": !0 }) : /* @__PURE__ */ p(a, { size: 16 }) : null), /* @__PURE__ */ p("div", {
+	}), z = typeof D == "string" ? D : void 0, B = A["data-roving-text"] !== void 0, V;
+	return i !== "switch" && (V = P ? I ? n(y, "span", "inline-flex shrink-0 items-center justify-center", { "aria-hidden": !0 }) : /* @__PURE__ */ _(l, { size: 16 }) : null), /* @__PURE__ */ _("div", {
 		role: i === "radio" ? "menuitemradio" : "menuitemcheckbox",
-		"data-roving-text": L,
-		...O,
-		ref: D,
-		"aria-checked": M,
-		"data-checked": M ? "" : void 0,
-		"aria-disabled": x ? !0 : O["aria-disabled"],
-		"data-disabled": x ? "" : void 0,
-		onClick: I.onClick,
-		onKeyDown: I.onKeyDown,
-		className: e(c, E),
-		children: /* @__PURE__ */ p(l, {
-			checkmark: z,
-			icon: y,
-			label: T,
-			shortcut: b,
-			markLabel: !R,
-			end: i === "switch" ? g(M, x) : void 0
+		"data-roving-text": z,
+		...A,
+		ref: k,
+		"aria-checked": P,
+		"data-checked": P ? "" : void 0,
+		"aria-disabled": C ? !0 : A["aria-disabled"],
+		"data-disabled": C ? "" : void 0,
+		onClick: R.onClick,
+		onKeyDown: R.onKeyDown,
+		className: e(o, f, O),
+		children: /* @__PURE__ */ _(p, {
+			checkmark: V,
+			icon: x,
+			label: D,
+			shortcut: S,
+			markLabel: !B,
+			partClassNames: s,
+			end: i === "switch" ? b(P, C) : void 0
 		})
 	});
 }
-_.displayName = "SelectableMenuItem";
-var v = (e) => /* @__PURE__ */ p(_, {
-	...e,
+x.displayName = "SelectableMenuItem";
+var S = (t) => /* @__PURE__ */ _(x, {
+	...t,
 	kind: "checkbox",
-	componentName: "Menu.ItemCheckbox"
+	componentName: "Menu.ItemCheckbox",
+	rootClassName: e(a.root, i.root),
+	partClassNames: {
+		checkmark: e(a.checkmark, i.checkmark),
+		icon: e(a.icon, i.icon),
+		content: e(a.content, i.content),
+		shortcut: e(a.shortcut, i.shortcut)
+	}
 });
-v.displayName = "MenuItemCheckbox";
-var y = (e) => /* @__PURE__ */ p(_, {
-	...e,
+S.displayName = "MenuItemCheckbox";
+var C = (t) => /* @__PURE__ */ _(x, {
+	...t,
 	kind: "radio",
-	componentName: "Menu.ItemRadio"
+	componentName: "Menu.ItemRadio",
+	rootClassName: e(a.root, o.root),
+	partClassNames: {
+		checkmark: e(a.checkmark, o.checkmark),
+		icon: e(a.icon, o.icon),
+		content: e(a.content, o.content),
+		shortcut: e(a.shortcut, o.shortcut)
+	}
 });
-y.displayName = "MenuItemRadio";
-var b = (e) => /* @__PURE__ */ p(_, {
-	...e,
+C.displayName = "MenuItemRadio";
+var w = (t) => /* @__PURE__ */ _(x, {
+	...t,
 	kind: "switch",
-	componentName: "Menu.ItemSwitch"
+	componentName: "Menu.ItemSwitch",
+	rootClassName: e(a.root, s.root),
+	partClassNames: {
+		icon: e(a.icon, s.icon),
+		content: e(a.content, s.content),
+		shortcut: e(a.shortcut, s.shortcut)
+	}
 });
-b.displayName = "MenuItemSwitch";
+w.displayName = "MenuItemSwitch";
 //#endregion
-export { v as MenuItemCheckbox, y as MenuItemRadio, b as MenuItemSwitch };
+export { S as MenuItemCheckbox, C as MenuItemRadio, w as MenuItemSwitch };
 
 //# sourceMappingURL=Menu.selectable.mjs.map

package/dist/components/navigation/Menu.selectable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.selectable.mjs","names":["React","switchOnTrack","switchDisabledOnTrack","renderSwitchIndicator","cn","checked","disabled","forcedColors","SelectableMenuItem","rest","menu","useMenuContext","componentName","list","useMenuListContext","state","name","value","register","customCheckmark","checkmark","slotRendersContent","checkmarkEmpty","warnOnce","activation","useMenuItemActivation","kind","event","stringLabel","children","ownRovingText","checkColumn","renderSlot","CheckIcon","menuItemClasses","className","MenuItemRow","MenuItemCheckbox","props","MenuItemRadio","MenuItemSwitch"],"sources":["../../../src/components/navigation/Menu.selectable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { warnOnce } from '../../lib/dev';\nimport { CheckIcon } from '../../lib/icons';\nimport { renderSlot, slotRendersContent } from '../../lib/slot';\nimport { forcedColors } from '../../lib/styles';\nimport type { Slot } from '../../lib/types';\nimport { useMenuContext, useMenuListContext } from './Menu.context';\nimport { menuItemClasses } from './Menu.shared';\nimport { MenuItemRow, useMenuItemActivation, useMenuItemPlacementWarning } from './Menu.items';\nimport type { MenuItemProps } from './Menu.items';\n\n/** The `checkedValues` group a checkable menu item belongs to (Fluent's `MenuItemSelectableProps`). */\nexport interface MenuItemSelectableProps {\n  /** The group: a key of the menu's `checkedValues`. Radio items with the same `name` are exclusive. */\n  name: string;\n  /** The value that is in `checkedValues[name]` while the item is checked; unique within its group. */\n  value: string;\n}\n\n/** Properties for the MenuItemCheckbox sub-component. */\nexport interface MenuItemCheckboxProps extends MenuItemProps, MenuItemSelectableProps {\n  /**\n   * Replaces the check glyph shown while the item is checked (decorative, `aria-hidden`). A\n   * checked item always shows an indicator: `null`, `undefined` and a value that renders nothing\n   * keep the default glyph (a value that renders nothing also warns in development).\n   */\n  checkmark?: Slot<'span'>;\n}\n\n/** Properties for the MenuItemRadio sub-component. */\nexport interface MenuItemRadioProps extends MenuItemProps, MenuItemSelectableProps {\n  /** As `MenuItemCheckbox.checkmark`. */\n  checkmark?: Slot<'span'>;\n}\n\n/** Properties for the MenuItemSwitch sub-component. */\nexport interface MenuItemSwitchProps extends MenuItemProps, MenuItemSelectableProps {}\n\ntype SelectableKind = 'checkbox' | 'radio' | 'switch';\n\ninterface SelectableMenuItemProps extends MenuItemCheckboxProps {\n  /** Which item: the role, the state change (toggle or select) and the indicator. */\n  kind: SelectableKind;\n  /** The part's name in diagnostics (`Menu.ItemCheckbox`). */\n  componentName: string;\n}\n\n/*\n * The switch indicator: Switch's tokens and forced-colors recipe (Switch exports no class maps), at\n * 32x16px with a 10px thumb. Sized in px like Switch, so the thumb offsets fit at any root font\n * size: the 1px border leaves a 30px inner track, so the thumb sits 2px from either end. Only the\n * thumb (the leaf indicator) opts out of forced colors; a disabled switch draws GrayText on Canvas.\n */\nconst switchOnTrack = 'forced-colors:border-[Highlight] forced-colors:bg-[Highlight]';\nconst switchDisabledOnTrack = 'forced-colors:border-[GrayText] forced-colors:bg-[Canvas]';\n\nfunction renderSwitchIndicator(checked: boolean, disabled: boolean): React.ReactElement {\n  return (\n    <span\n      aria-hidden=\"true\"\n      data-menu-switch=\"\"\n      className={cn(\n        'relative inline-flex h-[16px] w-[32px] shrink-0 items-center rounded-full border transition-colors duration-200 motion-reduce:transition-none',\n        checked\n          ? cn('border-primary bg-primary', disabled ? switchDisabledOnTrack : switchOnTrack)\n          : cn(\n              'border-stroke-accessible bg-transparent',\n              disabled ? forcedColors.disabled : forcedColors.control,\n            ),\n      )}\n    >\n      <span\n        className={cn(\n          'block h-[10px] w-[10px] rounded-full transition-transform duration-200 motion-reduce:transition-none forced-colors:forced-color-adjust-none',\n          checked\n            ? 'translate-x-[18px] wave-rtl:-translate-x-[18px] bg-primary-foreground'\n            : 'translate-x-[2px] wave-rtl:-translate-x-[2px] bg-stroke-accessible',\n          disabled\n            ? 'forced-colors:bg-[GrayText]'\n            : checked\n              ? 'forced-colors:bg-[HighlightText]'\n              : 'forced-colors:bg-[ButtonText]',\n        )}\n      />\n    </span>\n  );\n}\n\n/**\n * The three checkable item kinds: a `menuitemcheckbox` or `menuitemradio` row bound to the menu's\n * `checkedValues[name]` by `value`. Activation (a click, Enter or Space) toggles the value\n * (checkbox, switch) or makes it the group's only value (radio); Space keeps the menu open.\n */\nfunction SelectableMenuItem({\n  kind,\n  componentName,\n  name,\n  value,\n  checkmark,\n  icon,\n  shortcut,\n  disabled = false,\n  persistOnClick,\n  onClick,\n  onKeyDown,\n  children,\n  className,\n  ref,\n  ...rest\n}: SelectableMenuItemProps) {\n  const menu = useMenuContext(componentName);\n  const list = useMenuListContext();\n  useMenuItemPlacementWarning(componentName);\n  // The state of the menu that renders the list the item is in (a submenu's own or shared state).\n  const state = (list?.menu ?? menu).checked;\n  const checked = state.isChecked(name, value);\n\n  // Development only: a second item with the same name and value in one list warns.\n  const register = list?.registerCheckable;\n  React.useEffect(() => register?.(name, value), [register, name, value]);\n\n  // A checked item always shows an indicator: a `checkmark` that renders nothing keeps the glyph.\n  const customCheckmark = checkmark != null && slotRendersContent(checkmark);\n  const checkmarkEmpty = checkmark != null && !customCheckmark;\n  React.useEffect(() => {\n    if (!checkmarkEmpty) return;\n    warnOnce(\n      `${componentName}:checkmark-empty`,\n      `${componentName}: \\`checkmark\\` renders nothing, so the item shows the default check glyph. A checked item always shows an indicator: pass an icon, or leave \\`checkmark\\` unset.`,\n    );\n  }, [checkmarkEmpty, componentName]);\n\n  const activation = useMenuItemActivation({\n    disabled,\n    persistOnClick,\n    onClick,\n    onKeyDown,\n    keepOpenOnSpace: true,\n    onActivate: (event) => {\n      if (kind === 'radio') state.select(name, value, event.nativeEvent);\n      else state.toggle(name, value, event.nativeEvent);\n    },\n  });\n\n  // Typeahead text: a string label directly; any other label through its marked element.\n  const stringLabel = typeof children === 'string' ? children : undefined;\n  const ownRovingText = (rest as Record<string, unknown>)['data-roving-text'] !== undefined;\n\n  // The check column (checkbox and radio): the glyph while checked, empty while not. A switch item\n  // has no check column of its own (it keeps the placeholder) and draws the switch at the end.\n  let checkColumn: React.ReactNode = undefined;\n  if (kind !== 'switch') {\n    checkColumn = !checked ? null : customCheckmark ? (\n      renderSlot(checkmark, 'span', 'inline-flex shrink-0 items-center justify-center', {\n        'aria-hidden': true,\n      })\n    ) : (\n      <CheckIcon size={16} />\n    );\n  }\n\n  return (\n    <div\n      role={kind === 'radio' ? 'menuitemradio' : 'menuitemcheckbox'}\n      data-roving-text={stringLabel}\n      {...rest}\n      ref={ref}\n      aria-checked={checked}\n      data-checked={checked ? '' : undefined}\n      aria-disabled={disabled ? true : rest['aria-disabled']}\n      data-disabled={disabled ? '' : undefined}\n      onClick={activation.onClick}\n      onKeyDown={activation.onKeyDown}\n      className={cn(menuItemClasses, className)}\n    >\n      <MenuItemRow\n        checkmark={checkColumn}\n        icon={icon}\n        label={children}\n        shortcut={shortcut}\n        markLabel={!ownRovingText}\n        end={kind === 'switch' ? renderSwitchIndicator(checked, disabled) : undefined}\n      />\n    </div>\n  );\n}\nSelectableMenuItem.displayName = 'SelectableMenuItem';\n\n/**\n * A menu item that is checked or not (`role=\"menuitemcheckbox\"`, `aria-checked`), bound to the\n * menu's `checkedValues[name]` by `value`. A click and Enter toggle it and close a popup menu\n * (unless `persistOnClick`, or the Menu's `persistOnItemClick`); Space toggles it and keeps the\n * menu open. A check shows while it is checked, and the menu reserves the check column for all its\n * items. Works in static and popup menus. `data-checked` is set while it is checked; a consumer\n * `aria-checked` never overrides the state. Disabled items show their state and never change it.\n * Must be used within Menu.\n *\n * Also exported as `MenuItemCheckbox` (import the flat name from React Server Components).\n */\nexport const MenuItemCheckbox = (props: MenuItemCheckboxProps) => (\n  <SelectableMenuItem {...props} kind=\"checkbox\" componentName=\"Menu.ItemCheckbox\" />\n);\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n\n/**\n * A menu item that is one choice of a group (`role=\"menuitemradio\"`, `aria-checked`), bound to the\n * menu's `checkedValues[name]` by `value`: checking it unchecks the other radio items of its\n * `name`; activating a checked radio item changes nothing (no `onCheckedValuesChange`). A click and\n * Enter check it and close a popup menu (unless `persistOnClick`, or the Menu's\n * `persistOnItemClick`); Space checks it and keeps the menu open. A check shows while it is\n * checked. Works in static and popup menus. Must be used within Menu.\n *\n * Put the radio items of one `name` in a `Menu.Group` (at least separate two sets with a\n * `Menu.Divider`): assistive technology counts a radio set by its group or separators, not by\n * `name`, so two sets side by side are announced as one.\n *\n * Also exported as `MenuItemRadio` (import the flat name from React Server Components).\n */\nexport const MenuItemRadio = (props: MenuItemRadioProps) => (\n  <SelectableMenuItem {...props} kind=\"radio\" componentName=\"Menu.ItemRadio\" />\n);\nMenuItemRadio.displayName = 'MenuItemRadio';\n\n/**\n * A checkbox item drawn as a switch at the end of the row (`role=\"menuitemcheckbox\"`,\n * `aria-checked`), bound to the menu's `checkedValues[name]` by `value`. A click and Enter toggle\n * it and close a popup menu (unless `persistOnClick`, or the Menu's `persistOnItemClick`); Space\n * toggles it and keeps the menu open. The switch is decorative (`aria-hidden`). Works in static and\n * popup menus. Must be used within Menu.\n *\n * Also exported as `MenuItemSwitch` (import the flat name from React Server Components).\n */\nexport const MenuItemSwitch = (props: MenuItemSwitchProps) => (\n  <SelectableMenuItem {...props} kind=\"switch\" componentName=\"Menu.ItemSwitch\" />\n);\nMenuItemSwitch.displayName = 'MenuItemSwitch';\n"],"mappings":";;;;;;;;;;;;AAsDA,IAAMC,IAAgB,iEAChBC,IAAwB;AAE9B,SAASC,EAAsB,GAAkB,GAAuC;CACtF,OACE,kBAAC,QAAD;EACE,eAAY;EACZ,oBAAiB;EACjB,WAAWC,EACT,iJACAC,IACID,EAAG,6BAA6BE,IAAWJ,IAAwBD,CAAa,IAChFG,EACE,2CACAE,IAAWC,EAAa,WAAWA,EAAa,OAClD,CACN;EAEA,UAAA,kBAAC,QAAD,EACE,WAAWH,EACT,+IACAC,IACI,0EACA,sEACJC,IACI,gCACAD,IACE,qCACA,+BACR,EACD,CAAA;CACG,CAAA;AAEV;AAOA,SAASG,EAAmB,EAC1B,SACA,kBACA,SACA,UACA,cACA,SACA,aACA,cAAW,IACX,mBACA,YACA,cACA,aACA,cACA,QACA,GAAGC,KACuB;CAC1B,IAAMC,IAAOC,EAAeC,CAAa,GACnCC,IAAOC,EAAmB;CAChC,EAA4BF,CAAa;CAEzC,IAAMG,KAASF,GAAM,QAAQH,EAAA,CAAM,SAC7BL,IAAUU,EAAM,UAAUC,GAAMC,CAAK,GAGrCC,IAAWL,GAAM;CACvB,EAAM,gBAAgBK,IAAWF,GAAMC,CAAK,GAAG;EAACC;EAAUF;EAAMC;CAAK,CAAC;CAGtE,IAAME,IAAkBC,KAAa,QAAQC,EAAmBD,CAAS,GACnEE,IAAiBF,KAAa,QAAQ,CAACD;CAC7C,EAAM,gBAAgB;EACpB,AAAKG,KACLC,EACE,GAAGX,EAAc,mBACjB,GAAGA,EAAc,kKACnB;CACF,GAAG,CAACU,GAAgBV,CAAa,CAAC;CAElC,IAAMY,IAAaC,EAAsB;EACvC;EACA;EACA;EACA;EACA,iBAAiB;EACjB,aAAa,MAAU;GACrB,AAAIC,MAAS,UAASX,EAAM,OAAOC,GAAMC,GAAOU,EAAM,WAAW,IAC5DZ,EAAM,OAAOC,GAAMC,GAAOU,EAAM,WAAW;EAClD;CACF,CAAC,GAGKC,IAAc,OAAOC,KAAa,WAAWA,IAAW,KAAA,GACxDC,IAAiBrB,EAAiC,wBAAwB,KAAA,GAI5EsB;CAWJ,OAVIL,MAAS,aACX,IAAerB,IAAiBc,IAC9Ba,EAAWZ,GAAW,QAAQ,oDAAoD,EAChF,eAAe,GACjB,CAAC,IAED,kBAACa,GAAD,EAAW,MAAM,GAAK,CAAA,IALC,OAUzB,kBAAC,OAAD;EACE,MAAMP,MAAS,UAAU,kBAAkB;EAC3C,oBAAkBE;EAClB,GAAInB;EACC;EACL,gBAAcJ;EACd,gBAAcA,IAAU,KAAK,KAAA;EAC7B,iBAAeC,IAAW,KAAOG,EAAK;EACtC,iBAAeH,IAAW,KAAK,KAAA;EAC/B,SAASkB,EAAW;EACpB,WAAWA,EAAW;EACtB,WAAWpB,EAAG8B,GAAiBC,CAAS;EAExC,UAAA,kBAACC,GAAD;GACE,WAAWL;GACL;GACN,OAAOF;GACG;GACV,WAAW,CAACC;GACZ,KAAKJ,MAAS,WAAWvB,EAAsBE,GAASC,CAAQ,IAAI,KAAA;EACrE,CAAA;CACE,CAAA;AAET;AACA,EAAmB,cAAc;AAajC,IAAa+B,KAAoB,MAC/B,kBAAC7B,GAAD;CAAoB,GAAI8B;CAAO,MAAK;CAAW,eAAc;AAAqB,CAAA;AAEpF,EAAiB,cAAc;AAgB/B,IAAaC,KAAiB,MAC5B,kBAAC/B,GAAD;CAAoB,GAAI8B;CAAO,MAAK;CAAQ,eAAc;AAAkB,CAAA;AAE9E,EAAc,cAAc;AAW5B,IAAaE,KAAkB,MAC7B,kBAAChC,GAAD;CAAoB,GAAI8B;CAAO,MAAK;CAAS,eAAc;AAAmB,CAAA;AAEhF,EAAe,cAAc"}
+{"version":3,"file":"Menu.selectable.mjs","names":["React","switchOnTrack","switchDisabledOnTrack","renderSwitchIndicator","cn","menuItemSwitchClassNames","checked","disabled","forcedColors","SelectableMenuItem","rest","menu","useMenuContext","componentName","list","useMenuListContext","state","name","value","register","customCheckmark","checkmark","slotRendersContent","checkmarkEmpty","warnOnce","activation","useMenuItemActivation","kind","event","stringLabel","children","ownRovingText","checkColumn","renderSlot","CheckIcon","rootClassName","menuItemClasses","className","MenuItemRow","MenuItemCheckbox","props","menuItemClassNames","menuItemCheckboxClassNames","MenuItemRadio","menuItemRadioClassNames","MenuItemSwitch"],"sources":["../../../src/components/navigation/Menu.selectable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport {\n  menuItemCheckboxClassNames,\n  menuItemClassNames,\n  menuItemRadioClassNames,\n  menuItemSwitchClassNames,\n} from '../../lib/classNames';\nimport { warnOnce } from '../../lib/dev';\nimport { CheckIcon } from '../../lib/icons';\nimport { renderSlot, slotRendersContent } from '../../lib/slot';\nimport { forcedColors } from '../../lib/styles';\nimport type { Slot } from '../../lib/types';\nimport { useMenuContext, useMenuListContext } from './Menu.context';\nimport { menuItemClasses } from './Menu.shared';\nimport { MenuItemRow, useMenuItemActivation, useMenuItemPlacementWarning } from './Menu.items';\nimport type { MenuItemProps, MenuItemRowPartClassNames } from './Menu.items';\n\n/** The `checkedValues` group a checkable menu item belongs to (Fluent's `MenuItemSelectableProps`). */\nexport interface MenuItemSelectableProps {\n  /** The group: a key of the menu's `checkedValues`. Radio items with the same `name` are exclusive. */\n  name: string;\n  /** The value that is in `checkedValues[name]` while the item is checked; unique within its group. */\n  value: string;\n}\n\n/** Properties for the MenuItemCheckbox sub-component. */\nexport interface MenuItemCheckboxProps extends MenuItemProps, MenuItemSelectableProps {\n  /**\n   * Replaces the check glyph shown while the item is checked (decorative, `aria-hidden`). A\n   * checked item always shows an indicator: `null`, `undefined` and a value that renders nothing\n   * keep the default glyph (a value that renders nothing also warns in development).\n   */\n  checkmark?: Slot<'span'>;\n}\n\n/** Properties for the MenuItemRadio sub-component. */\nexport interface MenuItemRadioProps extends MenuItemProps, MenuItemSelectableProps {\n  /** As `MenuItemCheckbox.checkmark`. */\n  checkmark?: Slot<'span'>;\n}\n\n/** Properties for the MenuItemSwitch sub-component. */\nexport interface MenuItemSwitchProps extends MenuItemProps, MenuItemSelectableProps {}\n\ntype SelectableKind = 'checkbox' | 'radio' | 'switch';\n\ninterface SelectableMenuItemProps extends MenuItemCheckboxProps {\n  /** Which item: the role, the state change (toggle or select) and the indicator. */\n  kind: SelectableKind;\n  /** The part's name in diagnostics (`Menu.ItemCheckbox`). */\n  componentName: string;\n  /** The item element's stable classes: the base item's and the kind's own. */\n  rootClassName: string;\n  /** The row parts' stable classes (the base item's and the kind's own). */\n  partClassNames: MenuItemRowPartClassNames;\n}\n\n/*\n * The switch indicator: Switch's tokens and forced-colors recipe (Switch exports no class maps), at\n * 32x16px with a 10px thumb. Sized in px like Switch, so the thumb offsets fit at any root font\n * size: the 1px border leaves a 30px inner track, so the thumb sits 2px from either end. Only the\n * thumb (the leaf indicator) opts out of forced colors; a disabled switch draws GrayText on Canvas.\n */\nconst switchOnTrack = 'forced-colors:border-[Highlight] forced-colors:bg-[Highlight]';\nconst switchDisabledOnTrack = 'forced-colors:border-[GrayText] forced-colors:bg-[Canvas]';\n\nfunction renderSwitchIndicator(checked: boolean, disabled: boolean): React.ReactElement {\n  return (\n    <span\n      aria-hidden=\"true\"\n      data-menu-switch=\"\"\n      className={cn(\n        menuItemSwitchClassNames.track,\n        'relative inline-flex h-[16px] w-[32px] shrink-0 items-center rounded-full border transition-colors duration-200 motion-reduce:transition-none',\n        checked\n          ? cn('border-primary bg-primary', disabled ? switchDisabledOnTrack : switchOnTrack)\n          : cn(\n              'border-stroke-accessible bg-transparent',\n              disabled ? forcedColors.disabled : forcedColors.control,\n            ),\n      )}\n    >\n      <span\n        className={cn(\n          menuItemSwitchClassNames.thumb,\n          'block h-[10px] w-[10px] rounded-full transition-transform duration-200 motion-reduce:transition-none forced-colors:forced-color-adjust-none',\n          checked\n            ? 'translate-x-[18px] wave-rtl:-translate-x-[18px] bg-primary-foreground'\n            : 'translate-x-[2px] wave-rtl:-translate-x-[2px] bg-stroke-accessible',\n          disabled\n            ? 'forced-colors:bg-[GrayText]'\n            : checked\n              ? 'forced-colors:bg-[HighlightText]'\n              : 'forced-colors:bg-[ButtonText]',\n        )}\n      />\n    </span>\n  );\n}\n\n/**\n * The three checkable item kinds: a `menuitemcheckbox` or `menuitemradio` row bound to the menu's\n * `checkedValues[name]` by `value`. Activation (a click, Enter or Space) toggles the value\n * (checkbox, switch) or makes it the group's only value (radio); Space keeps the menu open.\n */\nfunction SelectableMenuItem({\n  kind,\n  componentName,\n  rootClassName,\n  partClassNames,\n  name,\n  value,\n  checkmark,\n  icon,\n  shortcut,\n  disabled = false,\n  persistOnClick,\n  onClick,\n  onKeyDown,\n  children,\n  className,\n  ref,\n  ...rest\n}: SelectableMenuItemProps) {\n  const menu = useMenuContext(componentName);\n  const list = useMenuListContext();\n  useMenuItemPlacementWarning(componentName);\n  // The state of the menu that renders the list the item is in (a submenu's own or shared state).\n  const state = (list?.menu ?? menu).checked;\n  const checked = state.isChecked(name, value);\n\n  // Development only: a second item with the same name and value in one list warns.\n  const register = list?.registerCheckable;\n  React.useEffect(() => register?.(name, value), [register, name, value]);\n\n  // A checked item always shows an indicator: a `checkmark` that renders nothing keeps the glyph.\n  const customCheckmark = checkmark != null && slotRendersContent(checkmark);\n  const checkmarkEmpty = checkmark != null && !customCheckmark;\n  React.useEffect(() => {\n    if (!checkmarkEmpty) return;\n    warnOnce(\n      `${componentName}:checkmark-empty`,\n      `${componentName}: \\`checkmark\\` renders nothing, so the item shows the default check glyph. A checked item always shows an indicator: pass an icon, or leave \\`checkmark\\` unset.`,\n    );\n  }, [checkmarkEmpty, componentName]);\n\n  const activation = useMenuItemActivation({\n    disabled,\n    persistOnClick,\n    onClick,\n    onKeyDown,\n    keepOpenOnSpace: true,\n    onActivate: (event) => {\n      if (kind === 'radio') state.select(name, value, event.nativeEvent);\n      else state.toggle(name, value, event.nativeEvent);\n    },\n  });\n\n  // Typeahead text: a string label directly; any other label through its marked element.\n  const stringLabel = typeof children === 'string' ? children : undefined;\n  const ownRovingText = (rest as Record<string, unknown>)['data-roving-text'] !== undefined;\n\n  // The check column (checkbox and radio): the glyph while checked, empty while not. A switch item\n  // has no check column of its own (it keeps the placeholder) and draws the switch at the end.\n  let checkColumn: React.ReactNode = undefined;\n  if (kind !== 'switch') {\n    checkColumn = !checked ? null : customCheckmark ? (\n      renderSlot(checkmark, 'span', 'inline-flex shrink-0 items-center justify-center', {\n        'aria-hidden': true,\n      })\n    ) : (\n      <CheckIcon size={16} />\n    );\n  }\n\n  return (\n    <div\n      role={kind === 'radio' ? 'menuitemradio' : 'menuitemcheckbox'}\n      data-roving-text={stringLabel}\n      {...rest}\n      ref={ref}\n      aria-checked={checked}\n      data-checked={checked ? '' : undefined}\n      aria-disabled={disabled ? true : rest['aria-disabled']}\n      data-disabled={disabled ? '' : undefined}\n      onClick={activation.onClick}\n      onKeyDown={activation.onKeyDown}\n      className={cn(rootClassName, menuItemClasses, className)}\n    >\n      <MenuItemRow\n        checkmark={checkColumn}\n        icon={icon}\n        label={children}\n        shortcut={shortcut}\n        markLabel={!ownRovingText}\n        partClassNames={partClassNames}\n        end={kind === 'switch' ? renderSwitchIndicator(checked, disabled) : undefined}\n      />\n    </div>\n  );\n}\nSelectableMenuItem.displayName = 'SelectableMenuItem';\n\n/**\n * A menu item that is checked or not (`role=\"menuitemcheckbox\"`, `aria-checked`), bound to the\n * menu's `checkedValues[name]` by `value`. A click and Enter toggle it and close a popup menu\n * (unless `persistOnClick`, or the Menu's `persistOnItemClick`); Space toggles it and keeps the\n * menu open. A check shows while it is checked, and the menu reserves the check column for all its\n * items. Works in static and popup menus. `data-checked` is set while it is checked; a consumer\n * `aria-checked` never overrides the state. Disabled items show their state and never change it.\n * Must be used within Menu.\n *\n * Also exported as `MenuItemCheckbox` (import the flat name from React Server Components).\n */\nexport const MenuItemCheckbox = (props: MenuItemCheckboxProps) => (\n  <SelectableMenuItem\n    {...props}\n    kind=\"checkbox\"\n    componentName=\"Menu.ItemCheckbox\"\n    rootClassName={cn(menuItemClassNames.root, menuItemCheckboxClassNames.root)}\n    partClassNames={{\n      checkmark: cn(menuItemClassNames.checkmark, menuItemCheckboxClassNames.checkmark),\n      icon: cn(menuItemClassNames.icon, menuItemCheckboxClassNames.icon),\n      content: cn(menuItemClassNames.content, menuItemCheckboxClassNames.content),\n      shortcut: cn(menuItemClassNames.shortcut, menuItemCheckboxClassNames.shortcut),\n    }}\n  />\n);\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n\n/**\n * A menu item that is one choice of a group (`role=\"menuitemradio\"`, `aria-checked`), bound to the\n * menu's `checkedValues[name]` by `value`: checking it unchecks the other radio items of its\n * `name`; activating a checked radio item changes nothing (no `onCheckedValuesChange`). A click and\n * Enter check it and close a popup menu (unless `persistOnClick`, or the Menu's\n * `persistOnItemClick`); Space checks it and keeps the menu open. A check shows while it is\n * checked. Works in static and popup menus. Must be used within Menu.\n *\n * Put the radio items of one `name` in a `Menu.Group` (at least separate two sets with a\n * `Menu.Divider`): assistive technology counts a radio set by its group or separators, not by\n * `name`, so two sets side by side are announced as one.\n *\n * Also exported as `MenuItemRadio` (import the flat name from React Server Components).\n */\nexport const MenuItemRadio = (props: MenuItemRadioProps) => (\n  <SelectableMenuItem\n    {...props}\n    kind=\"radio\"\n    componentName=\"Menu.ItemRadio\"\n    rootClassName={cn(menuItemClassNames.root, menuItemRadioClassNames.root)}\n    partClassNames={{\n      checkmark: cn(menuItemClassNames.checkmark, menuItemRadioClassNames.checkmark),\n      icon: cn(menuItemClassNames.icon, menuItemRadioClassNames.icon),\n      content: cn(menuItemClassNames.content, menuItemRadioClassNames.content),\n      shortcut: cn(menuItemClassNames.shortcut, menuItemRadioClassNames.shortcut),\n    }}\n  />\n);\nMenuItemRadio.displayName = 'MenuItemRadio';\n\n/**\n * A checkbox item drawn as a switch at the end of the row (`role=\"menuitemcheckbox\"`,\n * `aria-checked`), bound to the menu's `checkedValues[name]` by `value`. A click and Enter toggle\n * it and close a popup menu (unless `persistOnClick`, or the Menu's `persistOnItemClick`); Space\n * toggles it and keeps the menu open. The switch is decorative (`aria-hidden`). Works in static and\n * popup menus. Must be used within Menu.\n *\n * Also exported as `MenuItemSwitch` (import the flat name from React Server Components).\n */\nexport const MenuItemSwitch = (props: MenuItemSwitchProps) => (\n  <SelectableMenuItem\n    {...props}\n    kind=\"switch\"\n    componentName=\"Menu.ItemSwitch\"\n    rootClassName={cn(menuItemClassNames.root, menuItemSwitchClassNames.root)}\n    partClassNames={{\n      icon: cn(menuItemClassNames.icon, menuItemSwitchClassNames.icon),\n      content: cn(menuItemClassNames.content, menuItemSwitchClassNames.content),\n      shortcut: cn(menuItemClassNames.shortcut, menuItemSwitchClassNames.shortcut),\n    }}\n  />\n);\nMenuItemSwitch.displayName = 'MenuItemSwitch';\n"],"mappings":"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"}

package/dist/components/navigation/Menu.splitGroup.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/children.cjs"),r=require("../../lib/dev.cjs"),i=require("../../lib/composeEventHandlers.cjs"),a=require("../../lib/direction.cjs");require("./Menu.shared.cjs");const o=require("./Menu.items.cjs"),s=require("./Menu.root.cjs");let c=require("react");c=e.__toESM(c,1);let l=require("react/jsx-runtime");function u(e){let t=n.flattenChildren(e).map(({node:e})=>e);return t.some((e,r)=>n.isElementOfType(e,o.MenuItem)&&n.isElementOfType(t[r+1],s.MenuRoot))}function d(e){return Array.from(e.children).filter(e=>e instanceof HTMLElement&&e.matches(`[role="menuitem"],[role="menuitemcheckbox"],[role="menuitemradio"]`))}var f=({children:e,className:n,onKeyDown:o,ref:s,...f})=>{let p=u(e);c.useEffect(()=>{p||r.warnOnce(`Menu.SplitGroup:children`,`Menu.SplitGroup: expected a Menu.Item (the action) followed by a submenu <Menu> whose Menu.Trigger wraps a Menu.Item with an aria-label (its direct children, Fragments included).`)},[p]);let m=e=>{if(e.altKey||e.ctrlKey||e.metaKey)return;let t=a.getArrowIntent(e.key,{orientation:`horizontal`,dir:a.getDirection(e.currentTarget)});if(!t)return;let n=d(e.currentTarget);if(n.length<2)return;let r=n[0],i=n[n.length-1],[o,s]=t===`next`?[r,i]:[i,r];e.target===o&&s.getAttribute(`aria-disabled`)!==`true`&&(e.preventDefault(),s.focus())};return(0,l.jsx)(`div`,{role:`group`,...f,ref:s,"data-menu-split-group":``,onKeyDown:i.composeEventHandlers(o,m),className:t.cn(`flex items-stretch [&>:first-child]:flex-1 [&>:last-child]:border-s [&>:last-child]:border-border`,n),children:e})};f.displayName=`MenuSplitGroup`,exports.MenuSplitGroup=f;
+"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/children.cjs"),r=require("../../lib/dev.cjs"),i=require("../../lib/composeEventHandlers.cjs"),a=require("../../lib/classNames.cjs"),o=require("../../lib/direction.cjs");require("./Menu.shared.cjs");const s=require("./Menu.items.cjs"),c=require("./Menu.root.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("react/jsx-runtime");function d(e){let t=n.flattenChildren(e).map(({node:e})=>e);return t.some((e,r)=>n.isElementOfType(e,s.MenuItem)&&n.isElementOfType(t[r+1],c.MenuRoot))}function f(e){return Array.from(e.children).filter(e=>e instanceof HTMLElement&&e.matches(`[role="menuitem"],[role="menuitemcheckbox"],[role="menuitemradio"]`))}var p=({children:e,className:n,onKeyDown:s,ref:c,...p})=>{let m=d(e);l.useEffect(()=>{m||r.warnOnce(`Menu.SplitGroup:children`,`Menu.SplitGroup: expected a Menu.Item (the action) followed by a submenu <Menu> whose Menu.Trigger wraps a Menu.Item with an aria-label (its direct children, Fragments included).`)},[m]);let h=e=>{if(e.altKey||e.ctrlKey||e.metaKey)return;let t=o.getArrowIntent(e.key,{orientation:`horizontal`,dir:o.getDirection(e.currentTarget)});if(!t)return;let n=f(e.currentTarget);if(n.length<2)return;let r=n[0],i=n[n.length-1],[a,s]=t===`next`?[r,i]:[i,r];e.target===a&&s.getAttribute(`aria-disabled`)!==`true`&&(e.preventDefault(),s.focus())};return(0,u.jsx)(`div`,{role:`group`,...p,ref:c,"data-menu-split-group":``,onKeyDown:i.composeEventHandlers(s,h),className:t.cn(a.menuSplitGroupClassNames.root,`flex items-stretch [&>:first-child]:flex-1 [&>:last-child]:border-s [&>:last-child]:border-border`,n),children:e})};p.displayName=`MenuSplitGroup`,exports.MenuSplitGroup=p;
 //# sourceMappingURL=Menu.splitGroup.cjs.map