@fluentui/react-menu 9.24.1 → 9.25.0

package/lib/components/MenuList/useMenuListStyles.styles.raw.js

@@ -18,6 +18,7 @@ const useStyles = makeStyles({
  */ export const useMenuListStyles_unstable = (state)=>{
     'use no memo';
     const styles = useStyles();
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.hasMenuContext && styles.hasMenuContext, state.root.className);
     return state;
 };

package/lib/components/MenuList/useMenuListStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuList/useMenuListStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuListSlots, MenuListState } from './MenuList.types';\n\nexport const menuListClassNames: SlotClassNames<MenuListSlots> = {\n  root: 'fui-MenuList',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '2px',\n  },\n  hasMenuContext: {\n    height: '100%',\n  },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuListStyles_unstable = (state: MenuListState): MenuListState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    menuListClassNames.root,\n    styles.root,\n    state.hasMenuContext && styles.hasMenuContext,\n    state.root.className,\n  );\n  return state;\n};\n"],"names":["mergeClasses","makeStyles","menuListClassNames","root","useStyles","display","flexDirection","gap","hasMenuContext","height","useMenuListStyles_unstable","state","styles","className"],"mappings":"AAAA;AAGA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAG1D,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYH,WAAW;IAC3BE,MAAM;QACJE,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAC,gBAAgB;QACdC,QAAQ;IACV;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC;IAEA,MAAMC,SAASR;IACfO,MAAMR,IAAI,CAACU,SAAS,GAAGb,aACrBE,mBAAmBC,IAAI,EACvBS,OAAOT,IAAI,EACXQ,MAAMH,cAAc,IAAII,OAAOJ,cAAc,EAC7CG,MAAMR,IAAI,CAACU,SAAS;IAEtB,OAAOF;AACT,EAAE"}
+{"version":3,"sources":["../src/components/MenuList/useMenuListStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuListSlots, MenuListState } from './MenuList.types';\n\nexport const menuListClassNames: SlotClassNames<MenuListSlots> = {\n  root: 'fui-MenuList',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '2px',\n  },\n  hasMenuContext: {\n    height: '100%',\n  },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuListStyles_unstable = (state: MenuListState): MenuListState => {\n  'use no memo';\n\n  const styles = useStyles();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(\n    menuListClassNames.root,\n    styles.root,\n    state.hasMenuContext && styles.hasMenuContext,\n    state.root.className,\n  );\n  return state;\n};\n"],"names":["mergeClasses","makeStyles","menuListClassNames","root","useStyles","display","flexDirection","gap","hasMenuContext","height","useMenuListStyles_unstable","state","styles","className"],"mappings":"AAAA;AAGA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAG1D,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYH,WAAW;IAC3BE,MAAM;QACJE,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAC,gBAAgB;QACdC,QAAQ;IACV;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC;IAEA,MAAMC,SAASR;IACf,oDAAoD;IACpDO,MAAMR,IAAI,CAACU,SAAS,GAAGb,aACrBE,mBAAmBC,IAAI,EACvBS,OAAOT,IAAI,EACXQ,MAAMH,cAAc,IAAII,OAAOJ,cAAc,EAC7CG,MAAMR,IAAI,CAACU,SAAS;IAEtB,OAAOF;AACT,EAAE"}

package/lib/components/MenuPopover/index.js

@@ -1,4 +1,4 @@
 export { MenuPopover } from './MenuPopover';
 export { renderMenuPopover_unstable } from './renderMenuPopover';
-export { useMenuPopover_unstable } from './useMenuPopover';
+export { useMenuPopover_unstable, useMenuPopoverBase_unstable } from './useMenuPopover';
 export { menuPopoverClassNames, useMenuPopoverStyles_unstable } from './useMenuPopoverStyles.styles';

package/lib/components/MenuPopover/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuPopover/index.ts"],"sourcesContent":["export { MenuPopover } from './MenuPopover';\nexport type { MenuPopoverProps, MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nexport { renderMenuPopover_unstable } from './renderMenuPopover';\nexport { useMenuPopover_unstable } from './useMenuPopover';\nexport { menuPopoverClassNames, useMenuPopoverStyles_unstable } from './useMenuPopoverStyles.styles';\n"],"names":["MenuPopover","renderMenuPopover_unstable","useMenuPopover_unstable","menuPopoverClassNames","useMenuPopoverStyles_unstable"],"mappings":"AAAA,SAASA,WAAW,QAAQ,gBAAgB;AAE5C,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,qBAAqB,EAAEC,6BAA6B,QAAQ,gCAAgC"}
+{"version":3,"sources":["../src/components/MenuPopover/index.ts"],"sourcesContent":["export { MenuPopover } from './MenuPopover';\nexport type { MenuPopoverProps, MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nexport { renderMenuPopover_unstable } from './renderMenuPopover';\nexport { useMenuPopover_unstable, useMenuPopoverBase_unstable } from './useMenuPopover';\nexport { menuPopoverClassNames, useMenuPopoverStyles_unstable } from './useMenuPopoverStyles.styles';\n"],"names":["MenuPopover","renderMenuPopover_unstable","useMenuPopover_unstable","useMenuPopoverBase_unstable","menuPopoverClassNames","useMenuPopoverStyles_unstable"],"mappings":"AAAA,SAASA,WAAW,QAAQ,gBAAgB;AAE5C,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,uBAAuB,EAAEC,2BAA2B,QAAQ,mBAAmB;AACxF,SAASC,qBAAqB,EAAEC,6BAA6B,QAAQ,gCAAgC"}

package/lib/components/MenuPopover/useMenuPopover.js

@@ -9,14 +9,15 @@ import { useMenuContext_unstable } from '../../contexts/menuContext';
 import { useMenuListContext_unstable } from '../../contexts/menuListContext';
 import { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';
 /**
- * Create the state required to render MenuPopover.
+ * Base hook for MenuPopover, produces state required to render the component.
  *
- * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,
- * before being passed to renderMenuPopover_unstable.
+ * Does not invoke `@fluentui/react-tabster` focus-restoration or
+ * `@fluentui/react-motion` ref-forwarding APIs internally; the wrapper
+ * `useMenuPopover_unstable` layers those on top.
  *
  * @param props - props from this instance of MenuPopover
  * @param ref - reference to root HTMLElement of MenuPopover
- */ export const useMenuPopover_unstable = (props, ref)=>{
+ */ export const useMenuPopoverBase_unstable = (props, ref)=>{
     'use no memo';
     const safeZone = useMenuContext_unstable((context)=>context.safeZone);
     const popoverRef = useMenuContext_unstable((context)=>context.menuPopoverRef);
@@ -30,7 +31,6 @@ import { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';
         return (_ctx_shouldCloseOnArrowLeft = ctx.shouldCloseOnArrowLeft) !== null && _ctx_shouldCloseOnArrowLeft !== void 0 ? _ctx_shouldCloseOnArrowLeft : true;
     });
     const canDispatchCustomEventRef = React.useRef(true);
-    const restoreFocusSourceAttributes = useRestoreFocusSource();
     const [setThrottleTimeout, clearThrottleTimeout] = useTimeout();
     const { dir } = useFluent();
     const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;
@@ -65,12 +65,11 @@ import { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';
     const mountNode = useMenuContext_unstable((context)=>context.mountNode);
     const rootProps = slot.always(getIntrinsicElementProps('div', {
         role: 'presentation',
-        ...restoreFocusSourceAttributes,
         ...props,
         // FIXME:
         // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
         // but since it would be a breaking change to fix it, we are casting ref to it's proper type
-        ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef, useMotionForwardedRef())
+        ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef)
     }), {
         elementType: 'div'
     });
@@ -126,3 +125,24 @@ import { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';
         root: rootProps
     };
 };
+/**
+ * Create the state required to render MenuPopover.
+ *
+ * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,
+ * before being passed to renderMenuPopover_unstable.
+ *
+ * @param props - props from this instance of MenuPopover
+ * @param ref - reference to root HTMLElement of MenuPopover
+ */ export const useMenuPopover_unstable = (props, ref)=>{
+    const restoreFocusSourceAttributes = useRestoreFocusSource();
+    const motionRef = useMotionForwardedRef();
+    const baseState = useMenuPopoverBase_unstable(props, ref);
+    return {
+        ...baseState,
+        root: {
+            ...restoreFocusSourceAttributes,
+            ...baseState.root,
+            ref: useMergedRefs(baseState.root.ref, motionRef)
+        }
+    };
+};

package/lib/components/MenuPopover/useMenuPopover.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuPopover/useMenuPopover.ts"],"sourcesContent":["'use client';\n\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useMotionForwardedRef } from '@fluentui/react-motion';\nimport { useRestoreFocusSource } from '@fluentui/react-tabster';\nimport { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot, useTimeout } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';\nimport type { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  'use no memo';\n\n  const safeZone = useMenuContext_unstable(context => context.safeZone);\n  const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n\n  const isSubmenu = useIsSubmenu();\n  const shouldCloseOnArrowLeft = useMenuListContext_unstable(ctx => ctx.shouldCloseOnArrowLeft ?? true);\n\n  const canDispatchCustomEventRef = React.useRef(true);\n  const restoreFocusSourceAttributes = useRestoreFocusSource();\n  const [setThrottleTimeout, clearThrottleTimeout] = useTimeout();\n\n  const { dir } = useFluent();\n  const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n  // use DOM listener since react events propagate up the react tree\n  // no need to do `contains` logic as menus are all positioned in different portals\n  const mouseOverListenerCallbackRef = React.useCallback(\n    (node: HTMLElement) => {\n      if (node) {\n        // Dispatches the custom menu mouse enter event with throttling\n        // Needs to trigger on mouseover to support keyboard + mouse together\n        // i.e. keyboard opens submenus while cursor is still on the parent\n        node.addEventListener('mouseover', e => {\n          if (canDispatchCustomEventRef.current) {\n            canDispatchCustomEventRef.current = false;\n            dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n            setThrottleTimeout(() => {\n              canDispatchCustomEventRef.current = true;\n            }, 250);\n          }\n        });\n      }\n    },\n    [popoverRef, setThrottleTimeout],\n  );\n\n  React.useEffect(() => {\n    return () => clearThrottleTimeout();\n  }, [clearThrottleTimeout]);\n\n  const inline = useMenuContext_unstable(context => context.inline) ?? false;\n  const mountNode = useMenuContext_unstable(context => context.mountNode);\n\n  const rootProps = slot.always(\n    getIntrinsicElementProps('div', {\n      role: 'presentation',\n      ...restoreFocusSourceAttributes,\n      ...props,\n      // FIXME:\n      // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n      // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n      ref: useMergedRefs(\n        ref,\n        popoverRef,\n        mouseOverListenerCallbackRef,\n        useMotionForwardedRef(),\n      ) as React.Ref<HTMLDivElement>,\n    }),\n    { elementType: 'div' },\n  );\n  const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n  rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    if (openOnHover || isSubmenu) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n    }\n    onMouseEnterOriginal?.(event);\n  });\n  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    const key = event.key;\n    if (key === Escape || (isSubmenu && shouldCloseOnArrowLeft && key === CloseArrowKey)) {\n      if (open && popoverRef.current?.contains(event.target as HTMLElement) && !event.isDefaultPrevented()) {\n        setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n        // stop propagation to avoid conflicting with other elements that listen for `Escape`\n        // e,g: Dialog, Popover, Menu and Tooltip\n        event.preventDefault();\n      }\n    }\n    if (key === Tab) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n      if (!isSubmenu) {\n        triggerRef.current?.focus();\n      }\n    }\n    onKeyDownOriginal?.(event);\n  });\n\n  return {\n    inline,\n    mountNode,\n    safeZone,\n    components: { root: 'div' },\n    root: rootProps,\n  };\n};\n"],"names":["ArrowLeft","Tab","ArrowRight","Escape","useFluent_unstable","useFluent","useMotionForwardedRef","useRestoreFocusSource","getIntrinsicElementProps","useEventCallback","useMergedRefs","slot","useTimeout","React","useMenuContext_unstable","useMenuListContext_unstable","dispatchMenuEnterEvent","useIsSubmenu","useMenuPopover_unstable","props","ref","safeZone","context","popoverRef","menuPopoverRef","setOpen","open","openOnHover","triggerRef","isSubmenu","shouldCloseOnArrowLeft","ctx","canDispatchCustomEventRef","useRef","restoreFocusSourceAttributes","setThrottleTimeout","clearThrottleTimeout","dir","CloseArrowKey","mouseOverListenerCallbackRef","useCallback","node","addEventListener","e","current","useEffect","inline","mountNode","rootProps","always","role","elementType","onMouseEnter","onMouseEnterOriginal","onKeyDown","onKeyDownOriginal","event","keyboard","type","key","contains","target","isDefaultPrevented","preventDefault","focus","components","root"],"mappings":"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"}
+{"version":3,"sources":["../src/components/MenuPopover/useMenuPopover.ts"],"sourcesContent":["'use client';\n\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useMotionForwardedRef } from '@fluentui/react-motion';\nimport { useRestoreFocusSource } from '@fluentui/react-tabster';\nimport { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot, useTimeout } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';\nimport type { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\n\n/**\n * Base hook for MenuPopover, produces state required to render the component.\n *\n * Does not invoke `@fluentui/react-tabster` focus-restoration or\n * `@fluentui/react-motion` ref-forwarding APIs internally; the wrapper\n * `useMenuPopover_unstable` layers those on top.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopoverBase_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  'use no memo';\n\n  const safeZone = useMenuContext_unstable(context => context.safeZone);\n  const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n\n  const isSubmenu = useIsSubmenu();\n  const shouldCloseOnArrowLeft = useMenuListContext_unstable(ctx => ctx.shouldCloseOnArrowLeft ?? true);\n\n  const canDispatchCustomEventRef = React.useRef(true);\n  const [setThrottleTimeout, clearThrottleTimeout] = useTimeout();\n\n  const { dir } = useFluent();\n  const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n  // use DOM listener since react events propagate up the react tree\n  // no need to do `contains` logic as menus are all positioned in different portals\n  const mouseOverListenerCallbackRef = React.useCallback(\n    (node: HTMLElement) => {\n      if (node) {\n        // Dispatches the custom menu mouse enter event with throttling\n        // Needs to trigger on mouseover to support keyboard + mouse together\n        // i.e. keyboard opens submenus while cursor is still on the parent\n        node.addEventListener('mouseover', e => {\n          if (canDispatchCustomEventRef.current) {\n            canDispatchCustomEventRef.current = false;\n            dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n            setThrottleTimeout(() => {\n              canDispatchCustomEventRef.current = true;\n            }, 250);\n          }\n        });\n      }\n    },\n    [popoverRef, setThrottleTimeout],\n  );\n\n  React.useEffect(() => {\n    return () => clearThrottleTimeout();\n  }, [clearThrottleTimeout]);\n\n  const inline = useMenuContext_unstable(context => context.inline) ?? false;\n  const mountNode = useMenuContext_unstable(context => context.mountNode);\n\n  const rootProps = slot.always(\n    getIntrinsicElementProps('div', {\n      role: 'presentation',\n      ...props,\n      // FIXME:\n      // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n      // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n      ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef) as React.Ref<HTMLDivElement>,\n    }),\n    { elementType: 'div' },\n  );\n\n  const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n  rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    if (openOnHover || isSubmenu) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n    }\n    onMouseEnterOriginal?.(event);\n  });\n\n  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    const key = event.key;\n    if (key === Escape || (isSubmenu && shouldCloseOnArrowLeft && key === CloseArrowKey)) {\n      if (open && popoverRef.current?.contains(event.target as HTMLElement) && !event.isDefaultPrevented()) {\n        setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n        // stop propagation to avoid conflicting with other elements that listen for `Escape`\n        // e,g: Dialog, Popover, Menu and Tooltip\n        event.preventDefault();\n      }\n    }\n    if (key === Tab) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n      if (!isSubmenu) {\n        triggerRef.current?.focus();\n      }\n    }\n    onKeyDownOriginal?.(event);\n  });\n\n  return {\n    inline,\n    mountNode,\n    safeZone,\n    components: { root: 'div' },\n    root: rootProps,\n  };\n};\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  const restoreFocusSourceAttributes = useRestoreFocusSource();\n  const motionRef = useMotionForwardedRef();\n  const baseState = useMenuPopoverBase_unstable(props, ref);\n\n  return {\n    ...baseState,\n    root: {\n      ...restoreFocusSourceAttributes,\n      ...baseState.root,\n      ref: useMergedRefs(baseState.root.ref, motionRef) as React.Ref<HTMLDivElement>,\n    },\n  };\n};\n"],"names":["ArrowLeft","Tab","ArrowRight","Escape","useFluent_unstable","useFluent","useMotionForwardedRef","useRestoreFocusSource","getIntrinsicElementProps","useEventCallback","useMergedRefs","slot","useTimeout","React","useMenuContext_unstable","useMenuListContext_unstable","dispatchMenuEnterEvent","useIsSubmenu","useMenuPopoverBase_unstable","props","ref","safeZone","context","popoverRef","menuPopoverRef","setOpen","open","openOnHover","triggerRef","isSubmenu","shouldCloseOnArrowLeft","ctx","canDispatchCustomEventRef","useRef","setThrottleTimeout","clearThrottleTimeout","dir","CloseArrowKey","mouseOverListenerCallbackRef","useCallback","node","addEventListener","e","current","useEffect","inline","mountNode","rootProps","always","role","elementType","onMouseEnter","onMouseEnterOriginal","onKeyDown","onKeyDownOriginal","event","keyboard","type","key","contains","target","isDefaultPrevented","preventDefault","focus","components","root","useMenuPopover_unstable","restoreFocusSourceAttributes","motionRef","baseState"],"mappings":"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"}

