@fluentui/react-menu 9.23.1 → 9.24.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (93) hide show
  1. package/CHANGELOG.md +29 -2
  2. package/dist/index.d.ts +13 -5
  3. package/lib/components/Menu/Menu.js +0 -1
  4. package/lib/components/Menu/Menu.js.map +1 -1
  5. package/lib/components/Menu/Menu.types.js +3 -1
  6. package/lib/components/Menu/Menu.types.js.map +1 -1
  7. package/lib/components/Menu/useMenuContextValues.js +21 -3
  8. package/lib/components/Menu/useMenuContextValues.js.map +1 -1
  9. package/lib/components/MenuDivider/renderMenuDivider.js.map +1 -1
  10. package/lib/components/MenuDivider/useMenuDivider.js +0 -1
  11. package/lib/components/MenuDivider/useMenuDivider.js.map +1 -1
  12. package/lib/components/MenuGroup/renderMenuGroup.js.map +1 -1
  13. package/lib/components/MenuGroup/useMenuGroup.js +0 -1
  14. package/lib/components/MenuGroup/useMenuGroup.js.map +1 -1
  15. package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js.map +1 -1
  16. package/lib/components/MenuGroupHeader/useMenuGroupHeader.js +0 -1
  17. package/lib/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
  18. package/lib/components/MenuItem/useCharacterSearch.js +0 -1
  19. package/lib/components/MenuItem/useCharacterSearch.js.map +1 -1
  20. package/lib/components/MenuItem/useMenuItem.js.map +1 -1
  21. package/lib/components/MenuItemLink/MenuItemLink.types.js.map +1 -1
  22. package/lib/components/MenuItemLink/useMenuItemLink.js +0 -1
  23. package/lib/components/MenuItemLink/useMenuItemLink.js.map +1 -1
  24. package/lib/components/MenuItemLink/useMenuItemLinkStyles.styles.raw.js.map +1 -1
  25. package/lib/components/MenuItemSwitch/MenuItemSwitch.types.js.map +1 -1
  26. package/lib/components/MenuList/MenuList.types.js +3 -1
  27. package/lib/components/MenuList/MenuList.types.js.map +1 -1
  28. package/lib/components/MenuList/renderMenuList.js.map +1 -1
  29. package/lib/components/MenuList/useMenuListContextValues.js +11 -3
  30. package/lib/components/MenuList/useMenuListContextValues.js.map +1 -1
  31. package/lib/components/MenuPopover/MenuPopover.types.js +3 -1
  32. package/lib/components/MenuPopover/MenuPopover.types.js.map +1 -1
  33. package/lib/components/MenuPopover/renderMenuPopover.js.map +1 -1
  34. package/lib/components/MenuPopover/useMenuPopover.js +6 -1
  35. package/lib/components/MenuPopover/useMenuPopover.js.map +1 -1
  36. package/lib/components/MenuSplitGroup/MenuSplitGroup.types.js.map +1 -1
  37. package/lib/components/MenuSplitGroup/useMenuSplitGroupContextValues.js.map +1 -1
  38. package/lib/components/MenuTrigger/MenuTrigger.js +0 -1
  39. package/lib/components/MenuTrigger/MenuTrigger.js.map +1 -1
  40. package/lib/components/MenuTrigger/MenuTrigger.types.js +1 -1
  41. package/lib/components/MenuTrigger/MenuTrigger.types.js.map +1 -1
  42. package/lib/contexts/menuContext.js +0 -1
  43. package/lib/contexts/menuContext.js.map +1 -1
  44. package/lib/contexts/menuListContext.js +0 -1
  45. package/lib/contexts/menuListContext.js.map +1 -1
  46. package/lib/selectable/types.js +3 -1
  47. package/lib/selectable/types.js.map +1 -1
  48. package/lib-commonjs/components/Menu/Menu.js +0 -2
  49. package/lib-commonjs/components/Menu/Menu.js.map +1 -1
  50. package/lib-commonjs/components/Menu/Menu.types.js +3 -3
  51. package/lib-commonjs/components/Menu/Menu.types.js.map +1 -1
  52. package/lib-commonjs/components/Menu/useMenuContextValues.js +22 -3
  53. package/lib-commonjs/components/Menu/useMenuContextValues.js.map +1 -1
  54. package/lib-commonjs/components/MenuDivider/renderMenuDivider.js.map +1 -1
  55. package/lib-commonjs/components/MenuDivider/useMenuDivider.js +0 -2
  56. package/lib-commonjs/components/MenuDivider/useMenuDivider.js.map +1 -1
  57. package/lib-commonjs/components/MenuGroup/renderMenuGroup.js.map +1 -1
  58. package/lib-commonjs/components/MenuGroup/useMenuGroup.js +0 -2
  59. package/lib-commonjs/components/MenuGroup/useMenuGroup.js.map +1 -1
  60. package/lib-commonjs/components/MenuGroupHeader/renderMenuGroupHeader.js.map +1 -1
  61. package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.js +0 -2
  62. package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
  63. package/lib-commonjs/components/MenuItem/useCharacterSearch.js +0 -2
  64. package/lib-commonjs/components/MenuItem/useCharacterSearch.js.map +1 -1
  65. package/lib-commonjs/components/MenuItem/useMenuItem.js.map +1 -1
  66. package/lib-commonjs/components/MenuItemLink/MenuItemLink.types.js.map +1 -1
  67. package/lib-commonjs/components/MenuItemLink/useMenuItemLink.js +0 -2
  68. package/lib-commonjs/components/MenuItemLink/useMenuItemLink.js.map +1 -1
  69. package/lib-commonjs/components/MenuItemLink/useMenuItemLinkStyles.styles.raw.js.map +1 -1
  70. package/lib-commonjs/components/MenuItemSwitch/MenuItemSwitch.types.js.map +1 -1
  71. package/lib-commonjs/components/MenuList/MenuList.types.js +3 -3
  72. package/lib-commonjs/components/MenuList/MenuList.types.js.map +1 -1
  73. package/lib-commonjs/components/MenuList/renderMenuList.js.map +1 -1
  74. package/lib-commonjs/components/MenuList/useMenuListContextValues.js +12 -3
  75. package/lib-commonjs/components/MenuList/useMenuListContextValues.js.map +1 -1
  76. package/lib-commonjs/components/MenuPopover/MenuPopover.types.js +3 -3
  77. package/lib-commonjs/components/MenuPopover/MenuPopover.types.js.map +1 -1
  78. package/lib-commonjs/components/MenuPopover/renderMenuPopover.js.map +1 -1
  79. package/lib-commonjs/components/MenuPopover/useMenuPopover.js +6 -1
  80. package/lib-commonjs/components/MenuPopover/useMenuPopover.js.map +1 -1
  81. package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.js.map +1 -1
  82. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupContextValues.js.map +1 -1
  83. package/lib-commonjs/components/MenuTrigger/MenuTrigger.js +0 -2
  84. package/lib-commonjs/components/MenuTrigger/MenuTrigger.js.map +1 -1
  85. package/lib-commonjs/components/MenuTrigger/MenuTrigger.types.js +0 -2
  86. package/lib-commonjs/components/MenuTrigger/MenuTrigger.types.js.map +1 -1
  87. package/lib-commonjs/contexts/menuContext.js +0 -2
  88. package/lib-commonjs/contexts/menuContext.js.map +1 -1
  89. package/lib-commonjs/contexts/menuListContext.js +0 -2
  90. package/lib-commonjs/contexts/menuListContext.js.map +1 -1
  91. package/lib-commonjs/selectable/types.js +3 -3
  92. package/lib-commonjs/selectable/types.js.map +1 -1
  93. package/package.json +10 -10
package/CHANGELOG.md CHANGED
@@ -1,12 +1,39 @@
1
1
  # Change Log - @fluentui/react-menu
2
2
 
3
- This log was last generated on Mon, 30 Mar 2026 14:35:50 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 23 Apr 2026 11:59:25 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.24.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu_v9.24.1)
8
+
9
+ Thu, 23 Apr 2026 11:59:25 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu_v9.24.0..@fluentui/react-menu_v9.24.1)
11
+
12
+ ### Patches
13
+
14
+ - perf: memoize context values in use*ContextValues hooks ([PR #36008](https://github.com/microsoft/fluentui/pull/36008) by olfedias@microsoft.com)
15
+ - Bump @fluentui/react-aria to v9.17.11 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
16
+ - Bump @fluentui/react-context-selector to v9.2.16 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
17
+ - Bump @fluentui/react-motion to v9.15.0 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
18
+ - Bump @fluentui/react-motion-components-preview to v0.15.4 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
19
+ - Bump @fluentui/react-portal to v9.8.12 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
20
+ - Bump @fluentui/react-positioning to v9.22.1 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
21
+ - Bump @fluentui/react-tabster to v9.26.14 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
22
+ - Bump @fluentui/react-utilities to v9.26.3 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
23
+ - Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
24
+
25
+ ## [9.24.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu_v9.24.0)
26
+
27
+ Wed, 01 Apr 2026 15:52:41 GMT
28
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu_v9.23.1..@fluentui/react-menu_v9.24.0)
29
+
30
+ ### Minor changes
31
+
32
+ - Fix: Left arrow behavior in MenuGrid submenus ([PR #35928](https://github.com/microsoft/fluentui/pull/35928) by email not defined)
33
+
7
34
  ## [9.23.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu_v9.23.1)
8
35
 
9
- Mon, 30 Mar 2026 14:35:50 GMT
36
+ Mon, 30 Mar 2026 14:37:41 GMT
10
37
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu_v9.23.0..@fluentui/react-menu_v9.23.1)
11
38
 
12
39
  ### Patches
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- import { ARIAButtonElement } from '@fluentui/react-aria';
2
- import { ARIAButtonResultProps } from '@fluentui/react-aria';
3
- import { ARIAButtonType } from '@fluentui/react-aria';
1
+ import type { ARIAButtonElement } from '@fluentui/react-aria';
2
+ import type { ARIAButtonResultProps } from '@fluentui/react-aria';
3
+ import type { ARIAButtonType } from '@fluentui/react-aria';
4
4
  import type { ComponentProps } from '@fluentui/react-utilities';
5
5
  import type { ComponentState } from '@fluentui/react-utilities';
6
6
  import type { ContextSelector } from '@fluentui/react-context-selector';
@@ -8,10 +8,10 @@ import type { ForwardRefComponent } from '@fluentui/react-utilities';
8
8
  import type { JSXElement } from '@fluentui/react-utilities';
9
9
  import type { PortalProps } from '@fluentui/react-portal';
10
10
  import type { PositioningShorthand } from '@fluentui/react-positioning';
11
- import { PositioningVirtualElement } from '@fluentui/react-positioning';
11
+ import type { PositioningVirtualElement } from '@fluentui/react-positioning';
12
12
  import type { PresenceMotionSlotProps } from '@fluentui/react-motion';
13
13
  import * as React_2 from 'react';
14
- import { SetVirtualMouseTarget } from '@fluentui/react-positioning';
14
+ import type { SetVirtualMouseTarget } from '@fluentui/react-positioning';
15
15
  import type { Slot } from '@fluentui/react-utilities';
16
16
  import { SlotClassNames } from '@fluentui/react-utilities';
17
17
  import type { TriggerProps } from '@fluentui/react-utilities';
@@ -315,6 +315,14 @@ export declare type MenuListContextValue = Pick<MenuListProps, 'checkedValues' |
315
315
  * @default true
316
316
  */
317
317
  shouldOpenOnArrowRight?: boolean;
318
+ /**
319
+ * Whether child menus (submenus) should close when the user presses the ArrowLeft key.
320
+ * Set to `false` when the list context is provided by a grid-like container (e.g. MenuGrid) where
321
+ * ArrowLeft is reserved for column navigation.
322
+ *
323
+ * @default true
324
+ */
325
+ shouldCloseOnArrowLeft?: boolean;
318
326
  };
319
327
 
320
328
  export declare type MenuListContextValues = {
@@ -1,5 +1,4 @@
1
1
  'use client';
2
- import * as React from 'react';
3
2
  import { useMenu_unstable } from './useMenu';
4
3
  import { useMenuContextValues_unstable } from './useMenuContextValues';
5
4
  import { renderMenu_unstable } from './renderMenu';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Menu/Menu.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenu_unstable } from './useMenu';\nimport { useMenuContextValues_unstable } from './useMenuContextValues';\nimport { renderMenu_unstable } from './renderMenu';\nimport type { MenuProps } from './Menu.types';\n\n/**\n * Wrapper component that manages state for a popup MenuList and a MenuTrigger\n */\nexport const Menu: React.FC<MenuProps> = props => {\n const state = useMenu_unstable(props);\n const contextValues = useMenuContextValues_unstable(state);\n\n return renderMenu_unstable(state, contextValues);\n};\n\nMenu.displayName = 'Menu';\n"],"names":["React","useMenu_unstable","useMenuContextValues_unstable","renderMenu_unstable","Menu","props","state","contextValues","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,QAAQ,YAAY;AAC7C,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,mBAAmB,QAAQ,eAAe;AAGnD;;CAEC,GACD,OAAO,MAAMC,OAA4BC,CAAAA;IACvC,MAAMC,QAAQL,iBAAiBI;IAC/B,MAAME,gBAAgBL,8BAA8BI;IAEpD,OAAOH,oBAAoBG,OAAOC;AACpC,EAAE;AAEFH,KAAKI,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/Menu/Menu.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useMenu_unstable } from './useMenu';\nimport { useMenuContextValues_unstable } from './useMenuContextValues';\nimport { renderMenu_unstable } from './renderMenu';\nimport type { MenuProps } from './Menu.types';\n\n/**\n * Wrapper component that manages state for a popup MenuList and a MenuTrigger\n */\nexport const Menu: React.FC<MenuProps> = props => {\n const state = useMenu_unstable(props);\n const contextValues = useMenuContextValues_unstable(state);\n\n return renderMenu_unstable(state, contextValues);\n};\n\nMenu.displayName = 'Menu';\n"],"names":["useMenu_unstable","useMenuContextValues_unstable","renderMenu_unstable","Menu","props","state","contextValues","displayName"],"mappings":"AAAA;AAGA,SAASA,gBAAgB,QAAQ,YAAY;AAC7C,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,mBAAmB,QAAQ,eAAe;AAGnD;;CAEC,GACD,OAAO,MAAMC,OAA4BC,CAAAA;IACvC,MAAMC,QAAQL,iBAAiBI;IAC/B,MAAME,gBAAgBL,8BAA8BI;IAEpD,OAAOH,oBAAoBG,OAAOC;AACpC,EAAE;AAEFH,KAAKI,WAAW,GAAG"}