package/lib/components/MenuPopover/useMenuPopoverStyles.styles.js

@@ -63,6 +63,7 @@ export const useMenuPopoverStyles_unstable = state => {
   'use no memo';
 
   const styles = useStyles();
+  // eslint-disable-next-line react-hooks/immutability
   state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);
   return state;
 };

package/lib/components/MenuPopover/useMenuPopoverStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["mergeClasses","__styles","tokens","typographyStyles","menuPopoverClassNames","root","useStyles","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","De3pzq","sj55zd","B7ck84d","Bf4jedk","B2u0y6b","B68tc82","a9b677","E5pizo","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","d","p","useMenuPopoverStyles_unstable","state","styles","className"],"sources":["useMenuPopoverStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const menuPopoverClassNames = {\n    root: 'fui-MenuPopover'\n};\nconst useStyles = makeStyles({\n    root: {\n        borderRadius: tokens.borderRadiusMedium,\n        backgroundColor: tokens.colorNeutralBackground1,\n        color: tokens.colorNeutralForeground1,\n        boxSizing: 'border-box',\n        minWidth: '138px',\n        maxWidth: '300px',\n        overflowX: 'hidden',\n        width: 'max-content',\n        boxShadow: `${tokens.shadow16}`,\n        padding: '4px',\n        border: `1px solid ${tokens.colorTransparentStroke}`,\n        ...typographyStyles.body1\n    }\n});\n/**\n * Apply styling to the Menu slots based on the state\n */ export const useMenuPopoverStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGL,QAAA;EAAAI,IAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAejB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,aAAa;;EACb,MAAMC,MAAM,GAAG5C,SAAS,CAAC,CAAC;EAC1B2C,KAAK,CAAC5C,IAAI,CAAC8C,SAAS,GAAGnD,YAAY,CAACI,qBAAqB,CAACC,IAAI,EAAE6C,MAAM,CAAC7C,IAAI,EAAE4C,KAAK,CAAC5C,IAAI,CAAC8C,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["mergeClasses","__styles","tokens","typographyStyles","menuPopoverClassNames","root","useStyles","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","De3pzq","sj55zd","B7ck84d","Bf4jedk","B2u0y6b","B68tc82","a9b677","E5pizo","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","d","p","useMenuPopoverStyles_unstable","state","styles","className"],"sources":["useMenuPopoverStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const menuPopoverClassNames = {\n    root: 'fui-MenuPopover'\n};\nconst useStyles = makeStyles({\n    root: {\n        borderRadius: tokens.borderRadiusMedium,\n        backgroundColor: tokens.colorNeutralBackground1,\n        color: tokens.colorNeutralForeground1,\n        boxSizing: 'border-box',\n        minWidth: '138px',\n        maxWidth: '300px',\n        overflowX: 'hidden',\n        width: 'max-content',\n        boxShadow: `${tokens.shadow16}`,\n        padding: '4px',\n        border: `1px solid ${tokens.colorTransparentStroke}`,\n        ...typographyStyles.body1\n    }\n});\n/**\n * Apply styling to the Menu slots based on the state\n */ export const useMenuPopoverStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGL,QAAA;EAAAI,IAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAejB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,aAAa;;EACb,MAAMC,MAAM,GAAG5C,SAAS,CAAC,CAAC;EAC1B;EACA2C,KAAK,CAAC5C,IAAI,CAAC8C,SAAS,GAAGnD,YAAY,CAACI,qBAAqB,CAACC,IAAI,EAAE6C,MAAM,CAAC7C,IAAI,EAAE4C,KAAK,CAAC5C,IAAI,CAAC8C,SAAS,CAAC;EAClG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/MenuPopover/useMenuPopoverStyles.styles.raw.js

@@ -25,6 +25,7 @@ const useStyles = makeStyles({
  */ export const useMenuPopoverStyles_unstable = (state)=>{
     'use no memo';
     const styles = useStyles();
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);
     return state;
 };

package/lib/components/MenuPopover/useMenuPopoverStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuPopover/useMenuPopoverStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuPopoverClassNames: SlotClassNames<MenuPopoverSlots> = {\n  root: 'fui-MenuPopover',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    borderRadius: tokens.borderRadiusMedium,\n    backgroundColor: tokens.colorNeutralBackground1,\n    color: tokens.colorNeutralForeground1,\n    boxSizing: 'border-box',\n    minWidth: '138px',\n    maxWidth: '300px',\n    overflowX: 'hidden',\n    width: 'max-content',\n    boxShadow: `${tokens.shadow16}`,\n    padding: '4px',\n    border: `1px solid ${tokens.colorTransparentStroke}`,\n    ...typographyStyles.body1,\n  },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuPopoverStyles_unstable = (state: MenuPopoverState): MenuPopoverState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n  return state;\n};\n"],"names":["mergeClasses","makeStyles","tokens","typographyStyles","menuPopoverClassNames","root","useStyles","borderRadius","borderRadiusMedium","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","boxSizing","minWidth","maxWidth","overflowX","width","boxShadow","shadow16","padding","border","colorTransparentStroke","body1","useMenuPopoverStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAIjE,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYL,WAAW;IAC3BI,MAAM;QACJE,cAAcL,OAAOM,kBAAkB;QACvCC,iBAAiBP,OAAOQ,uBAAuB;QAC/CC,OAAOT,OAAOU,uBAAuB;QACrCC,WAAW;QACXC,UAAU;QACVC,UAAU;QACVC,WAAW;QACXC,OAAO;QACPC,WAAW,GAAGhB,OAAOiB,QAAQ,EAAE;QAC/BC,SAAS;QACTC,QAAQ,CAAC,UAAU,EAAEnB,OAAOoB,sBAAsB,EAAE;QACpD,GAAGnB,iBAAiBoB,KAAK;IAC3B;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C;IAEA,MAAMC,SAASpB;IACfmB,MAAMpB,IAAI,CAACsB,SAAS,GAAG3B,aAAaI,sBAAsBC,IAAI,EAAEqB,OAAOrB,IAAI,EAAEoB,MAAMpB,IAAI,CAACsB,SAAS;IACjG,OAAOF;AACT,EAAE"}
+{"version":3,"sources":["../src/components/MenuPopover/useMenuPopoverStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuPopoverClassNames: SlotClassNames<MenuPopoverSlots> = {\n  root: 'fui-MenuPopover',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    borderRadius: tokens.borderRadiusMedium,\n    backgroundColor: tokens.colorNeutralBackground1,\n    color: tokens.colorNeutralForeground1,\n    boxSizing: 'border-box',\n    minWidth: '138px',\n    maxWidth: '300px',\n    overflowX: 'hidden',\n    width: 'max-content',\n    boxShadow: `${tokens.shadow16}`,\n    padding: '4px',\n    border: `1px solid ${tokens.colorTransparentStroke}`,\n    ...typographyStyles.body1,\n  },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuPopoverStyles_unstable = (state: MenuPopoverState): MenuPopoverState => {\n  'use no memo';\n\n  const styles = useStyles();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n  return state;\n};\n"],"names":["mergeClasses","makeStyles","tokens","typographyStyles","menuPopoverClassNames","root","useStyles","borderRadius","borderRadiusMedium","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","boxSizing","minWidth","maxWidth","overflowX","width","boxShadow","shadow16","padding","border","colorTransparentStroke","body1","useMenuPopoverStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAIjE,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYL,WAAW;IAC3BI,MAAM;QACJE,cAAcL,OAAOM,kBAAkB;QACvCC,iBAAiBP,OAAOQ,uBAAuB;QAC/CC,OAAOT,OAAOU,uBAAuB;QACrCC,WAAW;QACXC,UAAU;QACVC,UAAU;QACVC,WAAW;QACXC,OAAO;QACPC,WAAW,GAAGhB,OAAOiB,QAAQ,EAAE;QAC/BC,SAAS;QACTC,QAAQ,CAAC,UAAU,EAAEnB,OAAOoB,sBAAsB,EAAE;QACpD,GAAGnB,iBAAiBoB,KAAK;IAC3B;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C;IAEA,MAAMC,SAASpB;IACf,oDAAoD;IACpDmB,MAAMpB,IAAI,CAACsB,SAAS,GAAG3B,aAAaI,sBAAsBC,IAAI,EAAEqB,OAAOrB,IAAI,EAAEoB,MAAMpB,IAAI,CAACsB,SAAS;IACjG,OAAOF;AACT,EAAE"}

package/lib/components/MenuSplitGroup/useMenuSplitGroup.js

@@ -53,7 +53,8 @@ import { menuSplitGroupMultilineAttr } from './useMenuSplitGroupStyles.styles';
             root: 'div'
         },
         setMultiline,
-        root: slot.always(getIntrinsicElementProps('div', {
+        root: slot.always(// eslint-disable-next-line react-hooks/refs
+        getIntrinsicElementProps('div', {
             role: 'group',
             // FIXME:
             // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`

package/lib/components/MenuSplitGroup/useMenuSplitGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroup.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, getRTLSafeKey, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { MenuSplitGroupProps, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport { ArrowRight, ArrowLeft } from '@fluentui/keyboard-keys';\nimport { menuSplitGroupMultilineAttr } from './useMenuSplitGroupStyles.styles';\n\n/**\n * Create the state required to render MenuSplitGroup.\n *\n * The returned state can be modified with hooks such as useMenuSplitGroupStyles_unstable,\n * before being passed to renderMenuSplitGroup_unstable.\n *\n * @param props - props from this instance of MenuSplitGroup\n * @param ref - reference to root HTMLElement of MenuSplitGroup\n */\nexport const useMenuSplitGroup_unstable = (\n  props: MenuSplitGroupProps,\n  ref: React.Ref<HTMLElement>,\n): MenuSplitGroupState => {\n  const innerRef = React.useRef<HTMLDivElement>(undefined);\n  const { dir, targetDocument } = useFluent();\n\n  const nextArrowKey = getRTLSafeKey(ArrowRight, dir);\n  const prevArrowKey = getRTLSafeKey(ArrowLeft, dir);\n\n  const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n  const { multilineRef, setMultiline } = useHandleMultilineMenuItem();\n\n  const onKeyDown = React.useCallback(\n    (e: React.KeyboardEvent<HTMLElement>) => {\n      const activeElement = targetDocument?.activeElement;\n      if (!activeElement) {\n        return;\n      }\n\n      if (!innerRef.current?.contains(activeElement)) {\n        return;\n      }\n\n      if (e.key === nextArrowKey) {\n        const next = findNextFocusable(activeElement as HTMLElement, { container: innerRef.current });\n        next?.focus();\n      }\n\n      if (e.key === prevArrowKey) {\n        const prev = findPrevFocusable(activeElement as HTMLElement, { container: innerRef.current });\n        prev?.focus();\n      }\n    },\n    [findNextFocusable, findPrevFocusable, targetDocument, nextArrowKey, prevArrowKey],\n  );\n\n  return {\n    components: {\n      root: 'div',\n    },\n    setMultiline,\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        role: 'group',\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: useMergedRefs(ref, innerRef, multilineRef) as React.Ref<HTMLDivElement>,\n        onKeyDown,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n\n/**\n * Creates a callback that lets a multiline menu item child set an attribute on this component\n * Children can mount before parents so we need to store the value and apply it when the parent is mounted\n */\nconst useHandleMultilineMenuItem = () => {\n  const [handle] = React.useState(() => {\n    let isMultiline = false;\n    let multilineNode: HTMLElement | null = null;\n\n    function applyAttr() {\n      multilineNode?.toggleAttribute(menuSplitGroupMultilineAttr, isMultiline);\n    }\n\n    return {\n      multilineRef: (node: HTMLDivElement | null) => {\n        if (node) {\n          multilineNode = node;\n          applyAttr();\n        } else {\n          multilineNode = null;\n        }\n      },\n      setMultiline: (value: boolean) => {\n        isMultiline = value;\n        applyAttr();\n      },\n    };\n  });\n\n  return handle;\n};\n"],"names":["React","getIntrinsicElementProps","getRTLSafeKey","useMergedRefs","slot","useFocusFinders","useFluent_unstable","useFluent","ArrowRight","ArrowLeft","menuSplitGroupMultilineAttr","useMenuSplitGroup_unstable","props","ref","innerRef","useRef","undefined","dir","targetDocument","nextArrowKey","prevArrowKey","findNextFocusable","findPrevFocusable","multilineRef","setMultiline","useHandleMultilineMenuItem","onKeyDown","useCallback","e","activeElement","current","contains","key","next","container","focus","prev","components","root","always","role","elementType","handle","useState","isMultiline","multilineNode","applyAttr","toggleAttribute","node","value"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,aAAa,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AACzG,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF,SAASC,UAAU,EAAEC,SAAS,QAAQ,0BAA0B;AAChE,SAASC,2BAA2B,QAAQ,mCAAmC;AAE/E;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAMC,WAAWd,MAAMe,MAAM,CAAiBC;IAC9C,MAAM,EAAEC,GAAG,EAAEC,cAAc,EAAE,GAAGX;IAEhC,MAAMY,eAAejB,cAAcM,YAAYS;IAC/C,MAAMG,eAAelB,cAAcO,WAAWQ;IAE9C,MAAM,EAAEI,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGjB;IACjD,MAAM,EAAEkB,YAAY,EAAEC,YAAY,EAAE,GAAGC;IAEvC,MAAMC,YAAY1B,MAAM2B,WAAW,CACjC,CAACC;YAMMd;QALL,MAAMe,gBAAgBX,2BAAAA,qCAAAA,eAAgBW,aAAa;QACnD,IAAI,CAACA,eAAe;YAClB;QACF;QAEA,IAAI,GAACf,oBAAAA,SAASgB,OAAO,cAAhBhB,wCAAAA,kBAAkBiB,QAAQ,CAACF,iBAAgB;YAC9C;QACF;QAEA,IAAID,EAAEI,GAAG,KAAKb,cAAc;YAC1B,MAAMc,OAAOZ,kBAAkBQ,eAA8B;gBAAEK,WAAWpB,SAASgB,OAAO;YAAC;YAC3FG,iBAAAA,2BAAAA,KAAME,KAAK;QACb;QAEA,IAAIP,EAAEI,GAAG,KAAKZ,cAAc;YAC1B,MAAMgB,OAAOd,kBAAkBO,eAA8B;gBAAEK,WAAWpB,SAASgB,OAAO;YAAC;YAC3FM,iBAAAA,2BAAAA,KAAMD,KAAK;QACb;IACF,GACA;QAACd;QAAmBC;QAAmBJ;QAAgBC;QAAcC;KAAa;IAGpF,OAAO;QACLiB,YAAY;YACVC,MAAM;QACR;QACAd;QACAc,MAAMlC,KAAKmC,MAAM,CACftC,yBAAyB,OAAO;YAC9BuC,MAAM;YACN,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5F3B,KAAKV,cAAcU,KAAKC,UAAUS;YAClCG;YACA,GAAGd,KAAK;QACV,IACA;YAAE6B,aAAa;QAAM;IAEzB;AACF,EAAE;AAEF;;;CAGC,GACD,MAAMhB,6BAA6B;IACjC,MAAM,CAACiB,OAAO,GAAG1C,MAAM2C,QAAQ,CAAC;QAC9B,IAAIC,cAAc;QAClB,IAAIC,gBAAoC;QAExC,SAASC;YACPD,0BAAAA,oCAAAA,cAAeE,eAAe,CAACrC,6BAA6BkC;QAC9D;QAEA,OAAO;YACLrB,cAAc,CAACyB;gBACb,IAAIA,MAAM;oBACRH,gBAAgBG;oBAChBF;gBACF,OAAO;oBACLD,gBAAgB;gBAClB;YACF;YACArB,cAAc,CAACyB;gBACbL,cAAcK;gBACdH;YACF;QACF;IACF;IAEA,OAAOJ;AACT"}
+{"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroup.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, getRTLSafeKey, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { MenuSplitGroupProps, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport { ArrowRight, ArrowLeft } from '@fluentui/keyboard-keys';\nimport { menuSplitGroupMultilineAttr } from './useMenuSplitGroupStyles.styles';\n\n/**\n * Create the state required to render MenuSplitGroup.\n *\n * The returned state can be modified with hooks such as useMenuSplitGroupStyles_unstable,\n * before being passed to renderMenuSplitGroup_unstable.\n *\n * @param props - props from this instance of MenuSplitGroup\n * @param ref - reference to root HTMLElement of MenuSplitGroup\n */\nexport const useMenuSplitGroup_unstable = (\n  props: MenuSplitGroupProps,\n  ref: React.Ref<HTMLElement>,\n): MenuSplitGroupState => {\n  const innerRef = React.useRef<HTMLDivElement>(undefined);\n  const { dir, targetDocument } = useFluent();\n\n  const nextArrowKey = getRTLSafeKey(ArrowRight, dir);\n  const prevArrowKey = getRTLSafeKey(ArrowLeft, dir);\n\n  const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n  const { multilineRef, setMultiline } = useHandleMultilineMenuItem();\n\n  const onKeyDown = React.useCallback(\n    (e: React.KeyboardEvent<HTMLElement>) => {\n      const activeElement = targetDocument?.activeElement;\n      if (!activeElement) {\n        return;\n      }\n\n      if (!innerRef.current?.contains(activeElement)) {\n        return;\n      }\n\n      if (e.key === nextArrowKey) {\n        const next = findNextFocusable(activeElement as HTMLElement, { container: innerRef.current });\n        next?.focus();\n      }\n\n      if (e.key === prevArrowKey) {\n        const prev = findPrevFocusable(activeElement as HTMLElement, { container: innerRef.current });\n        prev?.focus();\n      }\n    },\n    [findNextFocusable, findPrevFocusable, targetDocument, nextArrowKey, prevArrowKey],\n  );\n\n  return {\n    components: {\n      root: 'div',\n    },\n    setMultiline,\n    root: slot.always(\n      // eslint-disable-next-line react-hooks/refs\n      getIntrinsicElementProps('div', {\n        role: 'group',\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: useMergedRefs(ref, innerRef, multilineRef) as React.Ref<HTMLDivElement>,\n        onKeyDown,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n\n/**\n * Creates a callback that lets a multiline menu item child set an attribute on this component\n * Children can mount before parents so we need to store the value and apply it when the parent is mounted\n */\nconst useHandleMultilineMenuItem = () => {\n  const [handle] = React.useState(() => {\n    let isMultiline = false;\n    let multilineNode: HTMLElement | null = null;\n\n    function applyAttr() {\n      multilineNode?.toggleAttribute(menuSplitGroupMultilineAttr, isMultiline);\n    }\n\n    return {\n      multilineRef: (node: HTMLDivElement | null) => {\n        if (node) {\n          multilineNode = node;\n          applyAttr();\n        } else {\n          multilineNode = null;\n        }\n      },\n      setMultiline: (value: boolean) => {\n        isMultiline = value;\n        applyAttr();\n      },\n    };\n  });\n\n  return handle;\n};\n"],"names":["React","getIntrinsicElementProps","getRTLSafeKey","useMergedRefs","slot","useFocusFinders","useFluent_unstable","useFluent","ArrowRight","ArrowLeft","menuSplitGroupMultilineAttr","useMenuSplitGroup_unstable","props","ref","innerRef","useRef","undefined","dir","targetDocument","nextArrowKey","prevArrowKey","findNextFocusable","findPrevFocusable","multilineRef","setMultiline","useHandleMultilineMenuItem","onKeyDown","useCallback","e","activeElement","current","contains","key","next","container","focus","prev","components","root","always","role","elementType","handle","useState","isMultiline","multilineNode","applyAttr","toggleAttribute","node","value"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,aAAa,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AACzG,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF,SAASC,UAAU,EAAEC,SAAS,QAAQ,0BAA0B;AAChE,SAASC,2BAA2B,QAAQ,mCAAmC;AAE/E;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAMC,WAAWd,MAAMe,MAAM,CAAiBC;IAC9C,MAAM,EAAEC,GAAG,EAAEC,cAAc,EAAE,GAAGX;IAEhC,MAAMY,eAAejB,cAAcM,YAAYS;IAC/C,MAAMG,eAAelB,cAAcO,WAAWQ;IAE9C,MAAM,EAAEI,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGjB;IACjD,MAAM,EAAEkB,YAAY,EAAEC,YAAY,EAAE,GAAGC;IAEvC,MAAMC,YAAY1B,MAAM2B,WAAW,CACjC,CAACC;YAMMd;QALL,MAAMe,gBAAgBX,2BAAAA,qCAAAA,eAAgBW,aAAa;QACnD,IAAI,CAACA,eAAe;YAClB;QACF;QAEA,IAAI,GAACf,oBAAAA,SAASgB,OAAO,cAAhBhB,wCAAAA,kBAAkBiB,QAAQ,CAACF,iBAAgB;YAC9C;QACF;QAEA,IAAID,EAAEI,GAAG,KAAKb,cAAc;YAC1B,MAAMc,OAAOZ,kBAAkBQ,eAA8B;gBAAEK,WAAWpB,SAASgB,OAAO;YAAC;YAC3FG,iBAAAA,2BAAAA,KAAME,KAAK;QACb;QAEA,IAAIP,EAAEI,GAAG,KAAKZ,cAAc;YAC1B,MAAMgB,OAAOd,kBAAkBO,eAA8B;gBAAEK,WAAWpB,SAASgB,OAAO;YAAC;YAC3FM,iBAAAA,2BAAAA,KAAMD,KAAK;QACb;IACF,GACA;QAACd;QAAmBC;QAAmBJ;QAAgBC;QAAcC;KAAa;IAGpF,OAAO;QACLiB,YAAY;YACVC,MAAM;QACR;QACAd;QACAc,MAAMlC,KAAKmC,MAAM,CACf,4CAA4C;QAC5CtC,yBAAyB,OAAO;YAC9BuC,MAAM;YACN,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5F3B,KAAKV,cAAcU,KAAKC,UAAUS;YAClCG;YACA,GAAGd,KAAK;QACV,IACA;YAAE6B,aAAa;QAAM;IAEzB;AACF,EAAE;AAEF;;;CAGC,GACD,MAAMhB,6BAA6B;IACjC,MAAM,CAACiB,OAAO,GAAG1C,MAAM2C,QAAQ,CAAC;QAC9B,IAAIC,cAAc;QAClB,IAAIC,gBAAoC;QAExC,SAASC;YACPD,0BAAAA,oCAAAA,cAAeE,eAAe,CAACrC,6BAA6BkC;QAC9D;QAEA,OAAO;YACLrB,cAAc,CAACyB;gBACb,IAAIA,MAAM;oBACRH,gBAAgBG;oBAChBF;gBACF,OAAO;oBACLD,gBAAgB;gBAClB;YACF;YACArB,cAAc,CAACyB;gBACbL,cAAcK;gBACdH;YACF;QACF;IACF;IAEA,OAAOJ;AACT"}

package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.js

@@ -39,6 +39,7 @@ export const useMenuSplitGroupStyles_unstable = state => {
   'use no memo';
 
   const styles = useStyles();
+  // eslint-disable-next-line react-hooks/immutability
   state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);
   return state;
 };

package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","tokens","menuItemClassNames","menuSplitGroupMultilineAttr","menuSplitGroupClassNames","root","useStyles","Bhlrgs3","mc9l5x","rue6gn","oe75ve","Bbblmiw","Bn2ps6a","Bu15iap","B71tm0z","Gjs4sj","foni4y","Ie9k5m","f30fub","Jberyy","d","p","useMenuSplitGroupStyles_unstable","state","styles","className"],"sources":["useMenuSplitGroupStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuSplitGroupMultilineAttr = 'data-multiline';\nexport const menuSplitGroupClassNames = {\n    root: 'fui-MenuSplitGroup'\n};\n/**\n * Styles for the root slot\n * TODO - remove the use of nested combinators to style child menu items\n */ const useStyles = makeStyles({\n    root: {\n        [`[${menuSplitGroupMultilineAttr}]`]: {\n            [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n                alignSelf: 'center'\n            }\n        },\n        display: 'flex',\n        [`& > .${menuItemClassNames.root}:nth-of-type(1)`]: {\n            flex: 1\n        },\n        [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n            borderTopLeftRadius: 0,\n            borderBottomLeftRadius: 0,\n            paddingLeft: 0,\n            '::before': {\n                content: '\"\"',\n                width: tokens.strokeWidthThin,\n                height: '20px',\n                backgroundColor: tokens.colorNeutralStroke1\n            }\n        }\n    }\n});\n/**\n * Apply styling to the MenuSplitGroup slots based on the state\n */ export const useMenuSplitGroupStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,kBAAkB,QAAQ,sCAAsC;AACzE,OAAO,MAAMC,2BAA2B,GAAG,gBAAgB;AAC3D,OAAO,MAAMC,wBAAwB,GAAG;EACpCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGP,QAAA;EAAAM,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAuBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,gCAAgC,GAAIC,KAAK,IAAG;EACzD,aAAa;;EACb,MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;EAC1BiB,KAAK,CAAClB,IAAI,CAACoB,SAAS,GAAGzB,YAAY,CAACI,wBAAwB,CAACC,IAAI,EAAEmB,MAAM,CAACnB,IAAI,EAAEkB,KAAK,CAAClB,IAAI,CAACoB,SAAS,CAAC;EACrG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["__styles","mergeClasses","tokens","menuItemClassNames","menuSplitGroupMultilineAttr","menuSplitGroupClassNames","root","useStyles","Bhlrgs3","mc9l5x","rue6gn","oe75ve","Bbblmiw","Bn2ps6a","Bu15iap","B71tm0z","Gjs4sj","foni4y","Ie9k5m","f30fub","Jberyy","d","p","useMenuSplitGroupStyles_unstable","state","styles","className"],"sources":["useMenuSplitGroupStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuSplitGroupMultilineAttr = 'data-multiline';\nexport const menuSplitGroupClassNames = {\n    root: 'fui-MenuSplitGroup'\n};\n/**\n * Styles for the root slot\n * TODO - remove the use of nested combinators to style child menu items\n */ const useStyles = makeStyles({\n    root: {\n        [`[${menuSplitGroupMultilineAttr}]`]: {\n            [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n                alignSelf: 'center'\n            }\n        },\n        display: 'flex',\n        [`& > .${menuItemClassNames.root}:nth-of-type(1)`]: {\n            flex: 1\n        },\n        [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n            borderTopLeftRadius: 0,\n            borderBottomLeftRadius: 0,\n            paddingLeft: 0,\n            '::before': {\n                content: '\"\"',\n                width: tokens.strokeWidthThin,\n                height: '20px',\n                backgroundColor: tokens.colorNeutralStroke1\n            }\n        }\n    }\n});\n/**\n * Apply styling to the MenuSplitGroup slots based on the state\n */ export const useMenuSplitGroupStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,kBAAkB,QAAQ,sCAAsC;AACzE,OAAO,MAAMC,2BAA2B,GAAG,gBAAgB;AAC3D,OAAO,MAAMC,wBAAwB,GAAG;EACpCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGP,QAAA;EAAAM,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAuBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,gCAAgC,GAAIC,KAAK,IAAG;EACzD,aAAa;;EACb,MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;EAC1B;EACAiB,KAAK,CAAClB,IAAI,CAACoB,SAAS,GAAGzB,YAAY,CAACI,wBAAwB,CAACC,IAAI,EAAEmB,MAAM,CAACnB,IAAI,EAAEkB,KAAK,CAAClB,IAAI,CAACoB,SAAS,CAAC;EACrG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.raw.js

@@ -38,6 +38,7 @@ export const menuSplitGroupClassNames = {
  */ export const useMenuSplitGroupStyles_unstable = (state)=>{
     'use no memo';
     const styles = useStyles();
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);
     return state;
 };

package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';\nimport type { MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuSplitGroupMultilineAttr = 'data-multiline';\n\nexport const menuSplitGroupClassNames: SlotClassNames<MenuSplitGroupSlots> = {\n  root: 'fui-MenuSplitGroup',\n};\n/**\n * Styles for the root slot\n * TODO - remove the use of nested combinators to style child menu items\n */\nconst useStyles = makeStyles({\n  root: {\n    [`[${menuSplitGroupMultilineAttr}]`]: {\n      [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n        alignSelf: 'center',\n      },\n    },\n    display: 'flex',\n    [`& > .${menuItemClassNames.root}:nth-of-type(1)`]: {\n      flex: 1,\n    },\n    [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n      borderTopLeftRadius: 0,\n      borderBottomLeftRadius: 0,\n      paddingLeft: 0,\n      '::before': {\n        content: '\"\"',\n        width: tokens.strokeWidthThin,\n        height: '20px',\n        backgroundColor: tokens.colorNeutralStroke1,\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the MenuSplitGroup slots based on the state\n */\nexport const useMenuSplitGroupStyles_unstable = (state: MenuSplitGroupState): MenuSplitGroupState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","menuItemClassNames","menuSplitGroupMultilineAttr","menuSplitGroupClassNames","root","useStyles","alignSelf","display","flex","borderTopLeftRadius","borderBottomLeftRadius","paddingLeft","content","width","strokeWidthThin","height","backgroundColor","colorNeutralStroke1","useMenuSplitGroupStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,kBAAkB,QAAQ,uCAAuC;AAI1E,OAAO,MAAMC,8BAA8B,iBAAiB;AAE5D,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AACF;;;CAGC,GACD,MAAMC,YAAYP,WAAW;IAC3BM,MAAM;QACJ,CAAC,CAAC,CAAC,EAAEF,4BAA4B,CAAC,CAAC,CAAC,EAAE;YACpC,CAAC,CAAC,KAAK,EAAED,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;gBAClDE,WAAW;YACb;QACF;QACAC,SAAS;QACT,CAAC,CAAC,KAAK,EAAEN,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDI,MAAM;QACR;QACA,CAAC,CAAC,KAAK,EAAEP,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDK,qBAAqB;YACrBC,wBAAwB;YACxBC,aAAa;YACb,YAAY;gBACVC,SAAS;gBACTC,OAAOb,OAAOc,eAAe;gBAC7BC,QAAQ;gBACRC,iBAAiBhB,OAAOiB,mBAAmB;YAC7C;QACF;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C;IAEA,MAAMC,SAASf;IACfc,MAAMf,IAAI,CAACiB,SAAS,GAAGtB,aAAaI,yBAAyBC,IAAI,EAAEgB,OAAOhB,IAAI,EAAEe,MAAMf,IAAI,CAACiB,SAAS;IACpG,OAAOF;AACT,EAAE"}
+{"version":3,"sources":["../src/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles.styles';\nimport type { MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuSplitGroupMultilineAttr = 'data-multiline';\n\nexport const menuSplitGroupClassNames: SlotClassNames<MenuSplitGroupSlots> = {\n  root: 'fui-MenuSplitGroup',\n};\n/**\n * Styles for the root slot\n * TODO - remove the use of nested combinators to style child menu items\n */\nconst useStyles = makeStyles({\n  root: {\n    [`[${menuSplitGroupMultilineAttr}]`]: {\n      [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n        alignSelf: 'center',\n      },\n    },\n    display: 'flex',\n    [`& > .${menuItemClassNames.root}:nth-of-type(1)`]: {\n      flex: 1,\n    },\n    [`& > .${menuItemClassNames.root}:nth-of-type(2)`]: {\n      borderTopLeftRadius: 0,\n      borderBottomLeftRadius: 0,\n      paddingLeft: 0,\n      '::before': {\n        content: '\"\"',\n        width: tokens.strokeWidthThin,\n        height: '20px',\n        backgroundColor: tokens.colorNeutralStroke1,\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the MenuSplitGroup slots based on the state\n */\nexport const useMenuSplitGroupStyles_unstable = (state: MenuSplitGroupState): MenuSplitGroupState => {\n  'use no memo';\n\n  const styles = useStyles();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","menuItemClassNames","menuSplitGroupMultilineAttr","menuSplitGroupClassNames","root","useStyles","alignSelf","display","flex","borderTopLeftRadius","borderBottomLeftRadius","paddingLeft","content","width","strokeWidthThin","height","backgroundColor","colorNeutralStroke1","useMenuSplitGroupStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,kBAAkB,QAAQ,uCAAuC;AAI1E,OAAO,MAAMC,8BAA8B,iBAAiB;AAE5D,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AACF;;;CAGC,GACD,MAAMC,YAAYP,WAAW;IAC3BM,MAAM;QACJ,CAAC,CAAC,CAAC,EAAEF,4BAA4B,CAAC,CAAC,CAAC,EAAE;YACpC,CAAC,CAAC,KAAK,EAAED,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;gBAClDE,WAAW;YACb;QACF;QACAC,SAAS;QACT,CAAC,CAAC,KAAK,EAAEN,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDI,MAAM;QACR;QACA,CAAC,CAAC,KAAK,EAAEP,mBAAmBG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;YAClDK,qBAAqB;YACrBC,wBAAwB;YACxBC,aAAa;YACb,YAAY;gBACVC,SAAS;gBACTC,OAAOb,OAAOc,eAAe;gBAC7BC,QAAQ;gBACRC,iBAAiBhB,OAAOiB,mBAAmB;YAC7C;QACF;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C;IAEA,MAAMC,SAASf;IACf,oDAAoD;IACpDc,MAAMf,IAAI,CAACiB,SAAS,GAAGtB,aAAaI,yBAAyBC,IAAI,EAAEgB,OAAOhB,IAAI,EAAEe,MAAMf,IAAI,CAACiB,SAAS;IACpG,OAAOF;AACT,EAAE"}

package/lib/components/MenuTrigger/MenuTrigger.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuTrigger/MenuTrigger.types.ts"],"sourcesContent":["import type { ARIAButtonResultProps, ARIAButtonType } from '@fluentui/react-aria';\nimport type { TriggerProps } from '@fluentui/react-utilities';\nimport type * as React from 'react';\n\nexport type MenuTriggerProps = TriggerProps<MenuTriggerChildProps> & {\n  /**\n   * Disables internal trigger mechanism that ensures a child provided will be a compliant ARIA button.\n   * @default false\n   */\n  disableButtonEnhancement?: boolean;\n};\n\n/**\n * Props that are passed to the child of the MenuTrigger when cloned to ensure correct behaviour for the Menu\n */\nexport type MenuTriggerChildProps<Type extends ARIAButtonType = ARIAButtonType, Props = {}> = ARIAButtonResultProps<\n  Type,\n  Props & {\n    'aria-haspopup'?: 'menu';\n    'aria-expanded'?: boolean;\n    id: string;\n    ref: React.Ref<never>;\n    /* eslint-disable @nx/workspace-consistent-callback-type -- can't change type of existing callback */\n    onMouseEnter: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    onMouseLeave: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    onMouseMove: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    onMouseOver?: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    onContextMenu: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    /* eslint-enable @nx/workspace-consistent-callback-type */\n  }\n>;\n\nexport type MenuTriggerState = {\n  children: React.ReactElement | null;\n  isSubmenu: boolean;\n};\n"],"names":[],"mappings":"AAgCA,WAGE"}
+{"version":3,"sources":["../src/components/MenuTrigger/MenuTrigger.types.ts"],"sourcesContent":["import type { ARIAButtonResultProps, ARIAButtonType } from '@fluentui/react-aria';\nimport type { TriggerProps } from '@fluentui/react-utilities';\nimport type * as React from 'react';\n\nexport type MenuTriggerProps = TriggerProps<MenuTriggerChildProps> & {\n  /**\n   * Disables internal trigger mechanism that ensures a child provided will be a compliant ARIA button.\n   * @default false\n   */\n  disableButtonEnhancement?: boolean;\n};\n\nexport type MenuTriggerBaseProps = MenuTriggerProps & {\n  /**\n   * Optional callback to focus the first focusable element in the menu popover\n   * when an arrow key is pressed on an open submenu trigger.\n   * If omitted, the keyboard handler is a no-op.\n   */\n  focusFirst?: () => void;\n};\n\n/**\n * Props that are passed to the child of the MenuTrigger when cloned to ensure correct behaviour for the Menu\n */\nexport type MenuTriggerChildProps<Type extends ARIAButtonType = ARIAButtonType, Props = {}> = ARIAButtonResultProps<\n  Type,\n  Props & {\n    'aria-haspopup'?: 'menu';\n    'aria-expanded'?: boolean;\n    id: string;\n    ref: React.Ref<never>;\n    /* eslint-disable @nx/workspace-consistent-callback-type -- can't change type of existing callback */\n    onMouseEnter: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    onMouseLeave: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    onMouseMove: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    onMouseOver?: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    onContextMenu: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n    /* eslint-enable @nx/workspace-consistent-callback-type */\n  }\n>;\n\nexport type MenuTriggerState = {\n  children: React.ReactElement | null;\n  isSubmenu: boolean;\n};\n"],"names":[],"mappings":"AAyCA,WAGE"}

package/lib/components/MenuTrigger/index.js

@@ -1,3 +1,3 @@
 export { MenuTrigger } from './MenuTrigger';
 export { renderMenuTrigger_unstable } from './renderMenuTrigger';
-export { useMenuTrigger_unstable } from './useMenuTrigger';
+export { useMenuTrigger_unstable, useMenuTriggerBase_unstable } from './useMenuTrigger';

package/lib/components/MenuTrigger/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuTrigger/index.ts"],"sourcesContent":["export { MenuTrigger } from './MenuTrigger';\nexport type { MenuTriggerChildProps, MenuTriggerProps, MenuTriggerState } from './MenuTrigger.types';\nexport { renderMenuTrigger_unstable } from './renderMenuTrigger';\nexport { useMenuTrigger_unstable } from './useMenuTrigger';\n"],"names":["MenuTrigger","renderMenuTrigger_unstable","useMenuTrigger_unstable"],"mappings":"AAAA,SAASA,WAAW,QAAQ,gBAAgB;AAE5C,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,uBAAuB,QAAQ,mBAAmB"}
+{"version":3,"sources":["../src/components/MenuTrigger/index.ts"],"sourcesContent":["export { MenuTrigger } from './MenuTrigger';\nexport type {\n  MenuTriggerChildProps,\n  MenuTriggerBaseProps,\n  MenuTriggerProps,\n  MenuTriggerState,\n} from './MenuTrigger.types';\nexport { renderMenuTrigger_unstable } from './renderMenuTrigger';\nexport { useMenuTrigger_unstable, useMenuTriggerBase_unstable } from './useMenuTrigger';\n"],"names":["MenuTrigger","renderMenuTrigger_unstable","useMenuTrigger_unstable","useMenuTriggerBase_unstable"],"mappings":"AAAA,SAASA,WAAW,QAAQ,gBAAgB;AAO5C,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,uBAAuB,EAAEC,2BAA2B,QAAQ,mBAAmB"}

package/lib/components/MenuTrigger/useMenuTrigger.js

@@ -13,13 +13,44 @@ function noop() {
 }
 /**
  * Create the state required to render MenuTrigger.
- * Clones the only child component and adds necessary event handling behaviours to open a popup menu
+ * Clones the only child component and adds necessary event handling behaviours to open a popup menu.
+ *
+ * Composes with `useMenuTriggerBase_unstable` and supplies Tabster's `findFirstFocusable`
+ * as the `focusFirst` callback so that submenu-trigger keyboard navigation honours
+ * Tabster movers, focus traps, and other Tabster-managed state.
  *
  * @param props - props from this instance of MenuTrigger
  */ export const useMenuTrigger_unstable = (props)=>{
-    const { children, disableButtonEnhancement = false } = props;
-    const triggerRef = useMenuContext_unstable((context)=>context.triggerRef);
     const menuPopoverRef = useMenuContext_unstable((context)=>context.menuPopoverRef);
+    const { findFirstFocusable } = useFocusFinders();
+    const focusFirst = React.useCallback(()=>{
+        const firstFocusable = findFirstFocusable(menuPopoverRef.current);
+        firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
+    }, [
+        findFirstFocusable,
+        menuPopoverRef
+    ]);
+    return useMenuTriggerBase_unstable({
+        ...props,
+        focusFirst
+    });
+};
+/**
+ * Options accepted by `useMenuTriggerBase_unstable`.
+ */ /**
+ * Base hook for MenuTrigger component, produces state required to render the component.
+ *
+ * Headless: this hook does not import from `@fluentui/react-tabster` and does not
+ * perform any focus discovery on its own. The submenu-already-open arrow-key path
+ * delegates to the optional `options.focusFirst` callback, which lets consumers wire
+ * up whichever focus-finding strategy fits their environment (Tabster, a native DOM
+ * query, a virtual focus manager, etc.). When `focusFirst` is not provided that path
+ * becomes a no-op.
+ *
+ * @public
+ */ export const useMenuTriggerBase_unstable = (props)=>{
+    const { children, disableButtonEnhancement = false, focusFirst } = props;
+    const triggerRef = useMenuContext_unstable((context)=>context.triggerRef);
     const setOpen = useMenuContext_unstable((context)=>context.setOpen);
     const open = useMenuContext_unstable((context)=>context.open);
     const triggerId = useMenuContext_unstable((context)=>context.triggerId);
@@ -30,14 +61,6 @@ function noop() {
         var _ctx_shouldOpenOnArrowRight;
         return (_ctx_shouldOpenOnArrowRight = ctx.shouldOpenOnArrowRight) !== null && _ctx_shouldOpenOnArrowRight !== void 0 ? _ctx_shouldOpenOnArrowRight : true;
     });
-    const { findFirstFocusable } = useFocusFinders();
-    const focusFirst = React.useCallback(()=>{
-        const firstFocusable = findFirstFocusable(menuPopoverRef.current);
-        firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
-    }, [
-        findFirstFocusable,
-        menuPopoverRef
-    ]);
     const openedWithKeyboardRef = React.useRef(false);
     const openedViaSafeZoneRef = React.useRef(false);
     const hasMouseMovedRef = React.useRef(false);
@@ -104,7 +127,7 @@ function noop() {
         }
         // if menu is already open, can't rely on effects to focus
         if (open && key === OpenArrowKey && isSubmenu && shouldOpenOnArrowRight) {
-            focusFirst();
+            focusFirst === null || focusFirst === void 0 ? void 0 : focusFirst();
         }
     };
     const onMouseOver = (event)=>{
@@ -169,14 +192,18 @@ function noop() {
         onMouseEnter: useEventCallback((_child_props_onMouseEnter = child === null || child === void 0 ? void 0 : child.props.onMouseEnter) !== null && _child_props_onMouseEnter !== void 0 ? _child_props_onMouseEnter : noop),
         onMouseLeave: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onMouseLeave, onMouseLeave)),
         onContextMenu: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onContextMenu, onContextMenu)),
+        // eslint-disable-next-line react-hooks/refs
         onMouseMove: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onMouseMove, onMouseMove)),
+        // eslint-disable-next-line react-hooks/refs
         onMouseOver: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onMouseOver, onMouseOver))
     };
     const triggerChildProps = {
         'aria-haspopup': 'menu',
         'aria-expanded': !open && !isSubmenu ? undefined : open,
         ...contextMenuProps,
+        // eslint-disable-next-line react-hooks/refs
         onClick: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onClick, onClick)),
+        // eslint-disable-next-line react-hooks/refs
         onKeyDown: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onKeyDown, onKeyDown))
     };
     const ariaButtonTriggerChildProps = useARIAButtonProps((child === null || child === void 0 ? void 0 : child.type) === 'button' || (child === null || child === void 0 ? void 0 : child.type) === 'a' ? child.type : 'div', triggerChildProps);