@@ -1 +1,3 @@
1
- import * as React from 'react';
1
+ /**
2
+ * Data attached to open/close events
3
+ */ export { };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Menu/Menu.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { PresenceMotionSlotProps } from '@fluentui/react-motion';\nimport { PositioningVirtualElement, SetVirtualMouseTarget } from '@fluentui/react-positioning';\nimport type { PositioningShorthand } from '@fluentui/react-positioning';\nimport type { PortalProps } from '@fluentui/react-portal';\nimport type { ComponentProps, ComponentState, JSXElement, Slot } from '@fluentui/react-utilities';\nimport type { MenuContextValue } from '../../contexts/menuContext';\nimport type { MenuListProps } from '../MenuList/MenuList.types';\n\nexport type MenuSlots = {\n /**\n * Slot for the surface motion animation.\n * For more information refer to the [Motion docs page](https://react.fluentui.dev/?path=/docs/motion-motion-slot--docs).\n */\n surfaceMotion: Slot<PresenceMotionSlotProps>;\n};\n\nexport type InternalMenuSlots = {\n surfaceMotion: NonNullable<Slot<PresenceMotionSlotProps>>;\n};\n\n/**\n * Extends and drills down Menulist props to simplify API\n */\nexport type MenuProps = ComponentProps<Partial<MenuSlots>> &\n Pick<PortalProps, 'mountNode'> &\n Pick<\n MenuListProps,\n 'checkedValues' | 'defaultCheckedValues' | 'hasCheckmarks' | 'hasIcons' | 'onCheckedValueChange'\n > & {\n /**\n * Can contain two children including `MenuTrigger` and `MenuPopover`.\n * Alternatively can only contain `MenuPopover` if using a custom `target`.\n */\n children: [JSXElement, JSXElement] | JSXElement;\n\n /**\n * Sets the delay for mouse open/close for the popover one mouse enter/leave\n */\n hoverDelay?: number;\n\n /**\n * Root menus are rendered out of DOM order on `document.body`, use this to render the menu in DOM order\n * This option is disregarded for submenus\n *\n * @default false\n */\n inline?: boolean;\n\n /**\n * Call back when the component requests to change value\n * The `open` value is used as a hint when directly controlling the component\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onOpenChange?: (e: MenuOpenEvent, data: MenuOpenChangeData) => void;\n\n /**\n * Whether the popup is open\n *\n * @default false\n */\n open?: boolean;\n\n /**\n * Whether the popup is open by default\n *\n * @default false\n */\n defaultOpen?: boolean;\n\n /**\n * Opens the menu on right click (context menu), removes all other menu open interactions\n *\n * @default false\n */\n openOnContext?: boolean;\n\n /**\n * Opens the menu on hover\n *\n * @default false\n */\n openOnHover?: boolean;\n\n /**\n * Do not dismiss the menu when a menu item is clicked\n *\n * @default false\n */\n persistOnItemClick?: boolean;\n\n /**\n * Configures the positioned menu\n */\n positioning?: PositioningShorthand;\n\n /**\n * Close when scroll outside of it\n *\n * @default false\n */\n closeOnScroll?: boolean;\n };\n\nexport type MenuState = ComponentState<InternalMenuSlots> &\n Required<\n Pick<\n MenuProps,\n | 'hasCheckmarks'\n | 'hasIcons'\n | 'mountNode'\n | 'inline'\n | 'checkedValues'\n | 'onCheckedValueChange'\n | 'open'\n | 'openOnHover'\n | 'closeOnScroll'\n | 'hoverDelay'\n | 'openOnContext'\n | 'persistOnItemClick'\n >\n > & {\n /**\n * Anchors the popper to the mouse click for context events\n */\n contextTarget?: PositioningVirtualElement;\n\n /**\n * Whether this menu is a submenu\n */\n isSubmenu: boolean;\n\n /**\n * Internal react node that just simplifies handling children\n */\n menuPopover: React.ReactNode;\n\n /**\n * The ref for the popup\n */\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n menuPopoverRef: React.MutableRefObject<HTMLElement | null>;\n\n /**\n * Internal react node that just simplifies handling children\n */\n menuTrigger: React.ReactNode;\n\n /**\n * A callback to set the target of the popper to the mouse click for context events\n */\n setContextTarget: SetVirtualMouseTarget;\n\n /**\n * Callback to open/close the popup\n */\n setOpen: (e: MenuOpenEvent, data: MenuOpenChangeData & { ignoreHoverDelay?: boolean }) => void;\n\n /**\n * Id for the MenuTrigger element for aria relationship\n */\n triggerId: string;\n\n /**\n * The ref for the MenuTrigger, used for popup positioning\n */\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n triggerRef: React.MutableRefObject<HTMLElement | null>;\n\n /**\n * Call back when the component requests to change value\n * The `open` value is used as a hint when directly controlling the component\n * @deprecated this property is not used internally anymore,\n * the signature remains just to avoid breaking changes\n */\n onOpenChange?: (e: MenuOpenEvent, data: MenuOpenChangeData) => void;\n /**\n * Default values to be checked on mount\n @deprecated this property is not used internally anymore,\n * the signature remains just to avoid breaking changes\n */\n defaultCheckedValues?: Record<string, string[]>;\n\n /**\n * An optional safe zone area to be rendered around the menu\n */\n safeZone?: React.ReactElement | null;\n };\n\nexport type MenuContextValues = {\n menu: MenuContextValue;\n};\n\n/**\n * The supported events that will trigger open/close of the menu\n */\nexport type MenuOpenEvent = MenuOpenChangeData['event'];\n/**\n * @deprecated use MenuOpenEvent instead\n */\nexport type MenuOpenEvents = MenuOpenEvent;\n\n/**\n * Data attached to open/close events\n */\nexport type MenuOpenChangeData = {\n /**\n * indicates whether the request for the open state was bubbled from a nested menu\n */\n bubble?: boolean;\n /**\n * Indicates whether the change of state was a keyboard interaction\n * @deprecated\n * This should not be used, since `Enter`, `Space` and click should be interpreted as the same thing as a click\n */\n keyboard?: boolean;\n open: boolean;\n} & (\n | {\n type: 'menuTriggerContextMenu';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuTriggerClick';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuTriggerMouseEnter';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuSafeZoneMouseEnter';\n event: React.MouseEvent;\n }\n | {\n type: 'menuSafeZoneTimeout';\n event: Event;\n }\n | {\n type: 'menuTriggerMouseLeave';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuTriggerMouseMove';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuTriggerKeyDown';\n event: React.KeyboardEvent<HTMLElement>;\n }\n | {\n type: 'menuItemClick';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuPopoverMouseEnter';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuPopoverKeyDown';\n event: React.KeyboardEvent<HTMLElement>;\n }\n | {\n type: 'clickOutside';\n event: MouseEvent | TouchEvent;\n }\n | {\n type: 'scrollOutside';\n event: MouseEvent | TouchEvent;\n }\n | {\n type: 'menuMouseEnter';\n event: MouseEvent | TouchEvent;\n }\n);\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
1
+ {"version":3,"sources":["../src/components/Menu/Menu.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type { PresenceMotionSlotProps } from '@fluentui/react-motion';\nimport type { PositioningVirtualElement, SetVirtualMouseTarget } from '@fluentui/react-positioning';\nimport type { PositioningShorthand } from '@fluentui/react-positioning';\nimport type { PortalProps } from '@fluentui/react-portal';\nimport type { ComponentProps, ComponentState, JSXElement, Slot } from '@fluentui/react-utilities';\nimport type { MenuContextValue } from '../../contexts/menuContext';\nimport type { MenuListProps } from '../MenuList/MenuList.types';\n\nexport type MenuSlots = {\n /**\n * Slot for the surface motion animation.\n * For more information refer to the [Motion docs page](https://react.fluentui.dev/?path=/docs/motion-motion-slot--docs).\n */\n surfaceMotion: Slot<PresenceMotionSlotProps>;\n};\n\nexport type InternalMenuSlots = {\n surfaceMotion: NonNullable<Slot<PresenceMotionSlotProps>>;\n};\n\n/**\n * Extends and drills down Menulist props to simplify API\n */\nexport type MenuProps = ComponentProps<Partial<MenuSlots>> &\n Pick<PortalProps, 'mountNode'> &\n Pick<\n MenuListProps,\n 'checkedValues' | 'defaultCheckedValues' | 'hasCheckmarks' | 'hasIcons' | 'onCheckedValueChange'\n > & {\n /**\n * Can contain two children including `MenuTrigger` and `MenuPopover`.\n * Alternatively can only contain `MenuPopover` if using a custom `target`.\n */\n children: [JSXElement, JSXElement] | JSXElement;\n\n /**\n * Sets the delay for mouse open/close for the popover one mouse enter/leave\n */\n hoverDelay?: number;\n\n /**\n * Root menus are rendered out of DOM order on `document.body`, use this to render the menu in DOM order\n * This option is disregarded for submenus\n *\n * @default false\n */\n inline?: boolean;\n\n /**\n * Call back when the component requests to change value\n * The `open` value is used as a hint when directly controlling the component\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onOpenChange?: (e: MenuOpenEvent, data: MenuOpenChangeData) => void;\n\n /**\n * Whether the popup is open\n *\n * @default false\n */\n open?: boolean;\n\n /**\n * Whether the popup is open by default\n *\n * @default false\n */\n defaultOpen?: boolean;\n\n /**\n * Opens the menu on right click (context menu), removes all other menu open interactions\n *\n * @default false\n */\n openOnContext?: boolean;\n\n /**\n * Opens the menu on hover\n *\n * @default false\n */\n openOnHover?: boolean;\n\n /**\n * Do not dismiss the menu when a menu item is clicked\n *\n * @default false\n */\n persistOnItemClick?: boolean;\n\n /**\n * Configures the positioned menu\n */\n positioning?: PositioningShorthand;\n\n /**\n * Close when scroll outside of it\n *\n * @default false\n */\n closeOnScroll?: boolean;\n };\n\nexport type MenuState = ComponentState<InternalMenuSlots> &\n Required<\n Pick<\n MenuProps,\n | 'hasCheckmarks'\n | 'hasIcons'\n | 'mountNode'\n | 'inline'\n | 'checkedValues'\n | 'onCheckedValueChange'\n | 'open'\n | 'openOnHover'\n | 'closeOnScroll'\n | 'hoverDelay'\n | 'openOnContext'\n | 'persistOnItemClick'\n >\n > & {\n /**\n * Anchors the popper to the mouse click for context events\n */\n contextTarget?: PositioningVirtualElement;\n\n /**\n * Whether this menu is a submenu\n */\n isSubmenu: boolean;\n\n /**\n * Internal react node that just simplifies handling children\n */\n menuPopover: React.ReactNode;\n\n /**\n * The ref for the popup\n */\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n menuPopoverRef: React.MutableRefObject<HTMLElement | null>;\n\n /**\n * Internal react node that just simplifies handling children\n */\n menuTrigger: React.ReactNode;\n\n /**\n * A callback to set the target of the popper to the mouse click for context events\n */\n setContextTarget: SetVirtualMouseTarget;\n\n /**\n * Callback to open/close the popup\n */\n setOpen: (e: MenuOpenEvent, data: MenuOpenChangeData & { ignoreHoverDelay?: boolean }) => void;\n\n /**\n * Id for the MenuTrigger element for aria relationship\n */\n triggerId: string;\n\n /**\n * The ref for the MenuTrigger, used for popup positioning\n */\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n triggerRef: React.MutableRefObject<HTMLElement | null>;\n\n /**\n * Call back when the component requests to change value\n * The `open` value is used as a hint when directly controlling the component\n * @deprecated this property is not used internally anymore,\n * the signature remains just to avoid breaking changes\n */\n onOpenChange?: (e: MenuOpenEvent, data: MenuOpenChangeData) => void;\n /**\n * Default values to be checked on mount\n @deprecated this property is not used internally anymore,\n * the signature remains just to avoid breaking changes\n */\n defaultCheckedValues?: Record<string, string[]>;\n\n /**\n * An optional safe zone area to be rendered around the menu\n */\n safeZone?: React.ReactElement | null;\n };\n\nexport type MenuContextValues = {\n menu: MenuContextValue;\n};\n\n/**\n * The supported events that will trigger open/close of the menu\n */\nexport type MenuOpenEvent = MenuOpenChangeData['event'];\n/**\n * @deprecated use MenuOpenEvent instead\n */\nexport type MenuOpenEvents = MenuOpenEvent;\n\n/**\n * Data attached to open/close events\n */\nexport type MenuOpenChangeData = {\n /**\n * indicates whether the request for the open state was bubbled from a nested menu\n */\n bubble?: boolean;\n /**\n * Indicates whether the change of state was a keyboard interaction\n * @deprecated\n * This should not be used, since `Enter`, `Space` and click should be interpreted as the same thing as a click\n */\n keyboard?: boolean;\n open: boolean;\n} & (\n | {\n type: 'menuTriggerContextMenu';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuTriggerClick';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuTriggerMouseEnter';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuSafeZoneMouseEnter';\n event: React.MouseEvent;\n }\n | {\n type: 'menuSafeZoneTimeout';\n event: Event;\n }\n | {\n type: 'menuTriggerMouseLeave';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuTriggerMouseMove';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuTriggerKeyDown';\n event: React.KeyboardEvent<HTMLElement>;\n }\n | {\n type: 'menuItemClick';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuPopoverMouseEnter';\n event: React.MouseEvent<HTMLElement>;\n }\n | {\n type: 'menuPopoverKeyDown';\n event: React.KeyboardEvent<HTMLElement>;\n }\n | {\n type: 'clickOutside';\n event: MouseEvent | TouchEvent;\n }\n | {\n type: 'scrollOutside';\n event: MouseEvent | TouchEvent;\n }\n | {\n type: 'menuMouseEnter';\n event: MouseEvent | TouchEvent;\n }\n);\n"],"names":[],"mappings":"AA0MA;;CAEC,GACD,WAqEE"}
@@ -1,7 +1,25 @@
1
+ 'use client';
2
+ import * as React from 'react';
1
3
  export function useMenuContextValues_unstable(state) {
2
4
  const { checkedValues, hasCheckmarks, hasIcons, inline, isSubmenu, menuPopoverRef, mountNode, onCheckedValueChange, open, openOnContext, openOnHover, persistOnItemClick, safeZone, setOpen, triggerId, triggerRef } = state;
3
- // This context is created with "@fluentui/react-context-selector", these is no sense to memoize it
4
- const menu = {
5
+ const menu = React.useMemo(()=>({
6
+ checkedValues,
7
+ hasCheckmarks,
8
+ hasIcons,
9
+ inline,
10
+ isSubmenu,
11
+ menuPopoverRef,
12
+ mountNode,
13
+ onCheckedValueChange,
14
+ open,
15
+ openOnContext,
16
+ openOnHover,
17
+ persistOnItemClick,
18
+ safeZone,
19
+ setOpen,
20
+ triggerId,
21
+ triggerRef
22
+ }), [
5
23
  checkedValues,
6
24
  hasCheckmarks,
7
25
  hasIcons,
@@ -18,7 +36,7 @@ export function useMenuContextValues_unstable(state) {
18
36
  setOpen,
19
37
  triggerId,
20
38
  triggerRef
21
- };
39
+ ]);
22
40
  return {
23
41
  menu
24
42
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Menu/useMenuContextValues.ts"],"sourcesContent":["import type { MenuContextValues, MenuState } from './Menu.types';\n\nexport function useMenuContextValues_unstable(state: MenuState): MenuContextValues {\n const {\n checkedValues,\n hasCheckmarks,\n hasIcons,\n inline,\n isSubmenu,\n menuPopoverRef,\n mountNode,\n onCheckedValueChange,\n open,\n openOnContext,\n openOnHover,\n persistOnItemClick,\n safeZone,\n setOpen,\n triggerId,\n triggerRef,\n } = state;\n\n // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n const menu = {\n checkedValues,\n hasCheckmarks,\n hasIcons,\n inline,\n isSubmenu,\n menuPopoverRef,\n mountNode,\n onCheckedValueChange,\n open,\n openOnContext,\n openOnHover,\n persistOnItemClick,\n safeZone,\n setOpen,\n triggerId,\n triggerRef,\n };\n\n return { menu };\n}\n"],"names":["useMenuContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","inline","isSubmenu","menuPopoverRef","mountNode","onCheckedValueChange","open","openOnContext","openOnHover","persistOnItemClick","safeZone","setOpen","triggerId","triggerRef","menu"],"mappings":"AAEA,OAAO,SAASA,8BAA8BC,KAAgB;IAC5D,MAAM,EACJC,aAAa,EACbC,aAAa,EACbC,QAAQ,EACRC,MAAM,EACNC,SAAS,EACTC,cAAc,EACdC,SAAS,EACTC,oBAAoB,EACpBC,IAAI,EACJC,aAAa,EACbC,WAAW,EACXC,kBAAkB,EAClBC,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTC,UAAU,EACX,GAAGhB;IAEJ,mGAAmG;IACnG,MAAMiB,OAAO;QACXhB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,OAAO;QAAEC;IAAK;AAChB"}
1
+ {"version":3,"sources":["../src/components/Menu/useMenuContextValues.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { MenuContextValues, MenuState } from './Menu.types';\n\nexport function useMenuContextValues_unstable(state: MenuState): MenuContextValues {\n const {\n checkedValues,\n hasCheckmarks,\n hasIcons,\n inline,\n isSubmenu,\n menuPopoverRef,\n mountNode,\n onCheckedValueChange,\n open,\n openOnContext,\n openOnHover,\n persistOnItemClick,\n safeZone,\n setOpen,\n triggerId,\n triggerRef,\n } = state;\n\n const menu = React.useMemo(\n () => ({\n checkedValues,\n hasCheckmarks,\n hasIcons,\n inline,\n isSubmenu,\n menuPopoverRef,\n mountNode,\n onCheckedValueChange,\n open,\n openOnContext,\n openOnHover,\n persistOnItemClick,\n safeZone,\n setOpen,\n triggerId,\n triggerRef,\n }),\n [\n checkedValues,\n hasCheckmarks,\n hasIcons,\n inline,\n isSubmenu,\n menuPopoverRef,\n mountNode,\n onCheckedValueChange,\n open,\n openOnContext,\n openOnHover,\n persistOnItemClick,\n safeZone,\n setOpen,\n triggerId,\n triggerRef,\n ],\n );\n\n return { menu };\n}\n"],"names":["React","useMenuContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","inline","isSubmenu","menuPopoverRef","mountNode","onCheckedValueChange","open","openOnContext","openOnHover","persistOnItemClick","safeZone","setOpen","triggerId","triggerRef","menu","useMemo"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,8BAA8BC,KAAgB;IAC5D,MAAM,EACJC,aAAa,EACbC,aAAa,EACbC,QAAQ,EACRC,MAAM,EACNC,SAAS,EACTC,cAAc,EACdC,SAAS,EACTC,oBAAoB,EACpBC,IAAI,EACJC,aAAa,EACbC,WAAW,EACXC,kBAAkB,EAClBC,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTC,UAAU,EACX,GAAGhB;IAEJ,MAAMiB,OAAOnB,MAAMoB,OAAO,CACxB,IAAO,CAAA;YACLjB;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QACEf;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;KACD;IAGH,OAAO;QAAEC;IAAK;AAChB"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuDivider/renderMenuDivider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { MenuDividerSlots, MenuDividerState } from './MenuDivider.types';\n\n/**\n * Redefine the render function to add slots. Reuse the menudivider structure but add\n * slots to children.\n */\nexport const renderMenuDivider_unstable = (state: MenuDividerState): JSXElement => {\n assertSlots<MenuDividerSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderMenuDivider_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;;CAGC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzCF,YAA8BE;IAE9B,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuDivider/renderMenuDivider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { MenuDividerSlots, MenuDividerState } from './MenuDivider.types';\n\n/**\n * Redefine the render function to add slots. Reuse the menudivider structure but add\n * slots to children.\n */\nexport const renderMenuDivider_unstable = (state: MenuDividerState): JSXElement => {\n assertSlots<MenuDividerSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderMenuDivider_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;;CAGC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzCF,YAA8BE;IAE9B,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
@@ -1,5 +1,4 @@
1
1
  import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
2
- import * as React from 'react';
3
2
  /**
4
3
  * Given user props, returns state and render function for a MenuDivider.
5
4
  */ export const useMenuDivider_unstable = (props, ref)=>{
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuDivider/useMenuDivider.ts"],"sourcesContent":["import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { MenuDividerProps, MenuDividerState } from './MenuDivider.types';\n\n/**\n * Given user props, returns state and render function for a MenuDivider.\n */\nexport const useMenuDivider_unstable = (props: MenuDividerProps, ref: React.Ref<HTMLElement>): MenuDividerState => {\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n role: 'presentation',\n 'aria-hidden': true,\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: ref as React.Ref<HTMLDivElement>,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["getIntrinsicElementProps","slot","React","useMenuDivider_unstable","props","ref","components","root","always","role","elementType"],"mappings":"AAAA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,YAAYC,WAAW,QAAQ;AAG/B;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAyBC;IAC/D,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QACAA,MAAMN,KAAKO,MAAM,CACfR,yBAAyB,OAAO;YAC9BS,MAAM;YACN,eAAe;YACf,GAAGL,KAAK;YACR,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FC,KAAKA;QACP,IACA;YAAEK,aAAa;QAAM;IAEzB;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuDivider/useMenuDivider.ts"],"sourcesContent":["import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type * as React from 'react';\nimport type { MenuDividerProps, MenuDividerState } from './MenuDivider.types';\n\n/**\n * Given user props, returns state and render function for a MenuDivider.\n */\nexport const useMenuDivider_unstable = (props: MenuDividerProps, ref: React.Ref<HTMLElement>): MenuDividerState => {\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n role: 'presentation',\n 'aria-hidden': true,\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: ref as React.Ref<HTMLDivElement>,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["getIntrinsicElementProps","slot","useMenuDivider_unstable","props","ref","components","root","always","role","elementType"],"mappings":"AAAA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAI3E;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAyBC;IAC/D,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QACAA,MAAML,KAAKM,MAAM,CACfP,yBAAyB,OAAO;YAC9BQ,MAAM;YACN,eAAe;YACf,GAAGL,KAAK;YACR,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FC,KAAKA;QACP,IACA;YAAEK,aAAa;QAAM;IAEzB;AACF,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuGroup/renderMenuGroup.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { MenuGroupContextValues, MenuGroupSlots, MenuGroupState } from './MenuGroup.types';\nimport { MenuGroupContextProvider } from '../../contexts/menuGroupContext';\n\n/**\n * Redefine the render function to add slots. Reuse the menugroup structure but add\n * slots to children.\n */\nexport const renderMenuGroup_unstable = (state: MenuGroupState, contextValues: MenuGroupContextValues): JSXElement => {\n assertSlots<MenuGroupSlots>(state);\n\n return (\n <MenuGroupContextProvider value={contextValues.menuGroup}>\n <state.root />\n </MenuGroupContextProvider>\n );\n};\n"],"names":["assertSlots","MenuGroupContextProvider","renderMenuGroup_unstable","state","contextValues","value","menuGroup","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,wBAAwB,QAAQ,kCAAkC;AAE3E;;;CAGC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAAuBC;IAC9DJ,YAA4BG;IAE5B,qBACE,KAACF;QAAyBI,OAAOD,cAAcE,SAAS;kBACtD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuGroup/renderMenuGroup.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { MenuGroupContextValues, MenuGroupSlots, MenuGroupState } from './MenuGroup.types';\nimport { MenuGroupContextProvider } from '../../contexts/menuGroupContext';\n\n/**\n * Redefine the render function to add slots. Reuse the menugroup structure but add\n * slots to children.\n */\nexport const renderMenuGroup_unstable = (state: MenuGroupState, contextValues: MenuGroupContextValues): JSXElement => {\n assertSlots<MenuGroupSlots>(state);\n\n return (\n <MenuGroupContextProvider value={contextValues.menuGroup}>\n <state.root />\n </MenuGroupContextProvider>\n );\n};\n"],"names":["assertSlots","MenuGroupContextProvider","renderMenuGroup_unstable","state","contextValues","value","menuGroup","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,wBAAwB,QAAQ,kCAAkC;AAE3E;;;CAGC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAAuBC;IAC9DJ,YAA4BG;IAE5B,qBACE,KAACF;QAAyBI,OAAOD,cAAcE,SAAS;kBACtD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
@@ -1,4 +1,3 @@
1
- import * as React from 'react';
2
1
  import { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';
3
2
  /**
4
3
  * Given user props, returns state and render function for a MenuGroup.
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuGroup/useMenuGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';\nimport { MenuGroupProps, MenuGroupState } from './MenuGroup.types';\n\n/**\n * Given user props, returns state and render function for a MenuGroup.\n */\nexport function useMenuGroup_unstable(props: MenuGroupProps, ref: React.Ref<HTMLElement>): MenuGroupState {\n const headerId = useId('menu-group');\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\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: ref as React.Ref<HTMLDivElement>,\n 'aria-labelledby': headerId,\n role: 'group',\n ...props,\n }),\n { elementType: 'div' },\n ),\n headerId,\n };\n}\n"],"names":["React","getIntrinsicElementProps","useId","slot","useMenuGroup_unstable","props","ref","headerId","components","root","always","role","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AAGlF;;CAEC,GACD,OAAO,SAASC,sBAAsBC,KAAqB,EAAEC,GAA2B;IACtF,MAAMC,WAAWL,MAAM;IAEvB,OAAO;QACLM,YAAY;YACVC,MAAM;QACR;QACAA,MAAMN,KAAKO,MAAM,CACfT,yBAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FK,KAAKA;YACL,mBAAmBC;YACnBI,MAAM;YACN,GAAGN,KAAK;QACV,IACA;YAAEO,aAAa;QAAM;QAEvBL;IACF;AACF"}
1
+ {"version":3,"sources":["../src/components/MenuGroup/useMenuGroup.ts"],"sourcesContent":["import type * as React from 'react';\nimport { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';\nimport type { MenuGroupProps, MenuGroupState } from './MenuGroup.types';\n\n/**\n * Given user props, returns state and render function for a MenuGroup.\n */\nexport function useMenuGroup_unstable(props: MenuGroupProps, ref: React.Ref<HTMLElement>): MenuGroupState {\n const headerId = useId('menu-group');\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\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: ref as React.Ref<HTMLDivElement>,\n 'aria-labelledby': headerId,\n role: 'group',\n ...props,\n }),\n { elementType: 'div' },\n ),\n headerId,\n };\n}\n"],"names":["getIntrinsicElementProps","useId","slot","useMenuGroup_unstable","props","ref","headerId","components","root","always","role","elementType"],"mappings":"AACA,SAASA,wBAAwB,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AAGlF;;CAEC,GACD,OAAO,SAASC,sBAAsBC,KAAqB,EAAEC,GAA2B;IACtF,MAAMC,WAAWL,MAAM;IAEvB,OAAO;QACLM,YAAY;YACVC,MAAM;QACR;QACAA,MAAMN,KAAKO,MAAM,CACfT,yBAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FK,KAAKA;YACL,mBAAmBC;YACnBI,MAAM;YACN,GAAGN,KAAK;QACV,IACA;YAAEO,aAAa;QAAM;QAEvBL;IACF;AACF"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuGroupHeader/renderMenuGroupHeader.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader.types';\n\n/**\n * Redefine the render function to add slots. Reuse the menugroupheader structure but add\n * slots to children.\n */\nexport const renderMenuGroupHeader_unstable = (state: MenuGroupHeaderState): JSXElement => {\n assertSlots<MenuGroupHeaderSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderMenuGroupHeader_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;;CAGC,GACD,OAAO,MAAMC,iCAAiC,CAACC;IAC7CF,YAAkCE;IAElC,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuGroupHeader/renderMenuGroupHeader.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader.types';\n\n/**\n * Redefine the render function to add slots. Reuse the menugroupheader structure but add\n * slots to children.\n */\nexport const renderMenuGroupHeader_unstable = (state: MenuGroupHeaderState): JSXElement => {\n assertSlots<MenuGroupHeaderSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderMenuGroupHeader_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;;CAGC,GACD,OAAO,MAAMC,iCAAiC,CAACC;IAC7CF,YAAkCE;IAElC,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
@@ -1,5 +1,4 @@
1
1
  'use client';
2
- import * as React from 'react';
3
2
  import { useMenuGroupContext_unstable } from '../../contexts/menuGroupContext';
4
3
  import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
5
4
  /**
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuGroupHeader/useMenuGroupHeader.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuGroupContext_unstable } from '../../contexts/menuGroupContext';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { MenuGroupHeaderProps, MenuGroupHeaderState } from './MenuGroupHeader.types';\n\n/**\n * Given user props, returns state and render function for a MenuGroupHeader.\n */\nexport function useMenuGroupHeader_unstable(\n props: MenuGroupHeaderProps,\n ref: React.Ref<HTMLElement>,\n): MenuGroupHeaderState {\n const { headerId: id } = useMenuGroupContext_unstable();\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\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: ref as React.Ref<HTMLDivElement>,\n id,\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n}\n"],"names":["React","useMenuGroupContext_unstable","getIntrinsicElementProps","slot","useMenuGroupHeader_unstable","props","ref","headerId","id","components","root","always","elementType"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,4BAA4B,QAAQ,kCAAkC;AAC/E,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAG3E;;CAEC,GACD,OAAO,SAASC,4BACdC,KAA2B,EAC3BC,GAA2B;IAE3B,MAAM,EAAEC,UAAUC,EAAE,EAAE,GAAGP;IAEzB,OAAO;QACLQ,YAAY;YACVC,MAAM;QACR;QACAA,MAAMP,KAAKQ,MAAM,CACfT,yBAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FI,KAAKA;YACLE;YACA,GAAGH,KAAK;QACV,IACA;YAAEO,aAAa;QAAM;IAEzB;AACF"}
1
+ {"version":3,"sources":["../src/components/MenuGroupHeader/useMenuGroupHeader.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useMenuGroupContext_unstable } from '../../contexts/menuGroupContext';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { MenuGroupHeaderProps, MenuGroupHeaderState } from './MenuGroupHeader.types';\n\n/**\n * Given user props, returns state and render function for a MenuGroupHeader.\n */\nexport function useMenuGroupHeader_unstable(\n props: MenuGroupHeaderProps,\n ref: React.Ref<HTMLElement>,\n): MenuGroupHeaderState {\n const { headerId: id } = useMenuGroupContext_unstable();\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\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: ref as React.Ref<HTMLDivElement>,\n id,\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n}\n"],"names":["useMenuGroupContext_unstable","getIntrinsicElementProps","slot","useMenuGroupHeader_unstable","props","ref","headerId","id","components","root","always","elementType"],"mappings":"AAAA;AAGA,SAASA,4BAA4B,QAAQ,kCAAkC;AAC/E,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAG3E;;CAEC,GACD,OAAO,SAASC,4BACdC,KAA2B,EAC3BC,GAA2B;IAE3B,MAAM,EAAEC,UAAUC,EAAE,EAAE,GAAGP;IAEzB,OAAO;QACLQ,YAAY;YACVC,MAAM;QACR;QACAA,MAAMP,KAAKQ,MAAM,CACfT,yBAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FI,KAAKA;YACLE;YACA,GAAGH,KAAK;QACV,IACA;YAAEO,aAAa;QAAM;IAEzB;AACF"}
@@ -1,5 +1,4 @@
1
1
  'use client';
2
- import * as React from 'react';
3
2
  import { useMenuListContext_unstable } from '../../contexts/menuListContext';
4
3
  export const useCharacterSearch = (state, ref)=>{
5
4
  'use no memo';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuItem/useCharacterSearch.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport type { MenuItemState } from '../../components/index';\nimport type { ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\nexport const useCharacterSearch = (state: MenuItemState, ref: React.RefObject<HTMLElement | null>): MenuItemState => {\n 'use no memo';\n\n const setFocusByFirstCharacter = useMenuListContext_unstable(context => context.setFocusByFirstCharacter);\n\n const { onKeyDown: originalOnKeyDown } = state.root;\n\n state.root.onKeyDown = (e: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n originalOnKeyDown?.(e);\n\n if (e.key?.length > 1) {\n return;\n }\n\n if (ref.current) {\n setFocusByFirstCharacter?.(e, ref.current);\n }\n };\n\n return state;\n};\n"],"names":["React","useMenuListContext_unstable","useCharacterSearch","state","ref","setFocusByFirstCharacter","context","onKeyDown","originalOnKeyDown","root","e","key","length","current"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,2BAA2B,QAAQ,iCAAiC;AAI7E,OAAO,MAAMC,qBAAqB,CAACC,OAAsBC;IACvD;IAEA,MAAMC,2BAA2BJ,4BAA4BK,CAAAA,UAAWA,QAAQD,wBAAwB;IAExG,MAAM,EAAEE,WAAWC,iBAAiB,EAAE,GAAGL,MAAMM,IAAI;IAEnDN,MAAMM,IAAI,CAACF,SAAS,GAAG,CAACG;YAGlBA;QAFJF,8BAAAA,wCAAAA,kBAAoBE;QAEpB,IAAIA,EAAAA,SAAAA,EAAEC,GAAG,cAALD,6BAAAA,OAAOE,MAAM,IAAG,GAAG;YACrB;QACF;QAEA,IAAIR,IAAIS,OAAO,EAAE;YACfR,qCAAAA,+CAAAA,yBAA2BK,GAAGN,IAAIS,OAAO;QAC3C;IACF;IAEA,OAAOV;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuItem/useCharacterSearch.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport type { MenuItemState } from '../../components/index';\nimport type { ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\nexport const useCharacterSearch = (state: MenuItemState, ref: React.RefObject<HTMLElement | null>): MenuItemState => {\n 'use no memo';\n\n const setFocusByFirstCharacter = useMenuListContext_unstable(context => context.setFocusByFirstCharacter);\n\n const { onKeyDown: originalOnKeyDown } = state.root;\n\n state.root.onKeyDown = (e: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n originalOnKeyDown?.(e);\n\n if (e.key?.length > 1) {\n return;\n }\n\n if (ref.current) {\n setFocusByFirstCharacter?.(e, ref.current);\n }\n };\n\n return state;\n};\n"],"names":["useMenuListContext_unstable","useCharacterSearch","state","ref","setFocusByFirstCharacter","context","onKeyDown","originalOnKeyDown","root","e","key","length","current"],"mappings":"AAAA;AAGA,SAASA,2BAA2B,QAAQ,iCAAiC;AAI7E,OAAO,MAAMC,qBAAqB,CAACC,OAAsBC;IACvD;IAEA,MAAMC,2BAA2BJ,4BAA4BK,CAAAA,UAAWA,QAAQD,wBAAwB;IAExG,MAAM,EAAEE,WAAWC,iBAAiB,EAAE,GAAGL,MAAMM,IAAI;IAEnDN,MAAMM,IAAI,CAACF,SAAS,GAAG,CAACG;YAGlBA;QAFJF,8BAAAA,wCAAAA,kBAAoBE;QAEpB,IAAIA,EAAAA,SAAAA,EAAEC,GAAG,cAALD,6BAAAA,OAAOE,MAAM,IAAG,GAAG;YACrB;QACF;QAEA,IAAIR,IAAIS,OAAO,EAAE;YACfR,qCAAAA,+CAAAA,yBAA2BK,GAAGN,IAAIS,OAAO;QAC3C;IACF;IAEA,OAAOV;AACT,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuItem/useMenuItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n useEventCallback,\n useMergedRefs,\n getIntrinsicElementProps,\n slot,\n useIsomorphicLayoutEffect,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useCharacterSearch } from './useCharacterSearch';\nimport { useMenuTriggerContext_unstable } from '../../contexts/menuTriggerContext';\nimport {\n ChevronRightFilled,\n ChevronRightRegular,\n ChevronLeftFilled,\n ChevronLeftRegular,\n bundleIcon,\n} from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport type { MenuItemProps, MenuItemState } from './MenuItem.types';\nimport {\n ARIAButtonElement,\n ARIAButtonElementIntersection,\n ARIAButtonProps,\n useARIAButtonProps,\n} from '@fluentui/react-aria';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useIsInMenuSplitGroup, useMenuSplitGroupContext_unstable } from '../../contexts/menuSplitGroupContext';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\nconst ChevronRightIcon = bundleIcon(ChevronRightFilled, ChevronRightRegular);\nconst ChevronLeftIcon = bundleIcon(ChevronLeftFilled, ChevronLeftRegular);\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuItem_unstable = (props: MenuItemProps, ref: React.Ref<ARIAButtonElement<'div'>>): MenuItemState => {\n const { dir } = useFluent();\n const state = useMenuItemBase_unstable(props, ref);\n\n // Set default chevron icon\n if (state.submenuIndicator) {\n state.submenuIndicator.children ??= dir === 'rtl' ? <ChevronLeftIcon /> : <ChevronRightIcon />;\n }\n\n return state;\n};\n\n/**\n * Base hook for MenuItem component, produces state required to render the component.\n * It doesn't set any design-related props specific to MenuItem such as submenu indicator icon.\n *\n * @internal\n */\nexport const useMenuItemBase_unstable = (\n props: MenuItemProps,\n ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemState => {\n const isSubmenuTrigger = useMenuTriggerContext_unstable();\n const persistOnClickContext = useMenuContext_unstable(context => context.persistOnItemClick);\n const {\n as = 'div',\n disabled = false,\n hasSubmenu = isSubmenuTrigger,\n persistOnClick = persistOnClickContext,\n content: _content, // `content` is a slot and it's type clashes with the HTMLElement `content` attribute\n ...rest\n } = props;\n const { hasIcons, hasCheckmarks } = useIconAndCheckmarkAlignment({ hasSubmenu });\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n useNotifySplitItemMultiline({ multiline: !!props.subText, hasSubmenu });\n\n const innerRef = React.useRef<ARIAButtonElementIntersection<'div'>>(null);\n const dismissedWithKeyboardRef = React.useRef(false);\n\n const validateNestingRef = useValidateNesting(getValidateNestingComponentName(props.role));\n\n const state: MenuItemState = {\n hasSubmenu,\n disabled,\n persistOnClick,\n components: {\n root: 'div',\n icon: 'span',\n checkmark: 'span',\n submenuIndicator: 'span',\n content: 'span',\n secondaryContent: 'span',\n subText: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps(\n as,\n useARIAButtonProps<'div', ARIAButtonProps<'div'>>(as, {\n role: 'menuitem',\n ...rest,\n disabled: false,\n disabledFocusable: disabled,\n ref: useMergedRefs(ref, innerRef, validateNestingRef) as React.Ref<ARIAButtonElementIntersection<'div'>>,\n onKeyDown: useEventCallback(event => {\n props.onKeyDown?.(event);\n if (!event.isDefaultPrevented() && (event.key === Space || event.key === Enter)) {\n dismissedWithKeyboardRef.current = true;\n }\n }),\n onMouseMove: useEventCallback(event => {\n if (event.currentTarget.ownerDocument.activeElement !== event.currentTarget) {\n innerRef.current?.focus();\n }\n\n props.onMouseMove?.(event);\n }),\n onClick: useEventCallback(event => {\n if (!hasSubmenu && !persistOnClick) {\n setOpen(event, {\n open: false,\n keyboard: dismissedWithKeyboardRef.current,\n bubble: true,\n type: 'menuItemClick',\n event,\n });\n dismissedWithKeyboardRef.current = false;\n }\n\n props.onClick?.(event);\n }),\n }),\n ),\n { elementType: 'div' },\n ),\n icon: slot.optional(props.icon, { renderByDefault: hasIcons, elementType: 'span' }),\n checkmark: slot.optional(props.checkmark, {\n renderByDefault: hasCheckmarks,\n elementType: 'span',\n }),\n submenuIndicator: slot.optional(props.submenuIndicator, {\n renderByDefault: hasSubmenu,\n elementType: 'span',\n }),\n content: slot.optional(props.content, {\n renderByDefault: !!props.children,\n defaultProps: { children: props.children },\n elementType: 'span',\n }),\n secondaryContent: slot.optional(props.secondaryContent, { elementType: 'span' }),\n subText: slot.optional(props.subText, { elementType: 'span' }),\n };\n useCharacterSearch(state, innerRef);\n return state;\n};\n\n/**\n * MenuSplitGroup needs to apply extra styles when its main item is in multiline layout mode\n * Notify the parent MenuSplitGroup so that it can handle this case\n */\nconst useNotifySplitItemMultiline = (options: { hasSubmenu: boolean; multiline: boolean }) => {\n const { hasSubmenu, multiline } = options;\n const isSplitItemTrigger = useIsInMenuSplitGroup() && hasSubmenu;\n\n const { setMultiline } = useMenuSplitGroupContext_unstable();\n\n useIsomorphicLayoutEffect(() => {\n if (!isSplitItemTrigger) {\n setMultiline(multiline);\n }\n }, [setMultiline, multiline, isSplitItemTrigger]);\n};\n\nconst useIconAndCheckmarkAlignment = (options: { hasSubmenu: boolean }) => {\n const { hasSubmenu } = options;\n const hasIcons = useMenuListContext_unstable(context => context.hasIcons);\n const hasCheckmarks = useMenuListContext_unstable(context => context.hasCheckmarks);\n const isSplitItemTrigger = useIsInMenuSplitGroup() && hasSubmenu;\n\n return {\n hasIcons: hasIcons && !isSplitItemTrigger,\n hasCheckmarks: hasCheckmarks && !isSplitItemTrigger,\n };\n};\n\nconst getValidateNestingComponentName = (role?: string) => {\n switch (role) {\n case 'menuitemcheckbox':\n return 'MenuItemCheckbox';\n case 'menuitemradio':\n return 'MenuItemRadio';\n }\n return 'MenuItem';\n};\n"],"names":["React","useEventCallback","useMergedRefs","getIntrinsicElementProps","slot","useIsomorphicLayoutEffect","useFluent_unstable","useFluent","useCharacterSearch","useMenuTriggerContext_unstable","ChevronRightFilled","ChevronRightRegular","ChevronLeftFilled","ChevronLeftRegular","bundleIcon","useMenuListContext_unstable","useMenuContext_unstable","useARIAButtonProps","Enter","Space","useIsInMenuSplitGroup","useMenuSplitGroupContext_unstable","useValidateNesting","ChevronRightIcon","ChevronLeftIcon","useMenuItem_unstable","props","ref","dir","state","useMenuItemBase_unstable","submenuIndicator","children","isSubmenuTrigger","persistOnClickContext","context","persistOnItemClick","as","disabled","hasSubmenu","persistOnClick","content","_content","rest","hasIcons","hasCheckmarks","useIconAndCheckmarkAlignment","setOpen","useNotifySplitItemMultiline","multiline","subText","innerRef","useRef","dismissedWithKeyboardRef","validateNestingRef","getValidateNestingComponentName","role","components","root","icon","checkmark","secondaryContent","always","disabledFocusable","onKeyDown","event","isDefaultPrevented","key","current","onMouseMove","currentTarget","ownerDocument","activeElement","focus","onClick","open","keyboard","bubble","type","elementType","optional","renderByDefault","defaultProps","options","isSplitItemTrigger","setMultiline"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,gBAAgB,EAChBC,aAAa,EACbC,wBAAwB,EACxBC,IAAI,EACJC,yBAAyB,QACpB,4BAA4B;AACnC,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,kBAAkB,QAAQ,uBAAuB;AAC1D,SAASC,8BAA8B,QAAQ,oCAAoC;AACnF,SACEC,kBAAkB,EAClBC,mBAAmB,EACnBC,iBAAiB,EACjBC,kBAAkB,EAClBC,UAAU,QACL,wBAAwB;AAC/B,SAASC,2BAA2B,QAAQ,iCAAiC;AAC7E,SAASC,uBAAuB,QAAQ,6BAA6B;AAErE,SAIEC,kBAAkB,QACb,uBAAuB;AAC9B,SAASC,KAAK,EAAEC,KAAK,QAAQ,0BAA0B;AACvD,SAASC,qBAAqB,EAAEC,iCAAiC,QAAQ,uCAAuC;AAChH,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE,MAAMC,mBAAmBT,WAAWJ,oBAAoBC;AACxD,MAAMa,kBAAkBV,WAAWF,mBAAmBC;AAEtD;;CAEC,GACD,OAAO,MAAMY,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,GAAG,EAAE,GAAGrB;IAChB,MAAMsB,QAAQC,yBAAyBJ,OAAOC;IAE9C,2BAA2B;IAC3B,IAAIE,MAAME,gBAAgB,EAAE;YAC1BF;;QAAAA,cAAAA,0BAAAA,MAAME,gBAAgB,EAACC,yDAAvBH,wBAAuBG,WAAaJ,QAAQ,sBAAQ,oBAACJ,uCAAqB,oBAACD;IAC7E;IAEA,OAAOM;AACT,EAAE;AAEF;;;;;CAKC,GACD,OAAO,MAAMC,2BAA2B,CACtCJ,OACAC;IAEA,MAAMM,mBAAmBxB;IACzB,MAAMyB,wBAAwBlB,wBAAwBmB,CAAAA,UAAWA,QAAQC,kBAAkB;IAC3F,MAAM,EACJC,KAAK,KAAK,EACVC,WAAW,KAAK,EAChBC,aAAaN,gBAAgB,EAC7BO,iBAAiBN,qBAAqB,EACtCO,SAASC,QAAQ,EACjB,GAAGC,MACJ,GAAGjB;IACJ,MAAM,EAAEkB,QAAQ,EAAEC,aAAa,EAAE,GAAGC,6BAA6B;QAAEP;IAAW;IAC9E,MAAMQ,UAAU/B,wBAAwBmB,CAAAA,UAAWA,QAAQY,OAAO;IAClEC,4BAA4B;QAAEC,WAAW,CAAC,CAACvB,MAAMwB,OAAO;QAAEX;IAAW;IAErE,MAAMY,WAAWnD,MAAMoD,MAAM,CAAuC;IACpE,MAAMC,2BAA2BrD,MAAMoD,MAAM,CAAC;IAE9C,MAAME,qBAAqBhC,mBAAmBiC,gCAAgC7B,MAAM8B,IAAI;IAExF,MAAM3B,QAAuB;QAC3BU;QACAD;QACAE;QACAiB,YAAY;YACVC,MAAM;YACNC,MAAM;YACNC,WAAW;YACX7B,kBAAkB;YAClBU,SAAS;YACToB,kBAAkB;YAClBX,SAAS;QACX;QACAQ,MAAMtD,KAAK0D,MAAM,CACf3D,yBACEkC,IACApB,mBAAkDoB,IAAI;YACpDmB,MAAM;YACN,GAAGb,IAAI;YACPL,UAAU;YACVyB,mBAAmBzB;YACnBX,KAAKzB,cAAcyB,KAAKwB,UAAUG;YAClCU,WAAW/D,iBAAiBgE,CAAAA;oBAC1BvC;iBAAAA,mBAAAA,MAAMsC,SAAS,cAAftC,uCAAAA,sBAAAA,OAAkBuC;gBAClB,IAAI,CAACA,MAAMC,kBAAkB,MAAOD,CAAAA,MAAME,GAAG,KAAKhD,SAAS8C,MAAME,GAAG,KAAKjD,KAAI,GAAI;oBAC/EmC,yBAAyBe,OAAO,GAAG;gBACrC;YACF;YACAC,aAAapE,iBAAiBgE,CAAAA;oBAK5BvC;gBAJA,IAAIuC,MAAMK,aAAa,CAACC,aAAa,CAACC,aAAa,KAAKP,MAAMK,aAAa,EAAE;wBAC3EnB;qBAAAA,oBAAAA,SAASiB,OAAO,cAAhBjB,wCAAAA,kBAAkBsB,KAAK;gBACzB;iBAEA/C,qBAAAA,MAAM2C,WAAW,cAAjB3C,yCAAAA,wBAAAA,OAAoBuC;YACtB;YACAS,SAASzE,iBAAiBgE,CAAAA;oBAYxBvC;gBAXA,IAAI,CAACa,cAAc,CAACC,gBAAgB;oBAClCO,QAAQkB,OAAO;wBACbU,MAAM;wBACNC,UAAUvB,yBAAyBe,OAAO;wBAC1CS,QAAQ;wBACRC,MAAM;wBACNb;oBACF;oBACAZ,yBAAyBe,OAAO,GAAG;gBACrC;iBAEA1C,iBAAAA,MAAMgD,OAAO,cAAbhD,qCAAAA,oBAAAA,OAAgBuC;YAClB;QACF,KAEF;YAAEc,aAAa;QAAM;QAEvBpB,MAAMvD,KAAK4E,QAAQ,CAACtD,MAAMiC,IAAI,EAAE;YAAEsB,iBAAiBrC;YAAUmC,aAAa;QAAO;QACjFnB,WAAWxD,KAAK4E,QAAQ,CAACtD,MAAMkC,SAAS,EAAE;YACxCqB,iBAAiBpC;YACjBkC,aAAa;QACf;QACAhD,kBAAkB3B,KAAK4E,QAAQ,CAACtD,MAAMK,gBAAgB,EAAE;YACtDkD,iBAAiB1C;YACjBwC,aAAa;QACf;QACAtC,SAASrC,KAAK4E,QAAQ,CAACtD,MAAMe,OAAO,EAAE;YACpCwC,iBAAiB,CAAC,CAACvD,MAAMM,QAAQ;YACjCkD,cAAc;gBAAElD,UAAUN,MAAMM,QAAQ;YAAC;YACzC+C,aAAa;QACf;QACAlB,kBAAkBzD,KAAK4E,QAAQ,CAACtD,MAAMmC,gBAAgB,EAAE;YAAEkB,aAAa;QAAO;QAC9E7B,SAAS9C,KAAK4E,QAAQ,CAACtD,MAAMwB,OAAO,EAAE;YAAE6B,aAAa;QAAO;IAC9D;IACAvE,mBAAmBqB,OAAOsB;IAC1B,OAAOtB;AACT,EAAE;AAEF;;;CAGC,GACD,MAAMmB,8BAA8B,CAACmC;IACnC,MAAM,EAAE5C,UAAU,EAAEU,SAAS,EAAE,GAAGkC;IAClC,MAAMC,qBAAqBhE,2BAA2BmB;IAEtD,MAAM,EAAE8C,YAAY,EAAE,GAAGhE;IAEzBhB,0BAA0B;QACxB,IAAI,CAAC+E,oBAAoB;YACvBC,aAAapC;QACf;IACF,GAAG;QAACoC;QAAcpC;QAAWmC;KAAmB;AAClD;AAEA,MAAMtC,+BAA+B,CAACqC;IACpC,MAAM,EAAE5C,UAAU,EAAE,GAAG4C;IACvB,MAAMvC,WAAW7B,4BAA4BoB,CAAAA,UAAWA,QAAQS,QAAQ;IACxE,MAAMC,gBAAgB9B,4BAA4BoB,CAAAA,UAAWA,QAAQU,aAAa;IAClF,MAAMuC,qBAAqBhE,2BAA2BmB;IAEtD,OAAO;QACLK,UAAUA,YAAY,CAACwC;QACvBvC,eAAeA,iBAAiB,CAACuC;IACnC;AACF;AAEA,MAAM7B,kCAAkC,CAACC;IACvC,OAAQA;QACN,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;IACX;IACA,OAAO;AACT"}
1
+ {"version":3,"sources":["../src/components/MenuItem/useMenuItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n useEventCallback,\n useMergedRefs,\n getIntrinsicElementProps,\n slot,\n useIsomorphicLayoutEffect,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useCharacterSearch } from './useCharacterSearch';\nimport { useMenuTriggerContext_unstable } from '../../contexts/menuTriggerContext';\nimport {\n ChevronRightFilled,\n ChevronRightRegular,\n ChevronLeftFilled,\n ChevronLeftRegular,\n bundleIcon,\n} from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport type { MenuItemProps, MenuItemState } from './MenuItem.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection, ARIAButtonProps } from '@fluentui/react-aria';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useIsInMenuSplitGroup, useMenuSplitGroupContext_unstable } from '../../contexts/menuSplitGroupContext';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\nconst ChevronRightIcon = bundleIcon(ChevronRightFilled, ChevronRightRegular);\nconst ChevronLeftIcon = bundleIcon(ChevronLeftFilled, ChevronLeftRegular);\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuItem_unstable = (props: MenuItemProps, ref: React.Ref<ARIAButtonElement<'div'>>): MenuItemState => {\n const { dir } = useFluent();\n const state = useMenuItemBase_unstable(props, ref);\n\n // Set default chevron icon\n if (state.submenuIndicator) {\n state.submenuIndicator.children ??= dir === 'rtl' ? <ChevronLeftIcon /> : <ChevronRightIcon />;\n }\n\n return state;\n};\n\n/**\n * Base hook for MenuItem component, produces state required to render the component.\n * It doesn't set any design-related props specific to MenuItem such as submenu indicator icon.\n *\n * @internal\n */\nexport const useMenuItemBase_unstable = (\n props: MenuItemProps,\n ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemState => {\n const isSubmenuTrigger = useMenuTriggerContext_unstable();\n const persistOnClickContext = useMenuContext_unstable(context => context.persistOnItemClick);\n const {\n as = 'div',\n disabled = false,\n hasSubmenu = isSubmenuTrigger,\n persistOnClick = persistOnClickContext,\n content: _content, // `content` is a slot and it's type clashes with the HTMLElement `content` attribute\n ...rest\n } = props;\n const { hasIcons, hasCheckmarks } = useIconAndCheckmarkAlignment({ hasSubmenu });\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n useNotifySplitItemMultiline({ multiline: !!props.subText, hasSubmenu });\n\n const innerRef = React.useRef<ARIAButtonElementIntersection<'div'>>(null);\n const dismissedWithKeyboardRef = React.useRef(false);\n\n const validateNestingRef = useValidateNesting(getValidateNestingComponentName(props.role));\n\n const state: MenuItemState = {\n hasSubmenu,\n disabled,\n persistOnClick,\n components: {\n root: 'div',\n icon: 'span',\n checkmark: 'span',\n submenuIndicator: 'span',\n content: 'span',\n secondaryContent: 'span',\n subText: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps(\n as,\n useARIAButtonProps<'div', ARIAButtonProps<'div'>>(as, {\n role: 'menuitem',\n ...rest,\n disabled: false,\n disabledFocusable: disabled,\n ref: useMergedRefs(ref, innerRef, validateNestingRef) as React.Ref<ARIAButtonElementIntersection<'div'>>,\n onKeyDown: useEventCallback(event => {\n props.onKeyDown?.(event);\n if (!event.isDefaultPrevented() && (event.key === Space || event.key === Enter)) {\n dismissedWithKeyboardRef.current = true;\n }\n }),\n onMouseMove: useEventCallback(event => {\n if (event.currentTarget.ownerDocument.activeElement !== event.currentTarget) {\n innerRef.current?.focus();\n }\n\n props.onMouseMove?.(event);\n }),\n onClick: useEventCallback(event => {\n if (!hasSubmenu && !persistOnClick) {\n setOpen(event, {\n open: false,\n keyboard: dismissedWithKeyboardRef.current,\n bubble: true,\n type: 'menuItemClick',\n event,\n });\n dismissedWithKeyboardRef.current = false;\n }\n\n props.onClick?.(event);\n }),\n }),\n ),\n { elementType: 'div' },\n ),\n icon: slot.optional(props.icon, { renderByDefault: hasIcons, elementType: 'span' }),\n checkmark: slot.optional(props.checkmark, {\n renderByDefault: hasCheckmarks,\n elementType: 'span',\n }),\n submenuIndicator: slot.optional(props.submenuIndicator, {\n renderByDefault: hasSubmenu,\n elementType: 'span',\n }),\n content: slot.optional(props.content, {\n renderByDefault: !!props.children,\n defaultProps: { children: props.children },\n elementType: 'span',\n }),\n secondaryContent: slot.optional(props.secondaryContent, { elementType: 'span' }),\n subText: slot.optional(props.subText, { elementType: 'span' }),\n };\n useCharacterSearch(state, innerRef);\n return state;\n};\n\n/**\n * MenuSplitGroup needs to apply extra styles when its main item is in multiline layout mode\n * Notify the parent MenuSplitGroup so that it can handle this case\n */\nconst useNotifySplitItemMultiline = (options: { hasSubmenu: boolean; multiline: boolean }) => {\n const { hasSubmenu, multiline } = options;\n const isSplitItemTrigger = useIsInMenuSplitGroup() && hasSubmenu;\n\n const { setMultiline } = useMenuSplitGroupContext_unstable();\n\n useIsomorphicLayoutEffect(() => {\n if (!isSplitItemTrigger) {\n setMultiline(multiline);\n }\n }, [setMultiline, multiline, isSplitItemTrigger]);\n};\n\nconst useIconAndCheckmarkAlignment = (options: { hasSubmenu: boolean }) => {\n const { hasSubmenu } = options;\n const hasIcons = useMenuListContext_unstable(context => context.hasIcons);\n const hasCheckmarks = useMenuListContext_unstable(context => context.hasCheckmarks);\n const isSplitItemTrigger = useIsInMenuSplitGroup() && hasSubmenu;\n\n return {\n hasIcons: hasIcons && !isSplitItemTrigger,\n hasCheckmarks: hasCheckmarks && !isSplitItemTrigger,\n };\n};\n\nconst getValidateNestingComponentName = (role?: string) => {\n switch (role) {\n case 'menuitemcheckbox':\n return 'MenuItemCheckbox';\n case 'menuitemradio':\n return 'MenuItemRadio';\n }\n return 'MenuItem';\n};\n"],"names":["React","useEventCallback","useMergedRefs","getIntrinsicElementProps","slot","useIsomorphicLayoutEffect","useFluent_unstable","useFluent","useCharacterSearch","useMenuTriggerContext_unstable","ChevronRightFilled","ChevronRightRegular","ChevronLeftFilled","ChevronLeftRegular","bundleIcon","useMenuListContext_unstable","useMenuContext_unstable","useARIAButtonProps","Enter","Space","useIsInMenuSplitGroup","useMenuSplitGroupContext_unstable","useValidateNesting","ChevronRightIcon","ChevronLeftIcon","useMenuItem_unstable","props","ref","dir","state","useMenuItemBase_unstable","submenuIndicator","children","isSubmenuTrigger","persistOnClickContext","context","persistOnItemClick","as","disabled","hasSubmenu","persistOnClick","content","_content","rest","hasIcons","hasCheckmarks","useIconAndCheckmarkAlignment","setOpen","useNotifySplitItemMultiline","multiline","subText","innerRef","useRef","dismissedWithKeyboardRef","validateNestingRef","getValidateNestingComponentName","role","components","root","icon","checkmark","secondaryContent","always","disabledFocusable","onKeyDown","event","isDefaultPrevented","key","current","onMouseMove","currentTarget","ownerDocument","activeElement","focus","onClick","open","keyboard","bubble","type","elementType","optional","renderByDefault","defaultProps","options","isSplitItemTrigger","setMultiline"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuItemLink/MenuItemLink.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { MenuItemProps, MenuItemSlots } from '../MenuItem/MenuItem.types';\n\nexport type MenuItemLinkSlots = {\n root: Slot<'a'>;\n} & Pick<MenuItemSlots, 'icon' | 'content' | 'secondaryContent' | 'checkmark'>;\n\n/**\n * MenuItemLink Props\n */\nexport type MenuItemLinkProps = ComponentProps<MenuItemLinkSlots> & Pick<MenuItemProps, 'disabled'> & { href: string };\n\n/**\n * State used in rendering MenuItemLink\n */\nexport type MenuItemLinkState = ComponentState<MenuItemLinkSlots>;\n"],"names":[],"mappings":"AAYA;;CAEC,GACD,WAAkE"}
1
+ {"version":3,"sources":["../src/components/MenuItemLink/MenuItemLink.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { MenuItemProps, MenuItemSlots } from '../MenuItem/MenuItem.types';\n\nexport type MenuItemLinkSlots = {\n root: Slot<'a'>;\n} & Pick<MenuItemSlots, 'icon' | 'content' | 'secondaryContent' | 'checkmark'>;\n\n/**\n * MenuItemLink Props\n */\nexport type MenuItemLinkProps = ComponentProps<MenuItemLinkSlots> & Pick<MenuItemProps, 'disabled'> & { href: string };\n\n/**\n * State used in rendering MenuItemLink\n */\nexport type MenuItemLinkState = ComponentState<MenuItemLinkSlots>;\n"],"names":[],"mappings":"AAYA;;CAEC,GACD,WAAkE"}
@@ -1,5 +1,4 @@
1
1
  'use client';
2
- import * as React from 'react';
3
2
  import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
4
3
  import { useMenuItem_unstable } from '../MenuItem/useMenuItem';
5
4
  /**
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuItemLink/useMenuItemLink.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ExtractSlotProps, Slot, getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { MenuItemLinkProps, MenuItemLinkState } from './MenuItemLink.types';\nimport { useMenuItem_unstable } from '../MenuItem/useMenuItem';\nimport { MenuItemProps } from '../MenuItem/MenuItem.types';\n\n/**\n * Create the state required to render MenuItemLink.\n *\n * The returned state can be modified with hooks such as useMenuItemLinkStyles_unstable,\n * before being passed to renderMenuItemLink_unstable.\n *\n * @param props - props from this instance of MenuItemLink\n * @param ref - reference to root HTMLElement of MenuItemLink\n */\nexport const useMenuItemLink_unstable = (\n props: MenuItemLinkProps,\n ref: React.Ref<HTMLAnchorElement>,\n): MenuItemLinkState => {\n // casting because the root slot changes from div to a\n const baseState = useMenuItem_unstable(props as MenuItemProps, null);\n // FIXME: casting because the root slot changes from div to a,\n // ideal solution would be to extract common logic from useMenuItem_unstable root\n // and use it in both without assuming element type\n const _props = { ...props, ...(baseState.root as ExtractSlotProps<Slot<'a'>>), ref, tabIndex: props.tabIndex };\n\n return {\n ...baseState,\n components: {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ...baseState.components,\n root: 'a',\n },\n root: slot.always(\n getIntrinsicElementProps('a', {\n role: 'menuitem',\n ..._props,\n }),\n { elementType: 'a' },\n ),\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useMenuItem_unstable","useMenuItemLink_unstable","props","ref","baseState","_props","root","tabIndex","components","always","role","elementType"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAAiCC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAEnG,SAASC,oBAAoB,QAAQ,0BAA0B;AAG/D;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CACtCC,OACAC;IAEA,sDAAsD;IACtD,MAAMC,YAAYJ,qBAAqBE,OAAwB;IAC/D,8DAA8D;IAC9D,iFAAiF;IACjF,mDAAmD;IACnD,MAAMG,SAAS;QAAE,GAAGH,KAAK;QAAE,GAAIE,UAAUE,IAAI;QAAkCH;QAAKI,UAAUL,MAAMK,QAAQ;IAAC;IAE7G,OAAO;QACL,GAAGH,SAAS;QACZI,YAAY;YACV,4DAA4D;YAC5D,GAAGJ,UAAUI,UAAU;YACvBF,MAAM;QACR;QACAA,MAAMP,KAAKU,MAAM,CACfX,yBAAyB,KAAK;YAC5BY,MAAM;YACN,GAAGL,MAAM;QACX,IACA;YAAEM,aAAa;QAAI;IAEvB;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuItemLink/useMenuItemLink.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport type { ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { MenuItemLinkProps, MenuItemLinkState } from './MenuItemLink.types';\nimport { useMenuItem_unstable } from '../MenuItem/useMenuItem';\nimport type { MenuItemProps } from '../MenuItem/MenuItem.types';\n\n/**\n * Create the state required to render MenuItemLink.\n *\n * The returned state can be modified with hooks such as useMenuItemLinkStyles_unstable,\n * before being passed to renderMenuItemLink_unstable.\n *\n * @param props - props from this instance of MenuItemLink\n * @param ref - reference to root HTMLElement of MenuItemLink\n */\nexport const useMenuItemLink_unstable = (\n props: MenuItemLinkProps,\n ref: React.Ref<HTMLAnchorElement>,\n): MenuItemLinkState => {\n // casting because the root slot changes from div to a\n const baseState = useMenuItem_unstable(props as MenuItemProps, null);\n // FIXME: casting because the root slot changes from div to a,\n // ideal solution would be to extract common logic from useMenuItem_unstable root\n // and use it in both without assuming element type\n const _props = { ...props, ...(baseState.root as ExtractSlotProps<Slot<'a'>>), ref, tabIndex: props.tabIndex };\n\n return {\n ...baseState,\n components: {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ...baseState.components,\n root: 'a',\n },\n root: slot.always(\n getIntrinsicElementProps('a', {\n role: 'menuitem',\n ..._props,\n }),\n { elementType: 'a' },\n ),\n };\n};\n"],"names":["getIntrinsicElementProps","slot","useMenuItem_unstable","useMenuItemLink_unstable","props","ref","baseState","_props","root","tabIndex","components","always","role","elementType"],"mappings":"AAAA;AAIA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,oBAAoB,QAAQ,0BAA0B;AAG/D;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CACtCC,OACAC;IAEA,sDAAsD;IACtD,MAAMC,YAAYJ,qBAAqBE,OAAwB;IAC/D,8DAA8D;IAC9D,iFAAiF;IACjF,mDAAmD;IACnD,MAAMG,SAAS;QAAE,GAAGH,KAAK;QAAE,GAAIE,UAAUE,IAAI;QAAkCH;QAAKI,UAAUL,MAAMK,QAAQ;IAAC;IAE7G,OAAO;QACL,GAAGH,SAAS;QACZI,YAAY;YACV,4DAA4D;YAC5D,GAAGJ,UAAUI,UAAU;YACvBF,MAAM;QACR;QACAA,MAAMP,KAAKU,MAAM,CACfX,yBAAyB,KAAK;YAC5BY,MAAM;YACN,GAAGL,MAAM;QACX,IACA;YAAEM,aAAa;QAAI;IAEvB;AACF,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuItemLink/useMenuItemLinkStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { MenuItemLinkSlots, MenuItemLinkState } from './MenuItemLink.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nimport { MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport const menuItemLinkClassNames: SlotClassNames<MenuItemLinkSlots> = {\n root: 'fui-MenuItemLink',\n icon: 'fui-MenuItemLink__icon',\n checkmark: 'fui-MenuItemLink__checkmark',\n content: 'fui-MenuItemLink__content',\n secondaryContent: 'fui-MenuItemLink__secondaryContent',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n resetLink: {\n textDecorationLine: 'none',\n textDecorationThickness: 'initial',\n textDecorationStyle: 'initial',\n textDecorationColor: 'initial',\n },\n});\n\n/**\n * Apply styling to the MenuItemLink slots based on the state\n */\nexport const useMenuItemLinkStyles_unstable = (state: MenuItemLinkState): MenuItemLinkState => {\n 'use no memo';\n\n useMenuItemStyles_unstable(state as MenuItemState);\n const styles = useStyles();\n state.root.className = mergeClasses(menuItemLinkClassNames.root, styles.resetLink, state.root.className);\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemLinkClassNames.icon, state.icon.className);\n }\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemLinkClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemLinkClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemLinkClassNames.checkmark, state.checkmark.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useMenuItemStyles_unstable","menuItemLinkClassNames","root","icon","checkmark","content","secondaryContent","useStyles","resetLink","textDecorationLine","textDecorationThickness","textDecorationStyle","textDecorationColor","useMenuItemLinkStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,SAASC,0BAA0B,QAAQ,uCAAuC;AAGlF,OAAO,MAAMC,yBAA4D;IACvEC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,SAAS;IACTC,kBAAkB;AACpB,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYT,WAAW;IAC3BU,WAAW;QACTC,oBAAoB;QACpBC,yBAAyB;QACzBC,qBAAqB;QACrBC,qBAAqB;IACvB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,iCAAiC,CAACC;IAC7C;IAEAd,2BAA2Bc;IAC3B,MAAMC,SAASR;IACfO,MAAMZ,IAAI,CAACc,SAAS,GAAGjB,aAAaE,uBAAuBC,IAAI,EAAEa,OAAOP,SAAS,EAAEM,MAAMZ,IAAI,CAACc,SAAS;IAEvG,IAAIF,MAAMX,IAAI,EAAE;QACdW,MAAMX,IAAI,CAACa,SAAS,GAAGjB,aAAaE,uBAAuBE,IAAI,EAAEW,MAAMX,IAAI,CAACa,SAAS;IACvF;IAEA,IAAIF,MAAMT,OAAO,EAAE;QACjBS,MAAMT,OAAO,CAACW,SAAS,GAAGjB,aAAaE,uBAAuBI,OAAO,EAAES,MAAMT,OAAO,CAACW,SAAS;IAChG;IAEA,IAAIF,MAAMR,gBAAgB,EAAE;QAC1BQ,MAAMR,gBAAgB,CAACU,SAAS,GAAGjB,aACjCE,uBAAuBK,gBAAgB,EACvCQ,MAAMR,gBAAgB,CAACU,SAAS;IAEpC;IAEA,IAAIF,MAAMV,SAAS,EAAE;QACnBU,MAAMV,SAAS,CAACY,SAAS,GAAGjB,aAAaE,uBAAuBG,SAAS,EAAEU,MAAMV,SAAS,CAACY,SAAS;IACtG;IAEA,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuItemLink/useMenuItemLinkStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { MenuItemLinkSlots, MenuItemLinkState } from './MenuItemLink.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nimport type { MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport const menuItemLinkClassNames: SlotClassNames<MenuItemLinkSlots> = {\n root: 'fui-MenuItemLink',\n icon: 'fui-MenuItemLink__icon',\n checkmark: 'fui-MenuItemLink__checkmark',\n content: 'fui-MenuItemLink__content',\n secondaryContent: 'fui-MenuItemLink__secondaryContent',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n resetLink: {\n textDecorationLine: 'none',\n textDecorationThickness: 'initial',\n textDecorationStyle: 'initial',\n textDecorationColor: 'initial',\n },\n});\n\n/**\n * Apply styling to the MenuItemLink slots based on the state\n */\nexport const useMenuItemLinkStyles_unstable = (state: MenuItemLinkState): MenuItemLinkState => {\n 'use no memo';\n\n useMenuItemStyles_unstable(state as MenuItemState);\n const styles = useStyles();\n state.root.className = mergeClasses(menuItemLinkClassNames.root, styles.resetLink, state.root.className);\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemLinkClassNames.icon, state.icon.className);\n }\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemLinkClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemLinkClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemLinkClassNames.checkmark, state.checkmark.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useMenuItemStyles_unstable","menuItemLinkClassNames","root","icon","checkmark","content","secondaryContent","useStyles","resetLink","textDecorationLine","textDecorationThickness","textDecorationStyle","textDecorationColor","useMenuItemLinkStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,SAASC,0BAA0B,QAAQ,uCAAuC;AAGlF,OAAO,MAAMC,yBAA4D;IACvEC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,SAAS;IACTC,kBAAkB;AACpB,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYT,WAAW;IAC3BU,WAAW;QACTC,oBAAoB;QACpBC,yBAAyB;QACzBC,qBAAqB;QACrBC,qBAAqB;IACvB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,iCAAiC,CAACC;IAC7C;IAEAd,2BAA2Bc;IAC3B,MAAMC,SAASR;IACfO,MAAMZ,IAAI,CAACc,SAAS,GAAGjB,aAAaE,uBAAuBC,IAAI,EAAEa,OAAOP,SAAS,EAAEM,MAAMZ,IAAI,CAACc,SAAS;IAEvG,IAAIF,MAAMX,IAAI,EAAE;QACdW,MAAMX,IAAI,CAACa,SAAS,GAAGjB,aAAaE,uBAAuBE,IAAI,EAAEW,MAAMX,IAAI,CAACa,SAAS;IACvF;IAEA,IAAIF,MAAMT,OAAO,EAAE;QACjBS,MAAMT,OAAO,CAACW,SAAS,GAAGjB,aAAaE,uBAAuBI,OAAO,EAAES,MAAMT,OAAO,CAACW,SAAS;IAChG;IAEA,IAAIF,MAAMR,gBAAgB,EAAE;QAC1BQ,MAAMR,gBAAgB,CAACU,SAAS,GAAGjB,aACjCE,uBAAuBK,gBAAgB,EACvCQ,MAAMR,gBAAgB,CAACU,SAAS;IAEpC;IAEA,IAAIF,MAAMV,SAAS,EAAE;QACnBU,MAAMV,SAAS,CAACY,SAAS,GAAGjB,aAAaE,uBAAuBG,SAAS,EAAEU,MAAMV,SAAS,CAACY,SAAS;IACtG;IAEA,OAAOF;AACT,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuItemSwitch/MenuItemSwitch.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { MenuItemSlots } from '../MenuItem/MenuItem.types';\nimport { MenuItemSelectableState } from '../../selectable/types';\nimport { MenuItemCheckboxProps } from '../MenuItemCheckbox/MenuItemCheckbox.types';\n\nexport type MenuItemSwitchSlots = Pick<MenuItemSlots, 'root' | 'content' | 'secondaryContent' | 'icon' | 'subText'> & {\n switchIndicator?: Slot<'span'>;\n};\n\n/**\n * MenuItemSwitch Props\n */\nexport type MenuItemSwitchProps = ComponentProps<MenuItemSwitchSlots> &\n Pick<MenuItemCheckboxProps, 'disabled' | 'persistOnClick' | 'name' | 'value'>;\n\n/**\n * State used in rendering MenuItemSwitch\n */\nexport type MenuItemSwitchState = ComponentState<MenuItemSwitchSlots> &\n MenuItemSelectableState &\n Required<Pick<MenuItemSwitchProps, 'disabled'>>;\n"],"names":[],"mappings":"AAeA;;CAEC,GACD,WAEkD"}
1
+ {"version":3,"sources":["../src/components/MenuItemSwitch/MenuItemSwitch.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { MenuItemSlots } from '../MenuItem/MenuItem.types';\nimport type { MenuItemSelectableState } from '../../selectable/types';\nimport type { MenuItemCheckboxProps } from '../MenuItemCheckbox/MenuItemCheckbox.types';\n\nexport type MenuItemSwitchSlots = Pick<MenuItemSlots, 'root' | 'content' | 'secondaryContent' | 'icon' | 'subText'> & {\n switchIndicator?: Slot<'span'>;\n};\n\n/**\n * MenuItemSwitch Props\n */\nexport type MenuItemSwitchProps = ComponentProps<MenuItemSwitchSlots> &\n Pick<MenuItemCheckboxProps, 'disabled' | 'persistOnClick' | 'name' | 'value'>;\n\n/**\n * State used in rendering MenuItemSwitch\n */\nexport type MenuItemSwitchState = ComponentState<MenuItemSwitchSlots> &\n MenuItemSelectableState &\n Required<Pick<MenuItemSwitchProps, 'disabled'>>;\n"],"names":[],"mappings":"AAeA;;CAEC,GACD,WAEkD"}
@@ -1 +1,3 @@
1
- import * as React from 'react';
1
+ /**
2
+ * @deprecated this type is not being used internally anymore
3
+ */ export { };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuList/MenuList.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { MenuListContextValue } from '../../contexts/menuListContext';\nimport type { SelectableHandler } from '../../selectable/index';\n\nexport type MenuCheckedValueChangeEvent = React.MouseEvent | React.KeyboardEvent;\n\nexport type MenuCheckedValueChangeData = {\n /** The items for this value that are checked */\n checkedItems: string[];\n /** The name of the value */\n name: string;\n};\n\nexport type MenuListSlots = {\n root: Slot<'div'>;\n};\n\nexport type MenuListProps = ComponentProps<MenuListSlots> & {\n /**\n * Map of all checked values\n */\n checkedValues?: Record<string, string[]>;\n\n /**\n * Default values to be checked on mount\n */\n defaultCheckedValues?: Record<string, string[]>;\n\n /**\n * States that menu items can contain selectable items and reserve slots for item alignment\n */\n hasCheckmarks?: boolean;\n\n /**\n * States that menu items can contain icons and reserve slots for item alignment\n */\n hasIcons?: boolean;\n\n /**\n * Callback when checked items change for value with a name\n *\n * @param event - React's original SyntheticEvent\n * @param data - A data object with relevant information\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onCheckedValueChange?: (e: MenuCheckedValueChangeEvent, data: MenuCheckedValueChangeData) => void;\n};\n\nexport type MenuListState = ComponentState<MenuListSlots> &\n Required<Pick<MenuListProps, 'checkedValues' | 'hasCheckmarks' | 'hasIcons'>> &\n Pick<MenuListProps, 'defaultCheckedValues' | 'onCheckedValueChange'> & {\n /**\n * Selects a radio item, will de-select the currently selected ratio item\n */\n selectRadio: SelectableHandler;\n\n /**\n * Callback to set focus on the next menu item by first character\n */\n setFocusByFirstCharacter: NonNullable<MenuListContextValue['setFocusByFirstCharacter']>;\n\n /*\n * Toggles the state of a checkbox item\n */\n toggleCheckbox: SelectableHandler;\n\n /**\n * States if the MenuList is inside MenuContext\n */\n hasMenuContext?: boolean;\n };\n\nexport type MenuListContextValues = {\n menuList: MenuListContextValue;\n};\n\n/**\n * @deprecated this type is not being used internally anymore\n */\nexport type UninitializedMenuListState = Omit<\n MenuListState,\n 'checkedValues' | 'selectRadio' | 'setFocusByFirstCharacter' | 'toggleCheckbox'\n> &\n Partial<Pick<MenuListState, 'checkedValues'>>;\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
1
+ {"version":3,"sources":["../src/components/MenuList/MenuList.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { MenuListContextValue } from '../../contexts/menuListContext';\nimport type { SelectableHandler } from '../../selectable/index';\n\nexport type MenuCheckedValueChangeEvent = React.MouseEvent | React.KeyboardEvent;\n\nexport type MenuCheckedValueChangeData = {\n /** The items for this value that are checked */\n checkedItems: string[];\n /** The name of the value */\n name: string;\n};\n\nexport type MenuListSlots = {\n root: Slot<'div'>;\n};\n\nexport type MenuListProps = ComponentProps<MenuListSlots> & {\n /**\n * Map of all checked values\n */\n checkedValues?: Record<string, string[]>;\n\n /**\n * Default values to be checked on mount\n */\n defaultCheckedValues?: Record<string, string[]>;\n\n /**\n * States that menu items can contain selectable items and reserve slots for item alignment\n */\n hasCheckmarks?: boolean;\n\n /**\n * States that menu items can contain icons and reserve slots for item alignment\n */\n hasIcons?: boolean;\n\n /**\n * Callback when checked items change for value with a name\n *\n * @param event - React's original SyntheticEvent\n * @param data - A data object with relevant information\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onCheckedValueChange?: (e: MenuCheckedValueChangeEvent, data: MenuCheckedValueChangeData) => void;\n};\n\nexport type MenuListState = ComponentState<MenuListSlots> &\n Required<Pick<MenuListProps, 'checkedValues' | 'hasCheckmarks' | 'hasIcons'>> &\n Pick<MenuListProps, 'defaultCheckedValues' | 'onCheckedValueChange'> & {\n /**\n * Selects a radio item, will de-select the currently selected ratio item\n */\n selectRadio: SelectableHandler;\n\n /**\n * Callback to set focus on the next menu item by first character\n */\n setFocusByFirstCharacter: NonNullable<MenuListContextValue['setFocusByFirstCharacter']>;\n\n /*\n * Toggles the state of a checkbox item\n */\n toggleCheckbox: SelectableHandler;\n\n /**\n * States if the MenuList is inside MenuContext\n */\n hasMenuContext?: boolean;\n };\n\nexport type MenuListContextValues = {\n menuList: MenuListContextValue;\n};\n\n/**\n * @deprecated this type is not being used internally anymore\n */\nexport type UninitializedMenuListState = Omit<\n MenuListState,\n 'checkedValues' | 'selectRadio' | 'setFocusByFirstCharacter' | 'toggleCheckbox'\n> &\n Partial<Pick<MenuListState, 'checkedValues'>>;\n"],"names":[],"mappings":"AA6EA;;CAEC,GACD,WAIgD"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuList/renderMenuList.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { MenuListContextValues, MenuListSlots, MenuListState } from './MenuList.types';\nimport { MenuListProvider } from '../../contexts/menuListContext';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderMenuList_unstable = (state: MenuListState, contextValues: MenuListContextValues): JSXElement => {\n assertSlots<MenuListSlots>(state);\n\n return (\n <MenuListProvider value={contextValues.menuList}>\n <state.root />\n </MenuListProvider>\n );\n};\n"],"names":["assertSlots","MenuListProvider","renderMenuList_unstable","state","contextValues","value","menuList","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,gBAAgB,QAAQ,iCAAiC;AAElE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAsBC;IAC5DJ,YAA2BG;IAE3B,qBACE,KAACF;QAAiBI,OAAOD,cAAcE,QAAQ;kBAC7C,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuList/renderMenuList.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { MenuListContextValues, MenuListSlots, MenuListState } from './MenuList.types';\nimport { MenuListProvider } from '../../contexts/menuListContext';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderMenuList_unstable = (state: MenuListState, contextValues: MenuListContextValues): JSXElement => {\n assertSlots<MenuListSlots>(state);\n\n return (\n <MenuListProvider value={contextValues.menuList}>\n <state.root />\n </MenuListProvider>\n );\n};\n"],"names":["assertSlots","MenuListProvider","renderMenuList_unstable","state","contextValues","value","menuList","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,gBAAgB,QAAQ,iCAAiC;AAElE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAsBC;IAC5DJ,YAA2BG;IAE3B,qBACE,KAACF;QAAiBI,OAAOD,cAAcE,QAAQ;kBAC7C,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
@@ -1,14 +1,22 @@
1
+ 'use client';
2
+ import * as React from 'react';
1
3
  export function useMenuListContextValues_unstable(state) {
2
4
  const { checkedValues, hasCheckmarks, hasIcons, selectRadio, setFocusByFirstCharacter, toggleCheckbox } = state;
3
- // This context is created with "@fluentui/react-context-selector", these is no sense to memoize it
4
- const menuList = {
5
+ const menuList = React.useMemo(()=>({
6
+ checkedValues,
7
+ hasCheckmarks,
8
+ hasIcons,
9
+ selectRadio,
10
+ setFocusByFirstCharacter,
11
+ toggleCheckbox
12
+ }), [
5
13
  checkedValues,
6
14
  hasCheckmarks,
7
15
  hasIcons,
8
16
  selectRadio,
9
17
  setFocusByFirstCharacter,
10
18
  toggleCheckbox
11
- };
19
+ ]);
12
20
  return {
13
21
  menuList
14
22
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuList/useMenuListContextValues.ts"],"sourcesContent":["import type { MenuListContextValues, MenuListState } from './MenuList.types';\n\nexport function useMenuListContextValues_unstable(state: MenuListState): MenuListContextValues {\n const { checkedValues, hasCheckmarks, hasIcons, selectRadio, setFocusByFirstCharacter, toggleCheckbox } = state;\n\n // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n const menuList = {\n checkedValues,\n hasCheckmarks,\n hasIcons,\n selectRadio,\n setFocusByFirstCharacter,\n toggleCheckbox,\n };\n\n return { menuList };\n}\n"],"names":["useMenuListContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","selectRadio","setFocusByFirstCharacter","toggleCheckbox","menuList"],"mappings":"AAEA,OAAO,SAASA,kCAAkCC,KAAoB;IACpE,MAAM,EAAEC,aAAa,EAAEC,aAAa,EAAEC,QAAQ,EAAEC,WAAW,EAAEC,wBAAwB,EAAEC,cAAc,EAAE,GAAGN;IAE1G,mGAAmG;IACnG,MAAMO,WAAW;QACfN;QACAC;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,OAAO;QAAEC;IAAS;AACpB"}
1
+ {"version":3,"sources":["../src/components/MenuList/useMenuListContextValues.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { MenuListContextValues, MenuListState } from './MenuList.types';\n\nexport function useMenuListContextValues_unstable(state: MenuListState): MenuListContextValues {\n const { checkedValues, hasCheckmarks, hasIcons, selectRadio, setFocusByFirstCharacter, toggleCheckbox } = state;\n\n const menuList = React.useMemo(\n () => ({\n checkedValues,\n hasCheckmarks,\n hasIcons,\n selectRadio,\n setFocusByFirstCharacter,\n toggleCheckbox,\n }),\n [checkedValues, hasCheckmarks, hasIcons, selectRadio, setFocusByFirstCharacter, toggleCheckbox],\n );\n\n return { menuList };\n}\n"],"names":["React","useMenuListContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","selectRadio","setFocusByFirstCharacter","toggleCheckbox","menuList","useMemo"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,kCAAkCC,KAAoB;IACpE,MAAM,EAAEC,aAAa,EAAEC,aAAa,EAAEC,QAAQ,EAAEC,WAAW,EAAEC,wBAAwB,EAAEC,cAAc,EAAE,GAAGN;IAE1G,MAAMO,WAAWT,MAAMU,OAAO,CAC5B,IAAO,CAAA;YACLP;YACAC;YACAC;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QAACL;QAAeC;QAAeC;QAAUC;QAAaC;QAA0BC;KAAe;IAGjG,OAAO;QAAEC;IAAS;AACpB"}
@@ -1 +1,3 @@
1
- import * as React from 'react';
1
+ /**
2
+ * State used in rendering MenuPopover
3
+ */ export { };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuPopover/MenuPopover.types.ts"],"sourcesContent":["import type { PortalProps } from '@fluentui/react-portal';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nexport type MenuPopoverSlots = {\n root: Slot<'div'>;\n};\n\n/**\n * MenuPopover Props\n */\nexport type MenuPopoverProps = ComponentProps<MenuPopoverSlots>;\n\n/**\n * State used in rendering MenuPopover\n */\nexport type MenuPopoverState = ComponentState<MenuPopoverSlots> &\n Pick<PortalProps, 'mountNode'> & {\n /**\n * Root menus are rendered out of DOM order on `document.body`, use this to render the menu in DOM order\n * This option is disregarded for submenus\n */\n inline: boolean;\n\n safeZone?: React.ReactElement | null;\n };\n"],"names":["React"],"mappings":"AAEA,YAAYA,WAAW,QAAQ"}
1
+ {"version":3,"sources":["../src/components/MenuPopover/MenuPopover.types.ts"],"sourcesContent":["import type { PortalProps } from '@fluentui/react-portal';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type * as React from 'react';\n\nexport type MenuPopoverSlots = {\n root: Slot<'div'>;\n};\n\n/**\n * MenuPopover Props\n */\nexport type MenuPopoverProps = ComponentProps<MenuPopoverSlots>;\n\n/**\n * State used in rendering MenuPopover\n */\nexport type MenuPopoverState = ComponentState<MenuPopoverSlots> &\n Pick<PortalProps, 'mountNode'> & {\n /**\n * Root menus are rendered out of DOM order on `document.body`, use this to render the menu in DOM order\n * This option is disregarded for submenus\n */\n inline: boolean;\n\n safeZone?: React.ReactElement | null;\n };\n"],"names":[],"mappings":"AAaA;;CAEC,GACD,WASI"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuPopover/renderMenuPopover.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport { Portal } from '@fluentui/react-portal';\n\n/**\n * Render the final JSX of MenuPopover\n */\nexport const renderMenuPopover_unstable = (state: MenuPopoverState): JSXElement => {\n assertSlots<MenuPopoverSlots>(state);\n\n if (state.inline) {\n return (\n <>\n <state.root />\n {state.safeZone}\n </>\n );\n }\n\n return (\n <Portal mountNode={state.mountNode}>\n <state.root />\n {state.safeZone}\n </Portal>\n );\n};\n"],"names":["assertSlots","Portal","renderMenuPopover_unstable","state","inline","root","safeZone","mountNode"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,MAAM,QAAQ,yBAAyB;AAEhD;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzCH,YAA8BG;IAE9B,IAAIA,MAAMC,MAAM,EAAE;QAChB,qBACE;;8BACE,KAACD,MAAME,IAAI;gBACVF,MAAMG,QAAQ;;;IAGrB;IAEA,qBACE,MAACL;QAAOM,WAAWJ,MAAMI,SAAS;;0BAChC,KAACJ,MAAME,IAAI;YACVF,MAAMG,QAAQ;;;AAGrB,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuPopover/renderMenuPopover.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport { Portal } from '@fluentui/react-portal';\n\n/**\n * Render the final JSX of MenuPopover\n */\nexport const renderMenuPopover_unstable = (state: MenuPopoverState): JSXElement => {\n assertSlots<MenuPopoverSlots>(state);\n\n if (state.inline) {\n return (\n <>\n <state.root />\n {state.safeZone}\n </>\n );\n }\n\n return (\n <Portal mountNode={state.mountNode}>\n <state.root />\n {state.safeZone}\n </Portal>\n );\n};\n"],"names":["assertSlots","Portal","renderMenuPopover_unstable","state","inline","root","safeZone","mountNode"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,MAAM,QAAQ,yBAAyB;AAEhD;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzCH,YAA8BG;IAE9B,IAAIA,MAAMC,MAAM,EAAE;QAChB,qBACE;;8BACE,KAACD,MAAME,IAAI;gBACVF,MAAMG,QAAQ;;;IAGrB;IAEA,qBACE,MAACL;QAAOM,WAAWJ,MAAMI,SAAS;;0BAChC,KAACJ,MAAME,IAAI;YACVF,MAAMG,QAAQ;;;AAGrB,EAAE"}
@@ -6,6 +6,7 @@ import { useRestoreFocusSource } from '@fluentui/react-tabster';
6
6
  import { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot, useTimeout } from '@fluentui/react-utilities';
7
7
  import * as React from 'react';
8
8
  import { useMenuContext_unstable } from '../../contexts/menuContext';
9
+ import { useMenuListContext_unstable } from '../../contexts/menuListContext';
9
10
  import { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';
10
11
  /**
11
12
  * Create the state required to render MenuPopover.
@@ -24,6 +25,10 @@ import { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';
24
25
  const openOnHover = useMenuContext_unstable((context)=>context.openOnHover);
25
26
  const triggerRef = useMenuContext_unstable((context)=>context.triggerRef);
26
27
  const isSubmenu = useIsSubmenu();
28
+ const shouldCloseOnArrowLeft = useMenuListContext_unstable((ctx)=>{
29
+ var _ctx_shouldCloseOnArrowLeft;
30
+ return (_ctx_shouldCloseOnArrowLeft = ctx.shouldCloseOnArrowLeft) !== null && _ctx_shouldCloseOnArrowLeft !== void 0 ? _ctx_shouldCloseOnArrowLeft : true;
31
+ });
27
32
  const canDispatchCustomEventRef = React.useRef(true);
28
33
  const restoreFocusSourceAttributes = useRestoreFocusSource();
29
34
  const [setThrottleTimeout, clearThrottleTimeout] = useTimeout();
@@ -83,7 +88,7 @@ import { dispatchMenuEnterEvent, useIsSubmenu } from '../../utils/index';
83
88
  });
84
89
  rootProps.onKeyDown = useEventCallback((event)=>{
85
90
  const key = event.key;
86
- if (key === Escape || isSubmenu && key === CloseArrowKey) {
91
+ if (key === Escape || isSubmenu && shouldCloseOnArrowLeft && key === CloseArrowKey) {
87
92
  var _popoverRef_current;
88
93
  if (open && ((_popoverRef_current = popoverRef.current) === null || _popoverRef_current === void 0 ? void 0 : _popoverRef_current.contains(event.target)) && !event.isDefaultPrevented()) {
89
94
  setOpen(event, {