package/lib/components/MenuTrigger/useMenuTrigger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MenuTrigger/useMenuTrigger.ts"],"sourcesContent":["'use client';\n\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { ArrowRight, ArrowLeft, Escape, ArrowDown } from '@fluentui/keyboard-keys';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport {\n  applyTriggerPropsToChildren,\n  getTriggerChild,\n  getReactElementRef,\n  isHTMLElement,\n  mergeCallbacks,\n  useEventCallback,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { MenuTriggerProps, MenuTriggerState } from './MenuTrigger.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useIsSubmenu, useOnMenuSafeZoneTimeout } from '../../utils';\n\nfunction noop() {\n  // does nothing\n}\n\n/**\n * Create the state required to render MenuTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup menu\n *\n * @param props - props from this instance of MenuTrigger\n */\nexport const useMenuTrigger_unstable = (props: MenuTriggerProps): MenuTriggerState => {\n  const { children, disableButtonEnhancement = false } = props;\n\n  const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n  const menuPopoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const triggerId = useMenuContext_unstable(context => context.triggerId);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const openOnContext = useMenuContext_unstable(context => context.openOnContext);\n\n  const isSubmenu = useIsSubmenu();\n  const shouldOpenOnArrowRight = useMenuListContext_unstable(ctx => ctx.shouldOpenOnArrowRight ?? true);\n\n  const { findFirstFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, menuPopoverRef]);\n\n  const openedWithKeyboardRef = React.useRef(false);\n  const openedViaSafeZoneRef = React.useRef(false);\n  const hasMouseMovedRef = React.useRef(false);\n\n  const { dir } = useFluent();\n  const OpenArrowKey = dir === 'ltr' ? ArrowRight : ArrowLeft;\n\n  const child = getTriggerChild(children);\n\n  // Heads up!\n  //\n  // Handles an edge case where mouse movement over the menu trigger didn't happen as safe zone blocked pointer events,\n  // but the cursor is already over the menu trigger.\n  const safeZoneHandlerRef = useOnMenuSafeZoneTimeout(\n    useEventCallback(() => {\n      if (isSubmenu) {\n        openedViaSafeZoneRef.current = true;\n      }\n    }),\n  );\n\n  const onContextMenu = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event) || event.isDefaultPrevented()) {\n      return;\n    }\n\n    if (openOnContext) {\n      event.preventDefault();\n      setOpen(event, { open: true, keyboard: false, type: 'menuTriggerContextMenu', event });\n    }\n  };\n\n  const onClick = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n\n    if (!openOnContext) {\n      setOpen(event, { open: !open, keyboard: openedWithKeyboardRef.current, type: 'menuTriggerClick', event });\n      openedWithKeyboardRef.current = false;\n    }\n  };\n\n  const onKeyDown = (event: React.KeyboardEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event) || event.isDefaultPrevented()) {\n      return;\n    }\n\n    const key = event.key;\n\n    if (\n      !openOnContext &&\n      ((isSubmenu && shouldOpenOnArrowRight && key === OpenArrowKey) || (!isSubmenu && key === ArrowDown))\n    ) {\n      setOpen(event, { open: true, keyboard: true, type: 'menuTriggerKeyDown', event });\n    }\n\n    if (key === Escape && !isSubmenu) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuTriggerKeyDown', event });\n    }\n\n    // if menu is already open, can't rely on effects to focus\n    if (open && key === OpenArrowKey && isSubmenu && shouldOpenOnArrowRight) {\n      focusFirst();\n    }\n  };\n\n  const onMouseOver = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n\n    if (openOnHover) {\n      if (hasMouseMovedRef.current) {\n        setOpen(event, { open: true, keyboard: false, type: 'menuTriggerMouseEnter', event });\n      } else if (openedViaSafeZoneRef.current) {\n        setOpen(event, { open: true, keyboard: false, ignoreHoverDelay: true, type: 'menuTriggerMouseEnter', event });\n        openedViaSafeZoneRef.current = false;\n      }\n    }\n  };\n\n  // Opening a menu when a mouse hasn't moved and just entering the trigger is a bad a11y experience\n  // First time open the mouse using mousemove and then continue with mouseenter\n  // Only use once to determine that the user is using the mouse since it is an expensive event to handle\n  const onMouseMove = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n    if (openOnHover && !hasMouseMovedRef.current) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuTriggerMouseMove', event });\n      hasMouseMovedRef.current = true;\n    }\n  };\n\n  const onMouseLeave = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n    if (openOnHover) {\n      setOpen(event, { open: false, keyboard: false, type: 'menuTriggerMouseLeave', event });\n    }\n  };\n\n  const contextMenuProps = {\n    id: triggerId,\n    ...child?.props,\n    ref: useMergedRefs(triggerRef, getReactElementRef(child), safeZoneHandlerRef),\n    onMouseEnter: useEventCallback(child?.props.onMouseEnter ?? noop),\n    onMouseLeave: useEventCallback(mergeCallbacks(child?.props.onMouseLeave, onMouseLeave)),\n    onContextMenu: useEventCallback(mergeCallbacks(child?.props.onContextMenu, onContextMenu)),\n    onMouseMove: useEventCallback(mergeCallbacks(child?.props.onMouseMove, onMouseMove)),\n    onMouseOver: useEventCallback(mergeCallbacks(child?.props.onMouseOver, onMouseOver)),\n  };\n\n  const triggerChildProps = {\n    'aria-haspopup': 'menu',\n    'aria-expanded': !open && !isSubmenu ? undefined : open,\n    ...contextMenuProps,\n    onClick: useEventCallback(mergeCallbacks(child?.props.onClick, onClick)),\n    onKeyDown: useEventCallback(mergeCallbacks(child?.props.onKeyDown, onKeyDown)),\n  } as const;\n\n  const ariaButtonTriggerChildProps = useARIAButtonProps(\n    child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n    triggerChildProps,\n  );\n\n  return {\n    isSubmenu,\n    children: applyTriggerPropsToChildren(\n      children,\n      openOnContext ? contextMenuProps : disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n    ),\n  };\n};\n\nconst isTargetDisabled = (event: React.SyntheticEvent | Event) => {\n  const isDisabled = (el: HTMLElement) =>\n    el.hasAttribute('disabled') || (el.hasAttribute('aria-disabled') && el.getAttribute('aria-disabled') === 'true');\n  if (isHTMLElement(event.target) && isDisabled(event.target)) {\n    return true;\n  }\n\n  return isHTMLElement(event.currentTarget) && isDisabled(event.currentTarget);\n};\n"],"names":["useARIAButtonProps","ArrowRight","ArrowLeft","Escape","ArrowDown","useFluent_unstable","useFluent","useFocusFinders","applyTriggerPropsToChildren","getTriggerChild","getReactElementRef","isHTMLElement","mergeCallbacks","useEventCallback","useMergedRefs","React","useMenuContext_unstable","useMenuListContext_unstable","useIsSubmenu","useOnMenuSafeZoneTimeout","noop","useMenuTrigger_unstable","props","children","disableButtonEnhancement","triggerRef","context","menuPopoverRef","setOpen","open","triggerId","openOnHover","openOnContext","isSubmenu","shouldOpenOnArrowRight","ctx","findFirstFocusable","focusFirst","useCallback","firstFocusable","current","focus","openedWithKeyboardRef","useRef","openedViaSafeZoneRef","hasMouseMovedRef","dir","OpenArrowKey","child","safeZoneHandlerRef","onContextMenu","event","isTargetDisabled","isDefaultPrevented","preventDefault","keyboard","type","onClick","onKeyDown","key","onMouseOver","ignoreHoverDelay","onMouseMove","onMouseLeave","contextMenuProps","id","ref","onMouseEnter","triggerChildProps","undefined","ariaButtonTriggerChildProps","isDisabled","el","hasAttribute","getAttribute","target","currentTarget"],"mappings":"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"}
+{"version":3,"sources":["../src/components/MenuTrigger/useMenuTrigger.ts"],"sourcesContent":["'use client';\n\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { ArrowRight, ArrowLeft, Escape, ArrowDown } from '@fluentui/keyboard-keys';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport {\n  applyTriggerPropsToChildren,\n  getTriggerChild,\n  getReactElementRef,\n  isHTMLElement,\n  mergeCallbacks,\n  useEventCallback,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { MenuTriggerBaseProps, MenuTriggerProps, MenuTriggerState } from './MenuTrigger.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useIsSubmenu, useOnMenuSafeZoneTimeout } from '../../utils';\n\nfunction noop() {\n  // does nothing\n}\n\n/**\n * Create the state required to render MenuTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup menu.\n *\n * Composes with `useMenuTriggerBase_unstable` and supplies Tabster's `findFirstFocusable`\n * as the `focusFirst` callback so that submenu-trigger keyboard navigation honours\n * Tabster movers, focus traps, and other Tabster-managed state.\n *\n * @param props - props from this instance of MenuTrigger\n */\nexport const useMenuTrigger_unstable = (props: MenuTriggerProps): MenuTriggerState => {\n  const menuPopoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n\n  const { findFirstFocusable } = useFocusFinders();\n\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, menuPopoverRef]);\n\n  return useMenuTriggerBase_unstable({ ...props, focusFirst });\n};\n\n/**\n * Options accepted by `useMenuTriggerBase_unstable`.\n */\n\n/**\n * Base hook for MenuTrigger component, produces state required to render the component.\n *\n * Headless: this hook does not import from `@fluentui/react-tabster` and does not\n * perform any focus discovery on its own. The submenu-already-open arrow-key path\n * delegates to the optional `options.focusFirst` callback, which lets consumers wire\n * up whichever focus-finding strategy fits their environment (Tabster, a native DOM\n * query, a virtual focus manager, etc.). When `focusFirst` is not provided that path\n * becomes a no-op.\n *\n * @public\n */\nexport const useMenuTriggerBase_unstable = (props: MenuTriggerBaseProps): MenuTriggerState => {\n  const { children, disableButtonEnhancement = false, focusFirst } = props;\n\n  const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const triggerId = useMenuContext_unstable(context => context.triggerId);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const openOnContext = useMenuContext_unstable(context => context.openOnContext);\n\n  const isSubmenu = useIsSubmenu();\n  const shouldOpenOnArrowRight = useMenuListContext_unstable(ctx => ctx.shouldOpenOnArrowRight ?? true);\n\n  const openedWithKeyboardRef = React.useRef(false);\n  const openedViaSafeZoneRef = React.useRef(false);\n  const hasMouseMovedRef = React.useRef(false);\n\n  const { dir } = useFluent();\n  const OpenArrowKey = dir === 'ltr' ? ArrowRight : ArrowLeft;\n\n  const child = getTriggerChild(children);\n\n  // Heads up!\n  //\n  // Handles an edge case where mouse movement over the menu trigger didn't happen as safe zone blocked pointer events,\n  // but the cursor is already over the menu trigger.\n  const safeZoneHandlerRef = useOnMenuSafeZoneTimeout(\n    useEventCallback(() => {\n      if (isSubmenu) {\n        openedViaSafeZoneRef.current = true;\n      }\n    }),\n  );\n\n  const onContextMenu = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event) || event.isDefaultPrevented()) {\n      return;\n    }\n\n    if (openOnContext) {\n      event.preventDefault();\n      setOpen(event, { open: true, keyboard: false, type: 'menuTriggerContextMenu', event });\n    }\n  };\n\n  const onClick = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n\n    if (!openOnContext) {\n      setOpen(event, { open: !open, keyboard: openedWithKeyboardRef.current, type: 'menuTriggerClick', event });\n      openedWithKeyboardRef.current = false;\n    }\n  };\n\n  const onKeyDown = (event: React.KeyboardEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event) || event.isDefaultPrevented()) {\n      return;\n    }\n\n    const key = event.key;\n\n    if (\n      !openOnContext &&\n      ((isSubmenu && shouldOpenOnArrowRight && key === OpenArrowKey) || (!isSubmenu && key === ArrowDown))\n    ) {\n      setOpen(event, { open: true, keyboard: true, type: 'menuTriggerKeyDown', event });\n    }\n\n    if (key === Escape && !isSubmenu) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuTriggerKeyDown', event });\n    }\n\n    // if menu is already open, can't rely on effects to focus\n    if (open && key === OpenArrowKey && isSubmenu && shouldOpenOnArrowRight) {\n      focusFirst?.();\n    }\n  };\n\n  const onMouseOver = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n\n    if (openOnHover) {\n      if (hasMouseMovedRef.current) {\n        setOpen(event, { open: true, keyboard: false, type: 'menuTriggerMouseEnter', event });\n      } else if (openedViaSafeZoneRef.current) {\n        setOpen(event, { open: true, keyboard: false, ignoreHoverDelay: true, type: 'menuTriggerMouseEnter', event });\n        openedViaSafeZoneRef.current = false;\n      }\n    }\n  };\n\n  // Opening a menu when a mouse hasn't moved and just entering the trigger is a bad a11y experience\n  // First time open the mouse using mousemove and then continue with mouseenter\n  // Only use once to determine that the user is using the mouse since it is an expensive event to handle\n  const onMouseMove = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n    if (openOnHover && !hasMouseMovedRef.current) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuTriggerMouseMove', event });\n      hasMouseMovedRef.current = true;\n    }\n  };\n\n  const onMouseLeave = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n    if (isTargetDisabled(event)) {\n      return;\n    }\n    if (openOnHover) {\n      setOpen(event, { open: false, keyboard: false, type: 'menuTriggerMouseLeave', event });\n    }\n  };\n\n  const contextMenuProps = {\n    id: triggerId,\n    ...child?.props,\n    ref: useMergedRefs(triggerRef, getReactElementRef(child), safeZoneHandlerRef),\n    onMouseEnter: useEventCallback(child?.props.onMouseEnter ?? noop),\n    onMouseLeave: useEventCallback(mergeCallbacks(child?.props.onMouseLeave, onMouseLeave)),\n    onContextMenu: useEventCallback(mergeCallbacks(child?.props.onContextMenu, onContextMenu)),\n    // eslint-disable-next-line react-hooks/refs\n    onMouseMove: useEventCallback(mergeCallbacks(child?.props.onMouseMove, onMouseMove)),\n    // eslint-disable-next-line react-hooks/refs\n    onMouseOver: useEventCallback(mergeCallbacks(child?.props.onMouseOver, onMouseOver)),\n  };\n\n  const triggerChildProps = {\n    'aria-haspopup': 'menu',\n    'aria-expanded': !open && !isSubmenu ? undefined : open,\n    ...contextMenuProps,\n    // eslint-disable-next-line react-hooks/refs\n    onClick: useEventCallback(mergeCallbacks(child?.props.onClick, onClick)),\n    // eslint-disable-next-line react-hooks/refs\n    onKeyDown: useEventCallback(mergeCallbacks(child?.props.onKeyDown, onKeyDown)),\n  } as const;\n\n  const ariaButtonTriggerChildProps = useARIAButtonProps(\n    child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n    triggerChildProps,\n  );\n\n  return {\n    isSubmenu,\n    children: applyTriggerPropsToChildren(\n      children,\n      openOnContext ? contextMenuProps : disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n    ),\n  };\n};\n\nconst isTargetDisabled = (event: React.SyntheticEvent | Event) => {\n  const isDisabled = (el: HTMLElement) =>\n    el.hasAttribute('disabled') || (el.hasAttribute('aria-disabled') && el.getAttribute('aria-disabled') === 'true');\n  if (isHTMLElement(event.target) && isDisabled(event.target)) {\n    return true;\n  }\n\n  return isHTMLElement(event.currentTarget) && isDisabled(event.currentTarget);\n};\n"],"names":["useARIAButtonProps","ArrowRight","ArrowLeft","Escape","ArrowDown","useFluent_unstable","useFluent","useFocusFinders","applyTriggerPropsToChildren","getTriggerChild","getReactElementRef","isHTMLElement","mergeCallbacks","useEventCallback","useMergedRefs","React","useMenuContext_unstable","useMenuListContext_unstable","useIsSubmenu","useOnMenuSafeZoneTimeout","noop","useMenuTrigger_unstable","props","menuPopoverRef","context","findFirstFocusable","focusFirst","useCallback","firstFocusable","current","focus","useMenuTriggerBase_unstable","children","disableButtonEnhancement","triggerRef","setOpen","open","triggerId","openOnHover","openOnContext","isSubmenu","shouldOpenOnArrowRight","ctx","openedWithKeyboardRef","useRef","openedViaSafeZoneRef","hasMouseMovedRef","dir","OpenArrowKey","child","safeZoneHandlerRef","onContextMenu","event","isTargetDisabled","isDefaultPrevented","preventDefault","keyboard","type","onClick","onKeyDown","key","onMouseOver","ignoreHoverDelay","onMouseMove","onMouseLeave","contextMenuProps","id","ref","onMouseEnter","triggerChildProps","undefined","ariaButtonTriggerChildProps","isDisabled","el","hasAttribute","getAttribute","target","currentTarget"],"mappings":"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"}

package/lib/index.js

@@ -2,23 +2,18 @@ export { MenuProvider, useMenuContext_unstable } from './contexts/menuContext';
 export { MenuTriggerContextProvider, useMenuTriggerContext_unstable } from './contexts/menuTriggerContext';
 export { MenuGroupContextProvider, useMenuGroupContext_unstable } from './contexts/menuGroupContext';
 export { MenuListProvider, useMenuListContext_unstable } from './contexts/menuListContext';
-export { Menu, renderMenu_unstable, useMenuContextValues_unstable, useMenu_unstable } from './Menu';
+export { Menu, renderMenu_unstable, useMenuBase_unstable, useMenuContextValues_unstable, useMenu_unstable } from './Menu';
 export { MenuDivider, menuDividerClassNames, renderMenuDivider_unstable, useMenuDividerStyles_unstable, useMenuDivider_unstable } from './MenuDivider';
 export { MenuGroup, menuGroupClassNames, renderMenuGroup_unstable, useMenuGroupContextValues_unstable, useMenuGroupStyles_unstable, useMenuGroup_unstable } from './MenuGroup';
 export { MenuGroupHeader, menuGroupHeaderClassNames, renderMenuGroupHeader_unstable, useMenuGroupHeaderStyles_unstable, useMenuGroupHeader_unstable } from './MenuGroupHeader';
-export { MenuItem, menuItemClassNames, renderMenuItem_unstable, useMenuItemStyles_unstable, useMenuItem_unstable } from './MenuItem';
-export { MenuItemCheckbox, menuItemCheckboxClassNames, renderMenuItemCheckbox_unstable, useMenuItemCheckboxStyles_unstable, useMenuItemCheckbox_unstable } from './MenuItemCheckbox';
-export { MenuItemRadio, menuItemRadioClassNames, renderMenuItemRadio_unstable, useMenuItemRadioStyles_unstable, useMenuItemRadio_unstable } from './MenuItemRadio';
-export { MenuList, menuListClassNames, renderMenuList_unstable, useMenuListContextValues_unstable, useMenuListStyles_unstable, useMenuList_unstable } from './MenuList';
-export { MenuPopover, menuPopoverClassNames, renderMenuPopover_unstable, useMenuPopoverStyles_unstable, useMenuPopover_unstable } from './MenuPopover';
+export { MenuItem, menuItemClassNames, renderMenuItem_unstable, useMenuItemBase_unstable, useMenuItemStyles_unstable, useMenuItem_unstable } from './MenuItem';
+export { MenuItemCheckbox, menuItemCheckboxClassNames, renderMenuItemCheckbox_unstable, useMenuItemCheckboxBase_unstable, useMenuItemCheckboxStyles_unstable, useMenuItemCheckbox_unstable } from './MenuItemCheckbox';
+export { MenuItemRadio, menuItemRadioClassNames, renderMenuItemRadio_unstable, useMenuItemRadioBase_unstable, useMenuItemRadioStyles_unstable, useMenuItemRadio_unstable } from './MenuItemRadio';
+export { MenuList, menuListClassNames, renderMenuList_unstable, useMenuListBase_unstable, useMenuListContextValues_unstable, useMenuListStyles_unstable, useMenuList_unstable } from './MenuList';
+export { MenuPopover, menuPopoverClassNames, renderMenuPopover_unstable, useMenuPopoverBase_unstable, useMenuPopoverStyles_unstable, useMenuPopover_unstable } from './MenuPopover';
 export { MenuSplitGroup, menuSplitGroupClassNames, renderMenuSplitGroup_unstable, useMenuSplitGroupStyles_unstable, useMenuSplitGroup_unstable } from './MenuSplitGroup';
-export { MenuTrigger, renderMenuTrigger_unstable, useMenuTrigger_unstable } from './MenuTrigger';
+export { MenuTrigger, renderMenuTrigger_unstable, useMenuTrigger_unstable, useMenuTriggerBase_unstable } from './MenuTrigger';
 export { useCheckmarkStyles_unstable } from './selectable/index';
-export { MenuItemLink, menuItemLinkClassNames, renderMenuItemLink_unstable, useMenuItemLinkStyles_unstable, useMenuItemLink_unstable } from './MenuItemLink';
+export { MenuItemLink, menuItemLinkClassNames, renderMenuItemLink_unstable, useMenuItemLinkBase_unstable, useMenuItemLinkStyles_unstable, useMenuItemLink_unstable } from './MenuItemLink';
 export { MENU_ENTER_EVENT, dispatchMenuEnterEvent, useOnMenuMouseEnter } from './utils';
-export { MenuItemSwitch, useMenuItemSwitch_unstable, useMenuItemSwitchStyles_unstable, renderMenuItemSwitch_unstable, menuItemSwitchClassNames } from './MenuItemSwitch';
- // Experimental: Base hooks - will be enabled in the experimental release branch
- // export { useMenuItemBase_unstable } from './MenuItem';
- // export { useMenuItemCheckboxBase_unstable } from './MenuItemCheckbox';
- // export { useMenuItemRadioBase_unstable } from './MenuItemRadio';
- // export { useMenuItemSwitchBase_unstable } from './MenuItemSwitch';
+export { MenuItemSwitch, menuItemSwitchClassNames, renderMenuItemSwitch_unstable, useMenuItemSwitchBase_unstable, useMenuItemSwitchStyles_unstable, useMenuItemSwitch_unstable } from './MenuItemSwitch';

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { MenuProvider, useMenuContext_unstable } from './contexts/menuContext';\nexport type { MenuContextValue } from './contexts/menuContext';\nexport { MenuTriggerContextProvider, useMenuTriggerContext_unstable } from './contexts/menuTriggerContext';\nexport { MenuGroupContextProvider, useMenuGroupContext_unstable } from './contexts/menuGroupContext';\nexport type { MenuGroupContextValue } from './contexts/menuGroupContext';\nexport { MenuListProvider, useMenuListContext_unstable } from './contexts/menuListContext';\nexport type { MenuListContextValue } from './contexts/menuListContext';\n\nexport { Menu, renderMenu_unstable, useMenuContextValues_unstable, useMenu_unstable } from './Menu';\nexport type {\n  MenuContextValues,\n  MenuOpenChangeData,\n  MenuOpenEvent,\n  // MenuOpenEvents is deprecated but removing it would be a breaking change\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  MenuOpenEvents,\n  MenuProps,\n  MenuSlots,\n  MenuState,\n} from './Menu';\nexport {\n  MenuDivider,\n  menuDividerClassNames,\n  renderMenuDivider_unstable,\n  useMenuDividerStyles_unstable,\n  useMenuDivider_unstable,\n} from './MenuDivider';\nexport type { MenuDividerProps, MenuDividerSlots, MenuDividerState } from './MenuDivider';\nexport {\n  MenuGroup,\n  menuGroupClassNames,\n  renderMenuGroup_unstable,\n  useMenuGroupContextValues_unstable,\n  useMenuGroupStyles_unstable,\n  useMenuGroup_unstable,\n} from './MenuGroup';\nexport type { MenuGroupContextValues, MenuGroupProps, MenuGroupSlots, MenuGroupState } from './MenuGroup';\nexport {\n  MenuGroupHeader,\n  menuGroupHeaderClassNames,\n  renderMenuGroupHeader_unstable,\n  useMenuGroupHeaderStyles_unstable,\n  useMenuGroupHeader_unstable,\n} from './MenuGroupHeader';\nexport type { MenuGroupHeaderProps, MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader';\nexport {\n  MenuItem,\n  menuItemClassNames,\n  renderMenuItem_unstable,\n  useMenuItemStyles_unstable,\n  useMenuItem_unstable,\n} from './MenuItem';\nexport type { MenuItemProps, MenuItemSlots, MenuItemState } from './MenuItem';\nexport {\n  MenuItemCheckbox,\n  menuItemCheckboxClassNames,\n  renderMenuItemCheckbox_unstable,\n  useMenuItemCheckboxStyles_unstable,\n  useMenuItemCheckbox_unstable,\n} from './MenuItemCheckbox';\nexport type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox';\nexport {\n  MenuItemRadio,\n  menuItemRadioClassNames,\n  renderMenuItemRadio_unstable,\n  useMenuItemRadioStyles_unstable,\n  useMenuItemRadio_unstable,\n} from './MenuItemRadio';\nexport type { MenuItemRadioProps, MenuItemRadioState } from './MenuItemRadio';\nexport {\n  MenuList,\n  menuListClassNames,\n  renderMenuList_unstable,\n  useMenuListContextValues_unstable,\n  useMenuListStyles_unstable,\n  useMenuList_unstable,\n} from './MenuList';\nexport type {\n  MenuCheckedValueChangeData,\n  MenuCheckedValueChangeEvent,\n  MenuListContextValues,\n  MenuListProps,\n  MenuListSlots,\n  MenuListState,\n  // UninitializedMenuListState is deprecated but removing it would be a breaking change\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  UninitializedMenuListState,\n} from './MenuList';\nexport {\n  MenuPopover,\n  menuPopoverClassNames,\n  renderMenuPopover_unstable,\n  useMenuPopoverStyles_unstable,\n  useMenuPopover_unstable,\n} from './MenuPopover';\nexport type { MenuPopoverProps, MenuPopoverSlots, MenuPopoverState } from './MenuPopover';\nexport {\n  MenuSplitGroup,\n  menuSplitGroupClassNames,\n  renderMenuSplitGroup_unstable,\n  useMenuSplitGroupStyles_unstable,\n  useMenuSplitGroup_unstable,\n} from './MenuSplitGroup';\nexport type { MenuSplitGroupProps, MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup';\nexport { MenuTrigger, renderMenuTrigger_unstable, useMenuTrigger_unstable } from './MenuTrigger';\nexport type { MenuTriggerChildProps, MenuTriggerProps, MenuTriggerState } from './MenuTrigger';\n\nexport { useCheckmarkStyles_unstable } from './selectable/index';\nexport type { MenuItemSelectableProps, MenuItemSelectableState, SelectableHandler } from './selectable/index';\n\nexport {\n  MenuItemLink,\n  menuItemLinkClassNames,\n  renderMenuItemLink_unstable,\n  useMenuItemLinkStyles_unstable,\n  useMenuItemLink_unstable,\n} from './MenuItemLink';\nexport type { MenuItemLinkProps, MenuItemLinkSlots, MenuItemLinkState } from './MenuItemLink';\n\nexport { MENU_ENTER_EVENT, dispatchMenuEnterEvent, useOnMenuMouseEnter } from './utils';\nexport {\n  MenuItemSwitch,\n  useMenuItemSwitch_unstable,\n  useMenuItemSwitchStyles_unstable,\n  renderMenuItemSwitch_unstable,\n  menuItemSwitchClassNames,\n} from './MenuItemSwitch';\n\nexport type { MenuItemSwitchProps, MenuItemSwitchState, MenuItemSwitchSlots } from './MenuItemSwitch';\n\n// Experimental: Base hooks - will be enabled in the experimental release branch\n// export { useMenuItemBase_unstable } from './MenuItem';\n// export { useMenuItemCheckboxBase_unstable } from './MenuItemCheckbox';\n// export { useMenuItemRadioBase_unstable } from './MenuItemRadio';\n// export { useMenuItemSwitchBase_unstable } from './MenuItemSwitch';\n"],"names":["MenuProvider","useMenuContext_unstable","MenuTriggerContextProvider","useMenuTriggerContext_unstable","MenuGroupContextProvider","useMenuGroupContext_unstable","MenuListProvider","useMenuListContext_unstable","Menu","renderMenu_unstable","useMenuContextValues_unstable","useMenu_unstable","MenuDivider","menuDividerClassNames","renderMenuDivider_unstable","useMenuDividerStyles_unstable","useMenuDivider_unstable","MenuGroup","menuGroupClassNames","renderMenuGroup_unstable","useMenuGroupContextValues_unstable","useMenuGroupStyles_unstable","useMenuGroup_unstable","MenuGroupHeader","menuGroupHeaderClassNames","renderMenuGroupHeader_unstable","useMenuGroupHeaderStyles_unstable","useMenuGroupHeader_unstable","MenuItem","menuItemClassNames","renderMenuItem_unstable","useMenuItemStyles_unstable","useMenuItem_unstable","MenuItemCheckbox","menuItemCheckboxClassNames","renderMenuItemCheckbox_unstable","useMenuItemCheckboxStyles_unstable","useMenuItemCheckbox_unstable","MenuItemRadio","menuItemRadioClassNames","renderMenuItemRadio_unstable","useMenuItemRadioStyles_unstable","useMenuItemRadio_unstable","MenuList","menuListClassNames","renderMenuList_unstable","useMenuListContextValues_unstable","useMenuListStyles_unstable","useMenuList_unstable","MenuPopover","menuPopoverClassNames","renderMenuPopover_unstable","useMenuPopoverStyles_unstable","useMenuPopover_unstable","MenuSplitGroup","menuSplitGroupClassNames","renderMenuSplitGroup_unstable","useMenuSplitGroupStyles_unstable","useMenuSplitGroup_unstable","MenuTrigger","renderMenuTrigger_unstable","useMenuTrigger_unstable","useCheckmarkStyles_unstable","MenuItemLink","menuItemLinkClassNames","renderMenuItemLink_unstable","useMenuItemLinkStyles_unstable","useMenuItemLink_unstable","MENU_ENTER_EVENT","dispatchMenuEnterEvent","useOnMenuMouseEnter","MenuItemSwitch","useMenuItemSwitch_unstable","useMenuItemSwitchStyles_unstable","renderMenuItemSwitch_unstable","menuItemSwitchClassNames"],"mappings":"AAAA,SAASA,YAAY,EAAEC,uBAAuB,QAAQ,yBAAyB;AAE/E,SAASC,0BAA0B,EAAEC,8BAA8B,QAAQ,gCAAgC;AAC3G,SAASC,wBAAwB,EAAEC,4BAA4B,QAAQ,8BAA8B;AAErG,SAASC,gBAAgB,EAAEC,2BAA2B,QAAQ,6BAA6B;AAG3F,SAASC,IAAI,EAAEC,mBAAmB,EAAEC,6BAA6B,EAAEC,gBAAgB,QAAQ,SAAS;AAYpG,SACEC,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,6BAA6B,EAC7BC,uBAAuB,QAClB,gBAAgB;AAEvB,SACEC,SAAS,EACTC,mBAAmB,EACnBC,wBAAwB,EACxBC,kCAAkC,EAClCC,2BAA2B,EAC3BC,qBAAqB,QAChB,cAAc;AAErB,SACEC,eAAe,EACfC,yBAAyB,EACzBC,8BAA8B,EAC9BC,iCAAiC,EACjCC,2BAA2B,QACtB,oBAAoB;AAE3B,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAEpB,SACEC,gBAAgB,EAChBC,0BAA0B,EAC1BC,+BAA+B,EAC/BC,kCAAkC,EAClCC,4BAA4B,QACvB,qBAAqB;AAE5B,SACEC,aAAa,EACbC,uBAAuB,EACvBC,4BAA4B,EAC5BC,+BAA+B,EAC/BC,yBAAyB,QACpB,kBAAkB;AAEzB,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,iCAAiC,EACjCC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAYpB,SACEC,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,6BAA6B,EAC7BC,uBAAuB,QAClB,gBAAgB;AAEvB,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,QACrB,mBAAmB;AAE1B,SAASC,WAAW,EAAEC,0BAA0B,EAAEC,uBAAuB,QAAQ,gBAAgB;AAGjG,SAASC,2BAA2B,QAAQ,qBAAqB;AAGjE,SACEC,YAAY,EACZC,sBAAsB,EACtBC,2BAA2B,EAC3BC,8BAA8B,EAC9BC,wBAAwB,QACnB,iBAAiB;AAGxB,SAASC,gBAAgB,EAAEC,sBAAsB,EAAEC,mBAAmB,QAAQ,UAAU;AACxF,SACEC,cAAc,EACdC,0BAA0B,EAC1BC,gCAAgC,EAChCC,6BAA6B,EAC7BC,wBAAwB,QACnB,mBAAmB;CAI1B,gFAAgF;CAChF,yDAAyD;CACzD,yEAAyE;CACzE,mEAAmE;CACnE,qEAAqE"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { MenuProvider, useMenuContext_unstable } from './contexts/menuContext';\nexport type { MenuContextValue } from './contexts/menuContext';\nexport { MenuTriggerContextProvider, useMenuTriggerContext_unstable } from './contexts/menuTriggerContext';\nexport { MenuGroupContextProvider, useMenuGroupContext_unstable } from './contexts/menuGroupContext';\nexport type { MenuGroupContextValue } from './contexts/menuGroupContext';\nexport { MenuListProvider, useMenuListContext_unstable } from './contexts/menuListContext';\nexport type { MenuListContextValue } from './contexts/menuListContext';\n\nexport {\n  Menu,\n  renderMenu_unstable,\n  useMenuBase_unstable,\n  useMenuContextValues_unstable,\n  useMenu_unstable,\n} from './Menu';\nexport type {\n  MenuBaseProps,\n  MenuBaseState,\n  MenuContextValues,\n  MenuOpenChangeData,\n  MenuOpenEvent,\n  // MenuOpenEvents is deprecated but removing it would be a breaking change\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  MenuOpenEvents,\n  MenuProps,\n  MenuSlots,\n  MenuState,\n} from './Menu';\nexport {\n  MenuDivider,\n  menuDividerClassNames,\n  renderMenuDivider_unstable,\n  useMenuDividerStyles_unstable,\n  useMenuDivider_unstable,\n} from './MenuDivider';\nexport type { MenuDividerProps, MenuDividerSlots, MenuDividerState } from './MenuDivider';\nexport {\n  MenuGroup,\n  menuGroupClassNames,\n  renderMenuGroup_unstable,\n  useMenuGroupContextValues_unstable,\n  useMenuGroupStyles_unstable,\n  useMenuGroup_unstable,\n} from './MenuGroup';\nexport type { MenuGroupContextValues, MenuGroupProps, MenuGroupSlots, MenuGroupState } from './MenuGroup';\nexport {\n  MenuGroupHeader,\n  menuGroupHeaderClassNames,\n  renderMenuGroupHeader_unstable,\n  useMenuGroupHeaderStyles_unstable,\n  useMenuGroupHeader_unstable,\n} from './MenuGroupHeader';\nexport type { MenuGroupHeaderProps, MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader';\nexport {\n  MenuItem,\n  menuItemClassNames,\n  renderMenuItem_unstable,\n  useMenuItemBase_unstable,\n  useMenuItemStyles_unstable,\n  useMenuItem_unstable,\n} from './MenuItem';\nexport type { MenuItemProps, MenuItemSlots, MenuItemState } from './MenuItem';\nexport {\n  MenuItemCheckbox,\n  menuItemCheckboxClassNames,\n  renderMenuItemCheckbox_unstable,\n  useMenuItemCheckboxBase_unstable,\n  useMenuItemCheckboxStyles_unstable,\n  useMenuItemCheckbox_unstable,\n} from './MenuItemCheckbox';\nexport type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox';\nexport {\n  MenuItemRadio,\n  menuItemRadioClassNames,\n  renderMenuItemRadio_unstable,\n  useMenuItemRadioBase_unstable,\n  useMenuItemRadioStyles_unstable,\n  useMenuItemRadio_unstable,\n} from './MenuItemRadio';\nexport type {\n  MenuItemRadioBaseProps,\n  MenuItemRadioBaseState,\n  MenuItemRadioProps,\n  MenuItemRadioState,\n} from './MenuItemRadio';\nexport {\n  MenuList,\n  menuListClassNames,\n  renderMenuList_unstable,\n  useMenuListBase_unstable,\n  useMenuListContextValues_unstable,\n  useMenuListStyles_unstable,\n  useMenuList_unstable,\n} from './MenuList';\nexport type {\n  MenuCheckedValueChangeData,\n  MenuCheckedValueChangeEvent,\n  MenuListContextValues,\n  MenuListProps,\n  MenuListSlots,\n  MenuListState,\n  // UninitializedMenuListState is deprecated but removing it would be a breaking change\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  UninitializedMenuListState,\n} from './MenuList';\nexport {\n  MenuPopover,\n  menuPopoverClassNames,\n  renderMenuPopover_unstable,\n  useMenuPopoverBase_unstable,\n  useMenuPopoverStyles_unstable,\n  useMenuPopover_unstable,\n} from './MenuPopover';\nexport type { MenuPopoverProps, MenuPopoverSlots, MenuPopoverState } from './MenuPopover';\nexport {\n  MenuSplitGroup,\n  menuSplitGroupClassNames,\n  renderMenuSplitGroup_unstable,\n  useMenuSplitGroupStyles_unstable,\n  useMenuSplitGroup_unstable,\n} from './MenuSplitGroup';\nexport type { MenuSplitGroupProps, MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup';\nexport {\n  MenuTrigger,\n  renderMenuTrigger_unstable,\n  useMenuTrigger_unstable,\n  useMenuTriggerBase_unstable,\n} from './MenuTrigger';\nexport type { MenuTriggerChildProps, MenuTriggerProps, MenuTriggerState, MenuTriggerBaseProps } from './MenuTrigger';\n\nexport { useCheckmarkStyles_unstable } from './selectable/index';\nexport type { MenuItemSelectableProps, MenuItemSelectableState, SelectableHandler } from './selectable/index';\n\nexport {\n  MenuItemLink,\n  menuItemLinkClassNames,\n  renderMenuItemLink_unstable,\n  useMenuItemLinkBase_unstable,\n  useMenuItemLinkStyles_unstable,\n  useMenuItemLink_unstable,\n} from './MenuItemLink';\nexport type { MenuItemLinkProps, MenuItemLinkSlots, MenuItemLinkState } from './MenuItemLink';\n\nexport { MENU_ENTER_EVENT, dispatchMenuEnterEvent, useOnMenuMouseEnter } from './utils';\nexport {\n  MenuItemSwitch,\n  menuItemSwitchClassNames,\n  renderMenuItemSwitch_unstable,\n  useMenuItemSwitchBase_unstable,\n  useMenuItemSwitchStyles_unstable,\n  useMenuItemSwitch_unstable,\n} from './MenuItemSwitch';\n\nexport type { MenuItemSwitchProps, MenuItemSwitchSlots, MenuItemSwitchState } from './MenuItemSwitch';\n"],"names":["MenuProvider","useMenuContext_unstable","MenuTriggerContextProvider","useMenuTriggerContext_unstable","MenuGroupContextProvider","useMenuGroupContext_unstable","MenuListProvider","useMenuListContext_unstable","Menu","renderMenu_unstable","useMenuBase_unstable","useMenuContextValues_unstable","useMenu_unstable","MenuDivider","menuDividerClassNames","renderMenuDivider_unstable","useMenuDividerStyles_unstable","useMenuDivider_unstable","MenuGroup","menuGroupClassNames","renderMenuGroup_unstable","useMenuGroupContextValues_unstable","useMenuGroupStyles_unstable","useMenuGroup_unstable","MenuGroupHeader","menuGroupHeaderClassNames","renderMenuGroupHeader_unstable","useMenuGroupHeaderStyles_unstable","useMenuGroupHeader_unstable","MenuItem","menuItemClassNames","renderMenuItem_unstable","useMenuItemBase_unstable","useMenuItemStyles_unstable","useMenuItem_unstable","MenuItemCheckbox","menuItemCheckboxClassNames","renderMenuItemCheckbox_unstable","useMenuItemCheckboxBase_unstable","useMenuItemCheckboxStyles_unstable","useMenuItemCheckbox_unstable","MenuItemRadio","menuItemRadioClassNames","renderMenuItemRadio_unstable","useMenuItemRadioBase_unstable","useMenuItemRadioStyles_unstable","useMenuItemRadio_unstable","MenuList","menuListClassNames","renderMenuList_unstable","useMenuListBase_unstable","useMenuListContextValues_unstable","useMenuListStyles_unstable","useMenuList_unstable","MenuPopover","menuPopoverClassNames","renderMenuPopover_unstable","useMenuPopoverBase_unstable","useMenuPopoverStyles_unstable","useMenuPopover_unstable","MenuSplitGroup","menuSplitGroupClassNames","renderMenuSplitGroup_unstable","useMenuSplitGroupStyles_unstable","useMenuSplitGroup_unstable","MenuTrigger","renderMenuTrigger_unstable","useMenuTrigger_unstable","useMenuTriggerBase_unstable","useCheckmarkStyles_unstable","MenuItemLink","menuItemLinkClassNames","renderMenuItemLink_unstable","useMenuItemLinkBase_unstable","useMenuItemLinkStyles_unstable","useMenuItemLink_unstable","MENU_ENTER_EVENT","dispatchMenuEnterEvent","useOnMenuMouseEnter","MenuItemSwitch","menuItemSwitchClassNames","renderMenuItemSwitch_unstable","useMenuItemSwitchBase_unstable","useMenuItemSwitchStyles_unstable","useMenuItemSwitch_unstable"],"mappings":"AAAA,SAASA,YAAY,EAAEC,uBAAuB,QAAQ,yBAAyB;AAE/E,SAASC,0BAA0B,EAAEC,8BAA8B,QAAQ,gCAAgC;AAC3G,SAASC,wBAAwB,EAAEC,4BAA4B,QAAQ,8BAA8B;AAErG,SAASC,gBAAgB,EAAEC,2BAA2B,QAAQ,6BAA6B;AAG3F,SACEC,IAAI,EACJC,mBAAmB,EACnBC,oBAAoB,EACpBC,6BAA6B,EAC7BC,gBAAgB,QACX,SAAS;AAchB,SACEC,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,6BAA6B,EAC7BC,uBAAuB,QAClB,gBAAgB;AAEvB,SACEC,SAAS,EACTC,mBAAmB,EACnBC,wBAAwB,EACxBC,kCAAkC,EAClCC,2BAA2B,EAC3BC,qBAAqB,QAChB,cAAc;AAErB,SACEC,eAAe,EACfC,yBAAyB,EACzBC,8BAA8B,EAC9BC,iCAAiC,EACjCC,2BAA2B,QACtB,oBAAoB;AAE3B,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,wBAAwB,EACxBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAEpB,SACEC,gBAAgB,EAChBC,0BAA0B,EAC1BC,+BAA+B,EAC/BC,gCAAgC,EAChCC,kCAAkC,EAClCC,4BAA4B,QACvB,qBAAqB;AAE5B,SACEC,aAAa,EACbC,uBAAuB,EACvBC,4BAA4B,EAC5BC,6BAA6B,EAC7BC,+BAA+B,EAC/BC,yBAAyB,QACpB,kBAAkB;AAOzB,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,wBAAwB,EACxBC,iCAAiC,EACjCC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAYpB,SACEC,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,2BAA2B,EAC3BC,6BAA6B,EAC7BC,uBAAuB,QAClB,gBAAgB;AAEvB,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,QACrB,mBAAmB;AAE1B,SACEC,WAAW,EACXC,0BAA0B,EAC1BC,uBAAuB,EACvBC,2BAA2B,QACtB,gBAAgB;AAGvB,SAASC,2BAA2B,QAAQ,qBAAqB;AAGjE,SACEC,YAAY,EACZC,sBAAsB,EACtBC,2BAA2B,EAC3BC,4BAA4B,EAC5BC,8BAA8B,EAC9BC,wBAAwB,QACnB,iBAAiB;AAGxB,SAASC,gBAAgB,EAAEC,sBAAsB,EAAEC,mBAAmB,QAAQ,UAAU;AACxF,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,8BAA8B,EAC9BC,gCAAgC,EAChCC,0BAA0B,QACrB,mBAAmB"}