@fluentui/react-menu 9.6.11 → 9.7.0

package/CHANGELOG.json

@@ -2,7 +2,107 @@
   "name": "@fluentui/react-menu",
   "entries": [
     {
-      "date": "Wed, 15 Feb 2023 11:41:24 GMT",
+      "date": "Wed, 08 Mar 2023 17:39:01 GMT",
+      "tag": "@fluentui/react-menu_v9.7.0",
+      "version": "9.7.0",
+      "comments": {
+        "minor": [
+          {
+            "author": "lingfangao@hotmail.com",
+            "package": "@fluentui/react-menu",
+            "commit": "020829cf01db3ca0baffcd0dc640a34a91b548d3",
+            "comment": "feat: Implements `fallback` positioning option"
+          },
+          {
+            "author": "olfedias@microsoft.com",
+            "package": "@fluentui/react-menu",
+            "commit": "cd60ce9b960b7c107fee94ff41288540e917789a",
+            "comment": "feat: add `mountNode` prop to `Menu`"
+          },
+          {
+            "author": "gcox@microsoft.com",
+            "package": "@fluentui/react-menu",
+            "commit": "aec274eb0cfe178797c8e832a65370b9d05be909",
+            "comment": "feat: custom styles"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-aria to v9.3.11",
+            "commit": "e0d11faf97f6466f4cd23ed18266cf1e80094f56"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-context-selector to v9.1.11",
+            "commit": "e0d11faf97f6466f4cd23ed18266cf1e80094f56"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-portal to v9.1.10",
+            "commit": "e0d11faf97f6466f4cd23ed18266cf1e80094f56"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-positioning to v9.5.1",
+            "commit": "e0d11faf97f6466f4cd23ed18266cf1e80094f56"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-shared-contexts to v9.3.0",
+            "commit": "e0d11faf97f6466f4cd23ed18266cf1e80094f56"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-tabster to v9.5.4",
+            "commit": "e0d11faf97f6466f4cd23ed18266cf1e80094f56"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-utilities to v9.6.1",
+            "commit": "e0d11faf97f6466f4cd23ed18266cf1e80094f56"
+          }
+        ],
+        "patch": [
+          {
+            "author": "kakrookaran@gmail.com",
+            "package": "@fluentui/react-menu",
+            "commit": "6331a0df348dd5c6e834796009215fdbafcef84c",
+            "comment": "updated hover icon styles in MenuItem"
+          }
+        ],
+        "none": [
+          {
+            "author": "martinhochel@microsoft.com",
+            "package": "@fluentui/react-menu",
+            "commit": "677a67b551966986db34a6fac608cb89ee150471",
+            "comment": "style: apply prettier 2.3-2.8 formatting on whole codebase"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 22 Feb 2023 23:06:07 GMT",
+      "tag": "@fluentui/react-menu_v9.6.12",
+      "version": "9.6.12",
+      "comments": {
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-positioning to v9.5.0",
+            "commit": "9ee6caa17f745e014ecba467a4528181ae49be30"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 15 Feb 2023 11:44:52 GMT",
       "tag": "@fluentui/react-menu_v9.6.11",
       "version": "9.6.11",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,43 @@
 # Change Log - @fluentui/react-menu
 
-This log was last generated on Wed, 15 Feb 2023 11:41:24 GMT and should not be manually modified.
+This log was last generated on Wed, 08 Mar 2023 17:39:01 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.7.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu_v9.7.0)
+
+Wed, 08 Mar 2023 17:39:01 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu_v9.6.12..@fluentui/react-menu_v9.7.0)
+
+### Minor changes
+
+- feat: Implements `fallback` positioning option ([PR #26980](https://github.com/microsoft/fluentui/pull/26980) by lingfangao@hotmail.com)
+- feat: add `mountNode` prop to `Menu` ([PR #27007](https://github.com/microsoft/fluentui/pull/27007) by olfedias@microsoft.com)
+- feat: custom styles ([PR #27068](https://github.com/microsoft/fluentui/pull/27068) by gcox@microsoft.com)
+- Bump @fluentui/react-aria to v9.3.11 ([PR #27127](https://github.com/microsoft/fluentui/pull/27127) by beachball)
+- Bump @fluentui/react-context-selector to v9.1.11 ([PR #27127](https://github.com/microsoft/fluentui/pull/27127) by beachball)
+- Bump @fluentui/react-portal to v9.1.10 ([PR #27127](https://github.com/microsoft/fluentui/pull/27127) by beachball)
+- Bump @fluentui/react-positioning to v9.5.1 ([PR #27127](https://github.com/microsoft/fluentui/pull/27127) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.3.0 ([PR #27127](https://github.com/microsoft/fluentui/pull/27127) by beachball)
+- Bump @fluentui/react-tabster to v9.5.4 ([PR #27127](https://github.com/microsoft/fluentui/pull/27127) by beachball)
+- Bump @fluentui/react-utilities to v9.6.1 ([PR #27127](https://github.com/microsoft/fluentui/pull/27127) by beachball)
+
+### Patches
+
+- updated hover icon styles in MenuItem ([PR #27028](https://github.com/microsoft/fluentui/pull/27028) by kakrookaran@gmail.com)
+
+## [9.6.12](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu_v9.6.12)
+
+Wed, 22 Feb 2023 23:06:07 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu_v9.6.11..@fluentui/react-menu_v9.6.12)
+
+### Patches
+
+- Bump @fluentui/react-positioning to v9.5.0 ([PR #26616](https://github.com/microsoft/fluentui/pull/26616) by beachball)
+
 ## [9.6.11](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu_v9.6.11)
 
-Wed, 15 Feb 2023 11:41:24 GMT 
+Wed, 15 Feb 2023 11:44:52 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu_v9.6.10..@fluentui/react-menu_v9.6.11)
 
 ### Patches

package/dist/index.d.ts

@@ -7,6 +7,7 @@ import type { ComponentProps } from '@fluentui/react-utilities';
 import type { ComponentState } from '@fluentui/react-utilities';
 import type { ContextSelector } from '@fluentui/react-context-selector';
 import type { ForwardRefComponent } from '@fluentui/react-utilities';
+import type { PortalProps } from '@fluentui/react-portal';
 import type { PositioningShorthand } from '@fluentui/react-positioning';
 import { PositioningVirtualElement } from '@fluentui/react-positioning';
 import * as React_2 from 'react';
@@ -34,7 +35,7 @@ export declare type MenuCheckedValueChangeEvent = React_2.MouseEvent | React_2.K
  *
  * Extends and drills down MenuList props to simplify API
  */
-export declare type MenuContextValue = Pick<MenuState, 'openOnHover' | 'openOnContext' | 'triggerRef' | 'menuPopoverRef' | 'setOpen' | 'isSubmenu' | 'triggerId' | 'hasIcons' | 'hasCheckmarks' | 'persistOnItemClick' | 'inline' | 'checkedValues' | 'onCheckedValueChange'> & {
+export declare type MenuContextValue = Pick<MenuState, 'openOnHover' | 'openOnContext' | 'triggerRef' | 'menuPopoverRef' | 'setOpen' | 'isSubmenu' | 'mountNode' | 'triggerId' | 'hasIcons' | 'hasCheckmarks' | 'persistOnItemClick' | 'inline' | 'checkedValues' | 'onCheckedValueChange'> & {
     open: boolean;
     triggerId: string;
     /**
@@ -376,7 +377,7 @@ export declare type MenuPopoverSlots = {
 /**
  * State used in rendering MenuPopover
  */
-export declare type MenuPopoverState = ComponentState<MenuPopoverSlots> & {
+export declare type MenuPopoverState = ComponentState<MenuPopoverSlots> & Pick<PortalProps, 'mountNode'> & {
     /**
      * Root menus are rendered out of DOM order on `document.body`, use this to render the menu in DOM order
      * This option is disregarded for submenus
@@ -387,7 +388,7 @@ export declare type MenuPopoverState = ComponentState<MenuPopoverSlots> & {
 /**
  * Extends and drills down Menulist props to simplify API
  */
-export declare type MenuProps = ComponentProps<MenuSlots> & Pick<MenuListProps, 'checkedValues' | 'defaultCheckedValues' | 'hasCheckmarks' | 'hasIcons' | 'onCheckedValueChange'> & {
+export declare type MenuProps = ComponentProps<MenuSlots> & Pick<PortalProps, 'mountNode'> & Pick<MenuListProps, 'checkedValues' | 'defaultCheckedValues' | 'hasCheckmarks' | 'hasIcons' | 'onCheckedValueChange'> & {
     /**
      * Can contain two children including {@link MenuTrigger} and {@link MenuPopover}.
      * Alternatively can only contain {@link MenuPopover} if using a custom `target`.
@@ -476,7 +477,7 @@ export declare type MenuSplitGroupSlots = {
  */
 export declare type MenuSplitGroupState = ComponentState<MenuSplitGroupSlots>;
 
-export declare type MenuState = ComponentState<MenuSlots> & Required<Pick<MenuProps, 'hasCheckmarks' | 'hasIcons' | 'inline' | 'checkedValues' | 'onCheckedValueChange' | 'open' | 'openOnHover' | 'closeOnScroll' | 'hoverDelay' | 'openOnContext' | 'persistOnItemClick'>> & {
+export declare type MenuState = ComponentState<MenuSlots> & Required<Pick<MenuProps, 'hasCheckmarks' | 'hasIcons' | 'mountNode' | 'inline' | 'checkedValues' | 'onCheckedValueChange' | 'open' | 'openOnHover' | 'closeOnScroll' | 'hoverDelay' | 'openOnContext' | 'persistOnItemClick'>> & {
     /**
      * Anchors the popper to the mouse click for context events
      */

package/lib/components/Menu/Menu.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AACA,SAASA,gBAAgB,QAAQ,WAAW;AAC5C,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,mBAAmB,QAAQ,cAAc;AAGlD;;;AAGA,OAAO,MAAMC,IAAI,GAAwBC,KAAK,IAAG;EAC/C,MAAMC,KAAK,GAAGL,gBAAgB,CAACI,KAAK,CAAC;EACrC,MAAME,aAAa,GAAGL,6BAA6B,CAACI,KAAK,CAAC;EAE1D,OAAOH,mBAAmB,CAACG,KAAK,EAAEC,aAAa,CAAC;AAClD,CAAC;AAEDH,IAAI,CAACI,WAAW,GAAG,MAAM","names":["useMenu_unstable","useMenuContextValues_unstable","renderMenu_unstable","Menu","props","state","contextValues","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/Menu/Menu.tsx"],"sourcesContent":["import * 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"]}
+{"version":3,"names":["useMenu_unstable","useMenuContextValues_unstable","renderMenu_unstable","Menu","props","state","contextValues","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/Menu/Menu.tsx"],"sourcesContent":["import * 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"],"mappings":"AACA,SAASA,gBAAgB,QAAQ,WAAW;AAC5C,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,mBAAmB,QAAQ,cAAc;AAGlD;;;AAGA,OAAO,MAAMC,IAAI,GAAwBC,KAAK,IAAG;EAC/C,MAAMC,KAAK,GAAGL,gBAAgB,CAACI,KAAK,CAAC;EACrC,MAAME,aAAa,GAAGL,6BAA6B,CAACI,KAAK,CAAC;EAE1D,OAAOH,mBAAmB,CAACG,KAAK,EAAEC,aAAa,CAAC;AAClD,CAAC;AAEDH,IAAI,CAACI,WAAW,GAAG,MAAM"}

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

@@ -1 +1 @@
-{"version":3,"file":"Menu.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/Menu/Menu.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { PositioningVirtualElement, SetVirtualMouseTarget } from '@fluentui/react-positioning';\nimport type { PositioningShorthand } from '@fluentui/react-positioning';\nimport type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { MenuContextValue } from '../../contexts/menuContext';\nimport type { MenuListProps } from '../MenuList/MenuList.types';\n\nexport type MenuSlots = {};\n\n/**\n * Extends and drills down Menulist props to simplify API\n */\nexport type MenuProps = ComponentProps<MenuSlots> &\n  Pick<\n    MenuListProps,\n    'checkedValues' | 'defaultCheckedValues' | 'hasCheckmarks' | 'hasIcons' | 'onCheckedValueChange'\n  > & {\n    /**\n     * Can contain two children including {@link MenuTrigger} and {@link MenuPopover}.\n     * Alternatively can only contain {@link MenuPopover} if using a custom `target`.\n     */\n    children: [JSX.Element, JSX.Element] | JSX.Element;\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    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<MenuSlots> &\n  Required<\n    Pick<\n      MenuProps,\n      | 'hasCheckmarks'\n      | 'hasIcons'\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    menuPopoverRef: React.MutableRefObject<HTMLElement>;\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) => 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    triggerRef: React.MutableRefObject<HTMLElement>;\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\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: '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"]}
+{"version":3,"file":"Menu.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/Menu/Menu.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\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 } from '@fluentui/react-utilities';\nimport type { MenuContextValue } from '../../contexts/menuContext';\nimport type { MenuListProps } from '../MenuList/MenuList.types';\n\nexport type MenuSlots = {};\n\n/**\n * Extends and drills down Menulist props to simplify API\n */\nexport type MenuProps = ComponentProps<MenuSlots> &\n  Pick<PortalProps, 'mountNode'> &\n  Pick<\n    MenuListProps,\n    'checkedValues' | 'defaultCheckedValues' | 'hasCheckmarks' | 'hasIcons' | 'onCheckedValueChange'\n  > & {\n    /**\n     * Can contain two children including {@link MenuTrigger} and {@link MenuPopover}.\n     * Alternatively can only contain {@link MenuPopover} if using a custom `target`.\n     */\n    children: [JSX.Element, JSX.Element] | JSX.Element;\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    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<MenuSlots> &\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    menuPopoverRef: React.MutableRefObject<HTMLElement>;\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) => 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    triggerRef: React.MutableRefObject<HTMLElement>;\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\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: '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"]}

package/lib/components/Menu/renderMenu.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,YAAY,QAAQ,4BAA4B;AAGzD;;;AAGA,OAAO,MAAMC,mBAAmB,GAAG,CAACC,KAAgB,EAAEC,aAAgC,KAAI;EACxF,oBACEJ,oBAACC,YAAY;IAACI,KAAK,EAAED,aAAa,CAACE;EAAI,GACpCH,KAAK,CAACI,WAAW,EACjBJ,KAAK,CAACK,IAAI,IAAIL,KAAK,CAACM,WAAW,CACnB;AAEnB,CAAC","names":["React","MenuProvider","renderMenu_unstable","state","contextValues","value","menu","menuTrigger","open","menuPopover"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/Menu/renderMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { MenuProvider } from '../../contexts/menuContext';\nimport type { MenuContextValues, MenuState } from './Menu.types';\n\n/**\n * Render the final JSX of Menu\n */\nexport const renderMenu_unstable = (state: MenuState, contextValues: MenuContextValues) => {\n  return (\n    <MenuProvider value={contextValues.menu}>\n      {state.menuTrigger}\n      {state.open && state.menuPopover}\n    </MenuProvider>\n  );\n};\n"]}
+{"version":3,"names":["React","MenuProvider","renderMenu_unstable","state","contextValues","createElement","value","menu","menuTrigger","open","menuPopover"],"sources":["../src/packages/react-components/react-menu/src/components/Menu/renderMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { MenuProvider } from '../../contexts/menuContext';\nimport type { MenuContextValues, MenuState } from './Menu.types';\n\n/**\n * Render the final JSX of Menu\n */\nexport const renderMenu_unstable = (state: MenuState, contextValues: MenuContextValues) => {\n  return (\n    <MenuProvider value={contextValues.menu}>\n      {state.menuTrigger}\n      {state.open && state.menuPopover}\n    </MenuProvider>\n  );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,YAAY,QAAQ,4BAA4B;AAGzD;;;AAGA,OAAO,MAAMC,mBAAmB,GAAGA,CAACC,KAAgB,EAAEC,aAAgC,KAAI;EACxF,oBACEJ,KAAA,CAAAK,aAAA,CAACJ,YAAY;IAACK,KAAK,EAAEF,aAAa,CAACG;EAAI,GACpCJ,KAAK,CAACK,WAAW,EACjBL,KAAK,CAACM,IAAI,IAAIN,KAAK,CAACO,WAAW,CACnB;AAEnB,CAAC"}

package/lib/components/Menu/useMenu.js

@@ -7,6 +7,9 @@ import { useFocusFinders } from '@fluentui/react-tabster';
 import { useMenuContext_unstable } from '../../contexts/menuContext';
 import { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';
 import { useIsSubmenu } from '../../utils/useIsSubmenu';
+// If it's not possible to position the submenu in smaller viewports, try
+// and fallback to this order of positions
+const submenuFallbackPositions = ['after', 'after-bottom', 'before-top', 'before', 'before-bottom', 'above'];
 /**
  * Create the state required to render Menu.
  *
@@ -26,7 +29,8 @@ export const useMenu_unstable = props => {
     openOnContext = false,
     persistOnItemClick = false,
     openOnHover = isSubmenu,
-    defaultCheckedValues
+    defaultCheckedValues,
+    mountNode = null
   } = props;
   const triggerId = useId('menu');
   const [contextTarget, setContextTarget] = usePositioningMouseTarget();
@@ -34,6 +38,7 @@ export const useMenu_unstable = props => {
     position: isSubmenu ? 'after' : 'below',
     align: isSubmenu ? 'top' : 'start',
     target: props.openOnContext ? contextTarget : undefined,
+    fallbackPositions: isSubmenu ? submenuFallbackPositions : undefined,
     ...resolvePositioningShorthand(props.positioning)
   };
   const children = React.Children.toArray(props.children);
@@ -90,6 +95,7 @@ export const useMenu_unstable = props => {
     closeOnScroll,
     menuTrigger,
     menuPopover,
+    mountNode,
     triggerRef,
     menuPopoverRef,
     components: {},

package/lib/components/Menu/useMenu.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":["React","usePositioningMouseTarget","usePositioning","resolvePositioningShorthand","useControllableState","useId","useOnClickOutside","useEventCallback","useOnScrollOutside","useFluent_unstable","useFluent","elementContains","useFocusFinders","useMenuContext_unstable","MENU_ENTER_EVENT","useOnMenuMouseEnter","useIsSubmenu","useMenu_unstable","props","isSubmenu","hoverDelay","inline","hasCheckmarks","hasIcons","closeOnScroll","openOnContext","persistOnItemClick","openOnHover","defaultCheckedValues","triggerId","contextTarget","setContextTarget","positioningState","position","align","target","undefined","positioning","children","Children","toArray","process","env","NODE_ENV","length","console","warn","menuTrigger","menuPopover","targetRef","triggerRef","containerRef","menuPopoverRef","open","setOpen","useMenuOpenState","defaultOpen","onOpenChange","checkedValues","onCheckedValueChange","useMenuSelectableState","components","setCheckedValues","state","defaultState","initialState","e","name","checkedItems","currentValue","targetDocument","parentSetOpen","context","data","shouldHandleCloseRef","useRef","setOpenTimeout","enteringTriggerRef","setOpenState","trySetOpen","event","CustomEvent","type","detail","nativeEvent","current","bubble","clearTimeout","Event","persist","contains","setTimeout","disabled","element","refs","filter","Boolean","callback","useEffect","findFirstFocusable","focusFirst","useCallback","firstFocusable","focus"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/Menu/useMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePositioningMouseTarget, usePositioning, resolvePositioningShorthand } from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport type { MenuOpenChangeData, MenuOpenEvent, MenuProps, MenuState } from './Menu.types';\n\n/**\n * Create the state required to render Menu.\n *\n * The returned state can be modified with hooks such as useMenuStyles,\n * before being passed to renderMenu_unstable.\n *\n * @param props - props from this instance of Menu\n */\nexport const useMenu_unstable = (props: MenuProps): MenuState => {\n  const isSubmenu = useIsSubmenu();\n  const {\n    hoverDelay = 500,\n    inline = false,\n    hasCheckmarks = false,\n    hasIcons = false,\n    closeOnScroll = false,\n    openOnContext = false,\n    persistOnItemClick = false,\n    openOnHover = isSubmenu,\n    defaultCheckedValues,\n  } = props;\n  const triggerId = useId('menu');\n  const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n\n  const positioningState = {\n    position: isSubmenu ? 'after' : 'below',\n    align: isSubmenu ? 'top' : 'start',\n    target: props.openOnContext ? contextTarget : undefined,\n    ...resolvePositioningShorthand(props.positioning),\n  } as const;\n\n  const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n  if (process.env.NODE_ENV !== 'production') {\n    if (children.length === 0) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at least one child');\n    }\n\n    if (children.length > 2) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at most two children');\n    }\n  }\n\n  let menuTrigger: React.ReactElement | undefined = undefined;\n  let menuPopover: React.ReactElement | undefined = undefined;\n  if (children.length === 2) {\n    menuTrigger = children[0];\n    menuPopover = children[1];\n  } else if (children.length === 1) {\n    menuPopover = children[0];\n  }\n\n  const { targetRef: triggerRef, containerRef: menuPopoverRef } = usePositioning(positioningState);\n\n  // TODO Better way to narrow types ?\n  const [open, setOpen] = useMenuOpenState({\n    hoverDelay,\n    isSubmenu,\n    setContextTarget,\n    closeOnScroll,\n    menuPopoverRef,\n    triggerRef,\n    open: props.open,\n    defaultOpen: props.defaultOpen,\n    onOpenChange: props.onOpenChange,\n    openOnContext,\n  });\n\n  const [checkedValues, onCheckedValueChange] = useMenuSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  return {\n    inline,\n    hoverDelay,\n    triggerId,\n    isSubmenu,\n    openOnHover,\n    contextTarget,\n    setContextTarget,\n    hasCheckmarks,\n    hasIcons,\n    closeOnScroll,\n    menuTrigger,\n    menuPopover,\n    triggerRef,\n    menuPopoverRef,\n    components: {},\n    openOnContext,\n    open,\n    setOpen,\n    checkedValues,\n    onCheckedValueChange,\n    persistOnItemClick,\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (\n  props: Pick<MenuProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues,\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n  const onCheckedValueChange: MenuState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    props.onCheckedValueChange?.(e, { name, checkedItems });\n\n    setCheckedValues(currentValue => ({\n      ...currentValue,\n      [name]: checkedItems,\n    }));\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n\nconst useMenuOpenState = (\n  state: Pick<\n    MenuState,\n    | 'isSubmenu'\n    | 'menuPopoverRef'\n    | 'setContextTarget'\n    | 'triggerRef'\n    | 'openOnContext'\n    | 'closeOnScroll'\n    | 'hoverDelay'\n  > &\n    Pick<MenuProps, 'open' | 'defaultOpen' | 'onOpenChange'>,\n) => {\n  const { targetDocument } = useFluent();\n  const parentSetOpen = useMenuContext_unstable(context => context.setOpen);\n  const onOpenChange: MenuProps['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n  const shouldHandleCloseRef = React.useRef(false);\n  const setOpenTimeout = React.useRef(0);\n  const enteringTriggerRef = React.useRef(false);\n\n  const [open, setOpenState] = useControllableState({\n    state: state.open,\n    defaultState: state.defaultOpen,\n    initialState: false,\n  });\n\n  const trySetOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;\n    onOpenChange?.(event, { ...data });\n    if (data.open && e.type === 'contextmenu') {\n      state.setContextTarget(e as React.MouseEvent);\n    }\n\n    if (!data.open) {\n      state.setContextTarget(undefined);\n      shouldHandleCloseRef.current = true;\n    }\n\n    if (data.bubble) {\n      parentSetOpen(e, { ...data });\n    }\n\n    setOpenState(data.open);\n  });\n\n  const setOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    clearTimeout(setOpenTimeout.current);\n    if (!(e instanceof Event) && e.persist) {\n      // < React 17 still uses pooled synthetic events\n      e.persist();\n    }\n\n    if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {\n      if (state.triggerRef.current?.contains(e.target as HTMLElement)) {\n        enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';\n      }\n\n      // FIXME leaking Node timeout type\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      setOpenTimeout.current = setTimeout(() => trySetOpen(e, data), state.hoverDelay);\n    } else {\n      trySetOpen(e, data);\n    }\n  });\n\n  useOnClickOutside({\n    contains: elementContains,\n    disabled: !open,\n    element: targetDocument,\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    callback: event => setOpen(event, { open: false, type: 'clickOutside', event }),\n  });\n\n  // only close on scroll for context, or when closeOnScroll is specified\n  const closeOnScroll = state.openOnContext || state.closeOnScroll;\n  useOnScrollOutside({\n    contains: elementContains,\n    element: targetDocument,\n    callback: event => setOpen(event, { open: false, type: 'scrollOutside', event }),\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    disabled: !open || !closeOnScroll,\n  });\n\n  useOnMenuMouseEnter({\n    element: targetDocument,\n    callback: event => {\n      // When moving from a menu directly back to its trigger, this handler can close the menu\n      // Explicitly check a flag to see if this situation happens\n      if (!enteringTriggerRef.current) {\n        setOpen(event, { open: false, type: 'menuMouseEnter', event });\n      }\n    },\n    disabled: !open,\n    refs: [state.menuPopoverRef],\n  });\n\n  // Clear timeout on unmount\n  // Setting state after a component unmounts can cause memory leaks\n  React.useEffect(() => {\n    return () => {\n      clearTimeout(setOpenTimeout.current);\n    };\n  }, []);\n\n  // Manage focus for open state\n  const { findFirstFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, state.menuPopoverRef]);\n\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (shouldHandleCloseRef.current) {\n        // We know that React effects are sync so we focus the trigger here\n        // after any event handler (event handlers will update state and re-render).\n        // Since the browser only performs the default behaviour for the Tab key once\n        // keyboard events have fully bubbled up the window, the browser will move\n        // focus to the next tabbable element before/after the trigger if needed.\n        // If the Tab key was not pressed, focus will remain on the trigger as expected.\n        state.triggerRef.current?.focus();\n      }\n    }\n\n    shouldHandleCloseRef.current = false;\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst]);\n\n  return [open, setOpen] as const;\n};\n"]}
+{"version":3,"names":["React","usePositioningMouseTarget","usePositioning","resolvePositioningShorthand","useControllableState","useId","useOnClickOutside","useEventCallback","useOnScrollOutside","useFluent_unstable","useFluent","elementContains","useFocusFinders","useMenuContext_unstable","MENU_ENTER_EVENT","useOnMenuMouseEnter","useIsSubmenu","submenuFallbackPositions","useMenu_unstable","props","isSubmenu","hoverDelay","inline","hasCheckmarks","hasIcons","closeOnScroll","openOnContext","persistOnItemClick","openOnHover","defaultCheckedValues","mountNode","triggerId","contextTarget","setContextTarget","positioningState","position","align","target","undefined","fallbackPositions","positioning","children","Children","toArray","process","env","NODE_ENV","length","console","warn","menuTrigger","menuPopover","targetRef","triggerRef","containerRef","menuPopoverRef","open","setOpen","useMenuOpenState","defaultOpen","onOpenChange","checkedValues","onCheckedValueChange","useMenuSelectableState","components","setCheckedValues","state","defaultState","initialState","e","name","checkedItems","_a","call","currentValue","targetDocument","parentSetOpen","context","data","shouldHandleCloseRef","useRef","setOpenTimeout","enteringTriggerRef","setOpenState","trySetOpen","event","CustomEvent","type","detail","nativeEvent","current","bubble","clearTimeout","Event","persist","contains","setTimeout","disabled","element","refs","filter","Boolean","callback","useEffect","findFirstFocusable","focusFirst","useCallback","firstFocusable","focus"],"sources":["../src/packages/react-components/react-menu/src/components/Menu/useMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  usePositioningMouseTarget,\n  usePositioning,\n  resolvePositioningShorthand,\n  PositioningShorthandValue,\n} from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport type { MenuOpenChangeData, MenuOpenEvent, MenuProps, MenuState } from './Menu.types';\n\n// If it's not possible to position the submenu in smaller viewports, try\n// and fallback to this order of positions\nconst submenuFallbackPositions: PositioningShorthandValue[] = [\n  'after',\n  'after-bottom',\n  'before-top',\n  'before',\n  'before-bottom',\n  'above',\n];\n\n/**\n * Create the state required to render Menu.\n *\n * The returned state can be modified with hooks such as useMenuStyles,\n * before being passed to renderMenu_unstable.\n *\n * @param props - props from this instance of Menu\n */\nexport const useMenu_unstable = (props: MenuProps): MenuState => {\n  const isSubmenu = useIsSubmenu();\n  const {\n    hoverDelay = 500,\n    inline = false,\n    hasCheckmarks = false,\n    hasIcons = false,\n    closeOnScroll = false,\n    openOnContext = false,\n    persistOnItemClick = false,\n    openOnHover = isSubmenu,\n    defaultCheckedValues,\n    mountNode = null,\n  } = props;\n  const triggerId = useId('menu');\n  const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n\n  const positioningState = {\n    position: isSubmenu ? 'after' : 'below',\n    align: isSubmenu ? 'top' : 'start',\n    target: props.openOnContext ? contextTarget : undefined,\n    fallbackPositions: isSubmenu ? submenuFallbackPositions : undefined,\n    ...resolvePositioningShorthand(props.positioning),\n  } as const;\n\n  const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n  if (process.env.NODE_ENV !== 'production') {\n    if (children.length === 0) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at least one child');\n    }\n\n    if (children.length > 2) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at most two children');\n    }\n  }\n\n  let menuTrigger: React.ReactElement | undefined = undefined;\n  let menuPopover: React.ReactElement | undefined = undefined;\n  if (children.length === 2) {\n    menuTrigger = children[0];\n    menuPopover = children[1];\n  } else if (children.length === 1) {\n    menuPopover = children[0];\n  }\n\n  const { targetRef: triggerRef, containerRef: menuPopoverRef } = usePositioning(positioningState);\n\n  // TODO Better way to narrow types ?\n  const [open, setOpen] = useMenuOpenState({\n    hoverDelay,\n    isSubmenu,\n    setContextTarget,\n    closeOnScroll,\n    menuPopoverRef,\n    triggerRef,\n    open: props.open,\n    defaultOpen: props.defaultOpen,\n    onOpenChange: props.onOpenChange,\n    openOnContext,\n  });\n\n  const [checkedValues, onCheckedValueChange] = useMenuSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  return {\n    inline,\n    hoverDelay,\n    triggerId,\n    isSubmenu,\n    openOnHover,\n    contextTarget,\n    setContextTarget,\n    hasCheckmarks,\n    hasIcons,\n    closeOnScroll,\n    menuTrigger,\n    menuPopover,\n    mountNode,\n    triggerRef,\n    menuPopoverRef,\n    components: {},\n    openOnContext,\n    open,\n    setOpen,\n    checkedValues,\n    onCheckedValueChange,\n    persistOnItemClick,\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (\n  props: Pick<MenuProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues,\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n  const onCheckedValueChange: MenuState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    props.onCheckedValueChange?.(e, { name, checkedItems });\n\n    setCheckedValues(currentValue => ({\n      ...currentValue,\n      [name]: checkedItems,\n    }));\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n\nconst useMenuOpenState = (\n  state: Pick<\n    MenuState,\n    | 'isSubmenu'\n    | 'menuPopoverRef'\n    | 'setContextTarget'\n    | 'triggerRef'\n    | 'openOnContext'\n    | 'closeOnScroll'\n    | 'hoverDelay'\n  > &\n    Pick<MenuProps, 'open' | 'defaultOpen' | 'onOpenChange'>,\n) => {\n  const { targetDocument } = useFluent();\n  const parentSetOpen = useMenuContext_unstable(context => context.setOpen);\n  const onOpenChange: MenuProps['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n  const shouldHandleCloseRef = React.useRef(false);\n  const setOpenTimeout = React.useRef(0);\n  const enteringTriggerRef = React.useRef(false);\n\n  const [open, setOpenState] = useControllableState({\n    state: state.open,\n    defaultState: state.defaultOpen,\n    initialState: false,\n  });\n\n  const trySetOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;\n    onOpenChange?.(event, { ...data });\n    if (data.open && e.type === 'contextmenu') {\n      state.setContextTarget(e as React.MouseEvent);\n    }\n\n    if (!data.open) {\n      state.setContextTarget(undefined);\n      shouldHandleCloseRef.current = true;\n    }\n\n    if (data.bubble) {\n      parentSetOpen(e, { ...data });\n    }\n\n    setOpenState(data.open);\n  });\n\n  const setOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    clearTimeout(setOpenTimeout.current);\n    if (!(e instanceof Event) && e.persist) {\n      // < React 17 still uses pooled synthetic events\n      e.persist();\n    }\n\n    if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {\n      if (state.triggerRef.current?.contains(e.target as HTMLElement)) {\n        enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';\n      }\n\n      // FIXME leaking Node timeout type\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      setOpenTimeout.current = setTimeout(() => trySetOpen(e, data), state.hoverDelay);\n    } else {\n      trySetOpen(e, data);\n    }\n  });\n\n  useOnClickOutside({\n    contains: elementContains,\n    disabled: !open,\n    element: targetDocument,\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    callback: event => setOpen(event, { open: false, type: 'clickOutside', event }),\n  });\n\n  // only close on scroll for context, or when closeOnScroll is specified\n  const closeOnScroll = state.openOnContext || state.closeOnScroll;\n  useOnScrollOutside({\n    contains: elementContains,\n    element: targetDocument,\n    callback: event => setOpen(event, { open: false, type: 'scrollOutside', event }),\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    disabled: !open || !closeOnScroll,\n  });\n\n  useOnMenuMouseEnter({\n    element: targetDocument,\n    callback: event => {\n      // When moving from a menu directly back to its trigger, this handler can close the menu\n      // Explicitly check a flag to see if this situation happens\n      if (!enteringTriggerRef.current) {\n        setOpen(event, { open: false, type: 'menuMouseEnter', event });\n      }\n    },\n    disabled: !open,\n    refs: [state.menuPopoverRef],\n  });\n\n  // Clear timeout on unmount\n  // Setting state after a component unmounts can cause memory leaks\n  React.useEffect(() => {\n    return () => {\n      clearTimeout(setOpenTimeout.current);\n    };\n  }, []);\n\n  // Manage focus for open state\n  const { findFirstFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, state.menuPopoverRef]);\n\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (shouldHandleCloseRef.current) {\n        // We know that React effects are sync so we focus the trigger here\n        // after any event handler (event handlers will update state and re-render).\n        // Since the browser only performs the default behaviour for the Tab key once\n        // keyboard events have fully bubbled up the window, the browser will move\n        // focus to the next tabbable element before/after the trigger if needed.\n        // If the Tab key was not pressed, focus will remain on the trigger as expected.\n        state.triggerRef.current?.focus();\n      }\n    }\n\n    shouldHandleCloseRef.current = false;\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst]);\n\n  return [open, setOpen] as const;\n};\n"],"mappings":"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"}

package/lib/components/Menu/useMenuContextValues.js

@@ -6,6 +6,7 @@ export function useMenuContextValues_unstable(state) {
     inline,
     isSubmenu,
     menuPopoverRef,
+    mountNode,
     onCheckedValueChange,
     open,
     openOnContext,
@@ -23,6 +24,7 @@ export function useMenuContextValues_unstable(state) {
     inline,
     isSubmenu,
     menuPopoverRef,
+    mountNode,
     onCheckedValueChange,
     open,
     openOnContext,

package/lib/components/Menu/useMenuContextValues.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAEA,OAAM,SAAUA,6BAA6B,CAACC,KAAgB;EAC5D,MAAM;IACJC,aAAa;IACbC,aAAa;IACbC,QAAQ;IACRC,MAAM;IACNC,SAAS;IACTC,cAAc;IACdC,oBAAoB;IACpBC,IAAI;IACJC,aAAa;IACbC,WAAW;IACXC,kBAAkB;IAClBC,OAAO;IACPC,SAAS;IACTC;EAAU,CACX,GAAGd,KAAK;EAET;EACA,MAAMe,IAAI,GAAG;IACXd,aAAa;IACbC,aAAa;IACbC,QAAQ;IACRC,MAAM;IACNC,SAAS;IACTC,cAAc;IACdC,oBAAoB;IACpBC,IAAI;IACJC,aAAa;IACbC,WAAW;IACXC,kBAAkB;IAClBC,OAAO;IACPC,SAAS;IACTC;GACD;EAED,OAAO;IAAEC;EAAI,CAAE;AACjB","names":["useMenuContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","inline","isSubmenu","menuPopoverRef","onCheckedValueChange","open","openOnContext","openOnHover","persistOnItemClick","setOpen","triggerId","triggerRef","menu"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/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    onCheckedValueChange,\n    open,\n    openOnContext,\n    openOnHover,\n    persistOnItemClick,\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    onCheckedValueChange,\n    open,\n    openOnContext,\n    openOnHover,\n    persistOnItemClick,\n    setOpen,\n    triggerId,\n    triggerRef,\n  };\n\n  return { menu };\n}\n"]}
+{"version":3,"names":["useMenuContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","inline","isSubmenu","menuPopoverRef","mountNode","onCheckedValueChange","open","openOnContext","openOnHover","persistOnItemClick","setOpen","triggerId","triggerRef","menu"],"sources":["../src/packages/react-components/react-menu/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    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    setOpen,\n    triggerId,\n    triggerRef,\n  };\n\n  return { menu };\n}\n"],"mappings":"AAEA,OAAM,SAAUA,6BAA6BA,CAACC,KAAgB;EAC5D,MAAM;IACJC,aAAa;IACbC,aAAa;IACbC,QAAQ;IACRC,MAAM;IACNC,SAAS;IACTC,cAAc;IACdC,SAAS;IACTC,oBAAoB;IACpBC,IAAI;IACJC,aAAa;IACbC,WAAW;IACXC,kBAAkB;IAClBC,OAAO;IACPC,SAAS;IACTC;EAAU,CACX,GAAGf,KAAK;EAET;EACA,MAAMgB,IAAI,GAAG;IACXf,aAAa;IACbC,aAAa;IACbC,QAAQ;IACRC,MAAM;IACNC,SAAS;IACTC,cAAc;IACdC,SAAS;IACTC,oBAAoB;IACpBC,IAAI;IACJC,aAAa;IACbC,WAAW;IACXC,kBAAkB;IAClBC,OAAO;IACPC,SAAS;IACTC;GACD;EAED,OAAO;IAAEC;EAAI,CAAE;AACjB"}

package/lib/components/MenuDivider/MenuDivider.js

@@ -2,12 +2,17 @@ import * as React from 'react';
 import { useMenuDivider_unstable } from './useMenuDivider';
 import { useMenuDividerStyles_unstable } from './useMenuDividerStyles';
 import { renderMenuDivider_unstable } from './renderMenuDivider';
+import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
 /**
  * Define a styled MenuDivider, using the `useMenuDivider_unstable` hook.
  */
 export const MenuDivider = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useMenuDivider_unstable(props, ref);
   useMenuDividerStyles_unstable(state);
+  const {
+    useMenuDividerStyles_unstable: useCustomStyles
+  } = useCustomStyleHooks_unstable();
+  useCustomStyles(state);
   return renderMenuDivider_unstable(state);
 });
 MenuDivider.displayName = 'MenuDivider';

package/lib/components/MenuDivider/MenuDivider.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,0BAA0B,QAAQ,qBAAqB;AAIhE;;;AAGA,OAAO,MAAMC,WAAW,gBAA0CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGP,uBAAuB,CAACK,KAAK,EAAEC,GAAG,CAAC;EACjDL,6BAA6B,CAACM,KAAK,CAAC;EAEpC,OAAOL,0BAA0B,CAACK,KAAK,CAAC;AAC1C,CAAC,CAAC;AAEFJ,WAAW,CAACK,WAAW,GAAG,aAAa","names":["React","useMenuDivider_unstable","useMenuDividerStyles_unstable","renderMenuDivider_unstable","MenuDivider","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuDivider/MenuDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuDivider_unstable } from './useMenuDivider';\nimport { useMenuDividerStyles_unstable } from './useMenuDividerStyles';\nimport { renderMenuDivider_unstable } from './renderMenuDivider';\nimport type { MenuDividerProps } from './MenuDivider.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled MenuDivider, using the `useMenuDivider_unstable` hook.\n */\nexport const MenuDivider: ForwardRefComponent<MenuDividerProps> = React.forwardRef((props, ref) => {\n  const state = useMenuDivider_unstable(props, ref);\n  useMenuDividerStyles_unstable(state);\n\n  return renderMenuDivider_unstable(state);\n});\n\nMenuDivider.displayName = 'MenuDivider';\n"]}
+{"version":3,"names":["React","useMenuDivider_unstable","useMenuDividerStyles_unstable","renderMenuDivider_unstable","useCustomStyleHooks_unstable","MenuDivider","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuDivider/MenuDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuDivider_unstable } from './useMenuDivider';\nimport { useMenuDividerStyles_unstable } from './useMenuDividerStyles';\nimport { renderMenuDivider_unstable } from './renderMenuDivider';\nimport type { MenuDividerProps } from './MenuDivider.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuDivider, using the `useMenuDivider_unstable` hook.\n */\nexport const MenuDivider: ForwardRefComponent<MenuDividerProps> = React.forwardRef((props, ref) => {\n  const state = useMenuDivider_unstable(props, ref);\n\n  useMenuDividerStyles_unstable(state);\n\n  const { useMenuDividerStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderMenuDivider_unstable(state);\n});\n\nMenuDivider.displayName = 'MenuDivider';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,0BAA0B,QAAQ,qBAAqB;AAGhE,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;AAGA,OAAO,MAAMC,WAAW,gBAA0CL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGR,uBAAuB,CAACM,KAAK,EAAEC,GAAG,CAAC;EAEjDN,6BAA6B,CAACO,KAAK,CAAC;EAEpC,MAAM;IAAEP,6BAA6B,EAAEQ;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EACzFM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAON,0BAA0B,CAACM,KAAK,CAAC;AAC1C,CAAC,CAAC;AAEFJ,WAAW,CAACM,WAAW,GAAG,aAAa"}

package/lib/components/MenuDivider/renderMenuDivider.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;;AAIA,OAAO,MAAMC,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAmBE,KAAK,CAAC;EAE9D,oBAAOH,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,EAAI;AAC3C,CAAC","names":["React","getSlots","renderMenuDivider_unstable","state","slots","slotProps","root"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuDivider/renderMenuDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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) => {\n  const { slots, slotProps } = getSlots<MenuDividerSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"]}
+{"version":3,"names":["React","getSlots","renderMenuDivider_unstable","state","slots","slotProps","createElement","root"],"sources":["../src/packages/react-components/react-menu/src/components/MenuDivider/renderMenuDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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) => {\n  const { slots, slotProps } = getSlots<MenuDividerSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;;AAIA,OAAO,MAAMC,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAmBE,KAAK,CAAC;EAE9D,oBAAOH,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,EAAI;AAC3C,CAAC"}

package/lib/components/MenuDivider/useMenuDivider.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,SAASA,qBAAqB,QAAQ,2BAA2B;AAIjE;;;AAGA,OAAO,MAAMC,uBAAuB,GAAG,CAACC,KAAuB,EAAEC,GAA2B,KAAsB;EAChH,OAAO;IACLC,UAAU,EAAE;MACVC,IAAI,EAAE;KACP;IACDA,IAAI,EAAEL,qBAAqB,CAAC,KAAK,EAAE;MACjCM,IAAI,EAAE,cAAc;MACpB,aAAa,EAAE,IAAI;MACnB,GAAGJ,KAAK;MACRC;KACD;GACF;AACH,CAAC","names":["getNativeElementProps","useMenuDivider_unstable","props","ref","components","root","role"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuDivider/useMenuDivider.ts"],"sourcesContent":["import { getNativeElementProps } 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: getNativeElementProps('div', {\n      role: 'presentation',\n      'aria-hidden': true,\n      ...props,\n      ref,\n    }),\n  };\n};\n"]}
+{"version":3,"names":["getNativeElementProps","useMenuDivider_unstable","props","ref","components","root","role"],"sources":["../src/packages/react-components/react-menu/src/components/MenuDivider/useMenuDivider.ts"],"sourcesContent":["import { getNativeElementProps } 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: getNativeElementProps('div', {\n      role: 'presentation',\n      'aria-hidden': true,\n      ...props,\n      ref,\n    }),\n  };\n};\n"],"mappings":"AAAA,SAASA,qBAAqB,QAAQ,2BAA2B;AAIjE;;;AAGA,OAAO,MAAMC,uBAAuB,GAAGA,CAACC,KAAuB,EAAEC,GAA2B,KAAsB;EAChH,OAAO;IACLC,UAAU,EAAE;MACVC,IAAI,EAAE;KACP;IACDA,IAAI,EAAEL,qBAAqB,CAAC,KAAK,EAAE;MACjCM,IAAI,EAAE,cAAc;MACpB,aAAa,EAAE,IAAI;MACnB,GAAGJ,KAAK;MACRC;KACD;GACF;AACH,CAAC"}

package/lib/components/MenuDivider/useMenuDividerStyles.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,kBAAoB,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAI9C,OAAO,MAAMC,qBAAqB,GAAqC;EACrEC,IAAI,EAAE;CACP;AAED,MAAMC,SAAS,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAMhB;AAEF,OAAO,MAAMC,6BAA6B,GAAIC,KAAuB,IAAI;EACvE,MAAMC,MAAM,GAAGH,SAAS,EAAE;EAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGR,YAAY,CAACE,qBAAqB,CAACC,IAAI,EAAEI,MAAM,CAACJ,IAAI,EAAEG,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EAElG,OAAOF,KAAK;AACd,CAAC","names":["shorthands","mergeClasses","tokens","menuDividerClassNames","root","useStyles","useMenuDividerStyles_unstable","state","styles","className"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuDivider/useMenuDividerStyles.ts"],"sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuDividerSlots, MenuDividerState } from './MenuDivider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuDividerClassNames: SlotClassNames<MenuDividerSlots> = {\n  root: 'fui-MenuDivider',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    ...shorthands.margin('4px', '-5px', '4px', '-5px'),\n    width: 'auto',\n    ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n  },\n});\n\nexport const useMenuDividerStyles_unstable = (state: MenuDividerState) => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuDividerClassNames.root, styles.root, state.root.className);\n\n  return state;\n};\n"]}
+{"version":3,"names":["shorthands","mergeClasses","__styles","tokens","menuDividerClassNames","root","useStyles","B6of3ja","t21cq0","jrapky","Frg6f3","a9b677","Bn0qgzm","oivjwe","B9xav0g","d","useMenuDividerStyles_unstable","state","styles","className"],"sources":["../src/packages/react-components/react-menu/src/components/MenuDivider/useMenuDividerStyles.ts"],"sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuDividerSlots, MenuDividerState } from './MenuDivider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuDividerClassNames: SlotClassNames<MenuDividerSlots> = {\n  root: 'fui-MenuDivider',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    ...shorthands.margin('4px', '-5px', '4px', '-5px'),\n    width: 'auto',\n    ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n  },\n});\n\nexport const useMenuDividerStyles_unstable = (state: MenuDividerState) => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuDividerClassNames.root, styles.root, state.root.className);\n\n  return state;\n};\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAI9C,OAAO,MAAMC,qBAAqB,GAAqC;EACrEC,IAAI,EAAE;CACP;AAED,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAMhB;AAEF,OAAO,MAAMC,6BAA6B,GAAIC,KAAuB,IAAI;EACvE,MAAMC,MAAM,GAAGZ,SAAS,EAAE;EAC1BW,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGlB,YAAY,CAACG,qBAAqB,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EAElG,OAAOF,KAAK;AACd,CAAC"}

package/lib/components/MenuGroup/MenuGroup.js

@@ -3,6 +3,7 @@ import { useMenuGroup_unstable } from './useMenuGroup';
 import { renderMenuGroup_unstable } from './renderMenuGroup';
 import { useMenuGroupContextValues_unstable } from './useMenuGroupContextValues';
 import { useMenuGroupStyles_unstable } from './useMenuGroupStyles';
+import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
 /**
  * Define a styled MenuGroup, using the `useMenuGroup_unstable` hook.
  */
@@ -10,6 +11,10 @@ export const MenuGroup = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useMenuGroup_unstable(props, ref);
   const contextValues = useMenuGroupContextValues_unstable(state);
   useMenuGroupStyles_unstable(state);
+  const {
+    useMenuGroupStyles_unstable: useCustomStyles
+  } = useCustomStyleHooks_unstable();
+  useCustomStyles(state);
   return renderMenuGroup_unstable(state, contextValues);
 });
 MenuGroup.displayName = 'MenuGroup';

package/lib/components/MenuGroup/MenuGroup.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,kCAAkC,QAAQ,6BAA6B;AAGhF,SAASC,2BAA2B,QAAQ,sBAAsB;AAElE;;;AAGA,OAAO,MAAMC,SAAS,gBAAwCL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC5F,MAAMC,KAAK,GAAGR,qBAAqB,CAACM,KAAK,EAAEC,GAAG,CAAC;EAC/C,MAAME,aAAa,GAAGP,kCAAkC,CAACM,KAAK,CAAC;EAE/DL,2BAA2B,CAACK,KAAK,CAAC;EAElC,OAAOP,wBAAwB,CAACO,KAAK,EAAEC,aAAa,CAAC;AACvD,CAAC,CAAC;AAEFL,SAAS,CAACM,WAAW,GAAG,WAAW","names":["React","useMenuGroup_unstable","renderMenuGroup_unstable","useMenuGroupContextValues_unstable","useMenuGroupStyles_unstable","MenuGroup","forwardRef","props","ref","state","contextValues","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuGroup/MenuGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuGroup_unstable } from './useMenuGroup';\nimport { renderMenuGroup_unstable } from './renderMenuGroup';\nimport { useMenuGroupContextValues_unstable } from './useMenuGroupContextValues';\nimport type { MenuGroupProps } from './MenuGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useMenuGroupStyles_unstable } from './useMenuGroupStyles';\n\n/**\n * Define a styled MenuGroup, using the `useMenuGroup_unstable` hook.\n */\nexport const MenuGroup: ForwardRefComponent<MenuGroupProps> = React.forwardRef((props, ref) => {\n  const state = useMenuGroup_unstable(props, ref);\n  const contextValues = useMenuGroupContextValues_unstable(state);\n\n  useMenuGroupStyles_unstable(state);\n\n  return renderMenuGroup_unstable(state, contextValues);\n});\n\nMenuGroup.displayName = 'MenuGroup';\n"]}
+{"version":3,"names":["React","useMenuGroup_unstable","renderMenuGroup_unstable","useMenuGroupContextValues_unstable","useMenuGroupStyles_unstable","useCustomStyleHooks_unstable","MenuGroup","forwardRef","props","ref","state","contextValues","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroup/MenuGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuGroup_unstable } from './useMenuGroup';\nimport { renderMenuGroup_unstable } from './renderMenuGroup';\nimport { useMenuGroupContextValues_unstable } from './useMenuGroupContextValues';\nimport type { MenuGroupProps } from './MenuGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useMenuGroupStyles_unstable } from './useMenuGroupStyles';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuGroup, using the `useMenuGroup_unstable` hook.\n */\nexport const MenuGroup: ForwardRefComponent<MenuGroupProps> = React.forwardRef((props, ref) => {\n  const state = useMenuGroup_unstable(props, ref);\n  const contextValues = useMenuGroupContextValues_unstable(state);\n\n  useMenuGroupStyles_unstable(state);\n\n  const { useMenuGroupStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderMenuGroup_unstable(state, contextValues);\n});\n\nMenuGroup.displayName = 'MenuGroup';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,kCAAkC,QAAQ,6BAA6B;AAGhF,SAASC,2BAA2B,QAAQ,sBAAsB;AAClE,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;AAGA,OAAO,MAAMC,SAAS,gBAAwCN,KAAK,CAACO,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC5F,MAAMC,KAAK,GAAGT,qBAAqB,CAACO,KAAK,EAAEC,GAAG,CAAC;EAC/C,MAAME,aAAa,GAAGR,kCAAkC,CAACO,KAAK,CAAC;EAE/DN,2BAA2B,CAACM,KAAK,CAAC;EAElC,MAAM;IAAEN,2BAA2B,EAAEQ;EAAe,CAAE,GAAGP,4BAA4B,EAAE;EACvFO,eAAe,CAACF,KAAK,CAAC;EAEtB,OAAOR,wBAAwB,CAACQ,KAAK,EAAEC,aAAa,CAAC;AACvD,CAAC,CAAC;AAEFL,SAAS,CAACO,WAAW,GAAG,WAAW"}

package/lib/components/MenuGroup/renderMenuGroup.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAEpD,SAASC,wBAAwB,QAAQ,iCAAiC;AAE1E;;;;AAIA,OAAO,MAAMC,wBAAwB,GAAG,CAACC,KAAqB,EAAEC,aAAqC,KAAI;EACvG,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGN,QAAQ,CAAiBG,KAAK,CAAC;EAE5D,oBACEJ,oBAACE,wBAAwB;IAACM,KAAK,EAAEH,aAAa,CAACI;EAAS,gBACtDT,oBAACM,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,EAAI,CACT;AAE/B,CAAC","names":["React","getSlots","MenuGroupContextProvider","renderMenuGroup_unstable","state","contextValues","slots","slotProps","value","menuGroup","root"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuGroup/renderMenuGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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) => {\n  const { slots, slotProps } = getSlots<MenuGroupSlots>(state);\n\n  return (\n    <MenuGroupContextProvider value={contextValues.menuGroup}>\n      <slots.root {...slotProps.root} />\n    </MenuGroupContextProvider>\n  );\n};\n"]}
+{"version":3,"names":["React","getSlots","MenuGroupContextProvider","renderMenuGroup_unstable","state","contextValues","slots","slotProps","createElement","value","menuGroup","root"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroup/renderMenuGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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) => {\n  const { slots, slotProps } = getSlots<MenuGroupSlots>(state);\n\n  return (\n    <MenuGroupContextProvider value={contextValues.menuGroup}>\n      <slots.root {...slotProps.root} />\n    </MenuGroupContextProvider>\n  );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAEpD,SAASC,wBAAwB,QAAQ,iCAAiC;AAE1E;;;;AAIA,OAAO,MAAMC,wBAAwB,GAAGA,CAACC,KAAqB,EAAEC,aAAqC,KAAI;EACvG,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGN,QAAQ,CAAiBG,KAAK,CAAC;EAE5D,oBACEJ,KAAA,CAAAQ,aAAA,CAACN,wBAAwB;IAACO,KAAK,EAAEJ,aAAa,CAACK;EAAS,gBACtDV,KAAA,CAAAQ,aAAA,CAACF,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,EAAI,CACT;AAE/B,CAAC"}

package/lib/components/MenuGroup/useMenuGroup.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AACA,SAASA,qBAAqB,EAAEC,KAAK,QAAQ,2BAA2B;AAGxE;;;AAGA,OAAM,SAAUC,qBAAqB,CAACC,KAAqB,EAAEC,GAA2B;EACtF,MAAMC,QAAQ,GAAGJ,KAAK,CAAC,YAAY,CAAC;EAEpC,OAAO;IACLK,UAAU,EAAE;MACVC,IAAI,EAAE;KACP;IACDA,IAAI,EAAEP,qBAAqB,CAAC,KAAK,EAAE;MACjCI,GAAG;MACH,iBAAiB,EAAEC,QAAQ;MAC3BG,IAAI,EAAE,OAAO;MACb,GAAGL;KACJ,CAAC;IACFE;GACD;AACH","names":["getNativeElementProps","useId","useMenuGroup_unstable","props","ref","headerId","components","root","role"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuGroup/useMenuGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId } 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: getNativeElementProps('div', {\n      ref,\n      'aria-labelledby': headerId,\n      role: 'group',\n      ...props,\n    }),\n    headerId,\n  };\n}\n"]}
+{"version":3,"names":["getNativeElementProps","useId","useMenuGroup_unstable","props","ref","headerId","components","root","role"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroup/useMenuGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId } 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: getNativeElementProps('div', {\n      ref,\n      'aria-labelledby': headerId,\n      role: 'group',\n      ...props,\n    }),\n    headerId,\n  };\n}\n"],"mappings":"AACA,SAASA,qBAAqB,EAAEC,KAAK,QAAQ,2BAA2B;AAGxE;;;AAGA,OAAM,SAAUC,qBAAqBA,CAACC,KAAqB,EAAEC,GAA2B;EACtF,MAAMC,QAAQ,GAAGJ,KAAK,CAAC,YAAY,CAAC;EAEpC,OAAO;IACLK,UAAU,EAAE;MACVC,IAAI,EAAE;KACP;IACDA,IAAI,EAAEP,qBAAqB,CAAC,KAAK,EAAE;MACjCI,GAAG;MACH,iBAAiB,EAAEC,QAAQ;MAC3BG,IAAI,EAAE,OAAO;MACb,GAAGL;KACJ,CAAC;IACFE;GACD;AACH"}

package/lib/components/MenuGroup/useMenuGroupContextValues.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,OAAM,SAAUC,kCAAkC,CAACC,KAAqB;EACtE,MAAM;IAAEC;EAAQ,CAAE,GAAGD,KAAK;EAC1B,MAAME,SAAS,GAAGJ,KAAK,CAACK,OAAO,CAAC,OAAO;IAAEF;EAAQ,CAAE,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEjE,OAAO;IAAEC;EAAS,CAAE;AACtB","names":["React","useMenuGroupContextValues_unstable","state","headerId","menuGroup","useMemo"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuGroup/useMenuGroupContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { MenuGroupContextValues, MenuGroupState } from './MenuGroup.types';\n\nexport function useMenuGroupContextValues_unstable(state: MenuGroupState): MenuGroupContextValues {\n  const { headerId } = state;\n  const menuGroup = React.useMemo(() => ({ headerId }), [headerId]);\n\n  return { menuGroup };\n}\n"]}
+{"version":3,"names":["React","useMenuGroupContextValues_unstable","state","headerId","menuGroup","useMemo"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroup/useMenuGroupContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { MenuGroupContextValues, MenuGroupState } from './MenuGroup.types';\n\nexport function useMenuGroupContextValues_unstable(state: MenuGroupState): MenuGroupContextValues {\n  const { headerId } = state;\n  const menuGroup = React.useMemo(() => ({ headerId }), [headerId]);\n\n  return { menuGroup };\n}\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,OAAM,SAAUC,kCAAkCA,CAACC,KAAqB;EACtE,MAAM;IAAEC;EAAQ,CAAE,GAAGD,KAAK;EAC1B,MAAME,SAAS,GAAGJ,KAAK,CAACK,OAAO,CAAC,OAAO;IAAEF;EAAQ,CAAE,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEjE,OAAO;IAAEC;EAAS,CAAE;AACtB"}

package/lib/components/MenuGroup/useMenuGroupStyles.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AACA,SAASA,YAAY,QAAQ,gBAAgB;AAG7C,OAAO,MAAMC,mBAAmB,GAAmC;EACjEC,IAAI,EAAE;CACP;AAED,OAAO,MAAMC,2BAA2B,GAAIC,KAAqB,IAAoB;EACnFA,KAAK,CAACF,IAAI,CAACG,SAAS,GAAGL,YAAY,CAACC,mBAAmB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;EAEnF,OAAOD,KAAK;AACd,CAAC","names":["mergeClasses","menuGroupClassNames","root","useMenuGroupStyles_unstable","state","className"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuGroup/useMenuGroupStyles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport type { MenuGroupSlots, MenuGroupState } from './MenuGroup.types';\n\nexport const menuGroupClassNames: SlotClassNames<MenuGroupSlots> = {\n  root: 'fui-MenuGroup',\n};\n\nexport const useMenuGroupStyles_unstable = (state: MenuGroupState): MenuGroupState => {\n  state.root.className = mergeClasses(menuGroupClassNames.root, state.root.className);\n\n  return state;\n};\n"]}
+{"version":3,"names":["mergeClasses","menuGroupClassNames","root","useMenuGroupStyles_unstable","state","className"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroup/useMenuGroupStyles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport type { MenuGroupSlots, MenuGroupState } from './MenuGroup.types';\n\nexport const menuGroupClassNames: SlotClassNames<MenuGroupSlots> = {\n  root: 'fui-MenuGroup',\n};\n\nexport const useMenuGroupStyles_unstable = (state: MenuGroupState): MenuGroupState => {\n  state.root.className = mergeClasses(menuGroupClassNames.root, state.root.className);\n\n  return state;\n};\n"],"mappings":"AACA,SAASA,YAAY,QAAQ,gBAAgB;AAG7C,OAAO,MAAMC,mBAAmB,GAAmC;EACjEC,IAAI,EAAE;CACP;AAED,OAAO,MAAMC,2BAA2B,GAAIC,KAAqB,IAAoB;EACnFA,KAAK,CAACF,IAAI,CAACG,SAAS,GAAGL,YAAY,CAACC,mBAAmB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;EAEnF,OAAOD,KAAK;AACd,CAAC"}

package/lib/components/MenuGroupHeader/MenuGroupHeader.js

@@ -2,12 +2,17 @@ import * as React from 'react';
 import { useMenuGroupHeader_unstable } from './useMenuGroupHeader';
 import { useMenuGroupHeaderStyles_unstable } from './useMenuGroupHeaderStyles';
 import { renderMenuGroupHeader_unstable } from './renderMenuGroupHeader';
+import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
 /**
  * Define a styled MenuGroupHeader, using the `useMenuGroupHeader_unstable` hook.
  */
 export const MenuGroupHeader = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useMenuGroupHeader_unstable(props, ref);
   useMenuGroupHeaderStyles_unstable(state);
+  const {
+    useMenuGroupHeaderStyles_unstable: useCustomStyles
+  } = useCustomStyleHooks_unstable();
+  useCustomStyles(state);
   return renderMenuGroupHeader_unstable(state);
 });
 MenuGroupHeader.displayName = 'MenuGroupHeader';

package/lib/components/MenuGroupHeader/MenuGroupHeader.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,2BAA2B,QAAQ,sBAAsB;AAClE,SAASC,iCAAiC,QAAQ,4BAA4B;AAC9E,SAASC,8BAA8B,QAAQ,yBAAyB;AAIxE;;;AAGA,OAAO,MAAMC,eAAe,gBAA8CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxG,MAAMC,KAAK,GAAGP,2BAA2B,CAACK,KAAK,EAAEC,GAAG,CAAC;EACrDL,iCAAiC,CAACM,KAAK,CAAC;EAExC,OAAOL,8BAA8B,CAACK,KAAK,CAAC;AAC9C,CAAC,CAAC;AAEFJ,eAAe,CAACK,WAAW,GAAG,iBAAiB","names":["React","useMenuGroupHeader_unstable","useMenuGroupHeaderStyles_unstable","renderMenuGroupHeader_unstable","MenuGroupHeader","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuGroupHeader/MenuGroupHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuGroupHeader_unstable } from './useMenuGroupHeader';\nimport { useMenuGroupHeaderStyles_unstable } from './useMenuGroupHeaderStyles';\nimport { renderMenuGroupHeader_unstable } from './renderMenuGroupHeader';\nimport type { MenuGroupHeaderProps } from './MenuGroupHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled MenuGroupHeader, using the `useMenuGroupHeader_unstable` hook.\n */\nexport const MenuGroupHeader: ForwardRefComponent<MenuGroupHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useMenuGroupHeader_unstable(props, ref);\n  useMenuGroupHeaderStyles_unstable(state);\n\n  return renderMenuGroupHeader_unstable(state);\n});\n\nMenuGroupHeader.displayName = 'MenuGroupHeader';\n"]}
+{"version":3,"names":["React","useMenuGroupHeader_unstable","useMenuGroupHeaderStyles_unstable","renderMenuGroupHeader_unstable","useCustomStyleHooks_unstable","MenuGroupHeader","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroupHeader/MenuGroupHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuGroupHeader_unstable } from './useMenuGroupHeader';\nimport { useMenuGroupHeaderStyles_unstable } from './useMenuGroupHeaderStyles';\nimport { renderMenuGroupHeader_unstable } from './renderMenuGroupHeader';\nimport type { MenuGroupHeaderProps } from './MenuGroupHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuGroupHeader, using the `useMenuGroupHeader_unstable` hook.\n */\nexport const MenuGroupHeader: ForwardRefComponent<MenuGroupHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useMenuGroupHeader_unstable(props, ref);\n\n  useMenuGroupHeaderStyles_unstable(state);\n\n  const { useMenuGroupHeaderStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderMenuGroupHeader_unstable(state);\n});\n\nMenuGroupHeader.displayName = 'MenuGroupHeader';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,2BAA2B,QAAQ,sBAAsB;AAClE,SAASC,iCAAiC,QAAQ,4BAA4B;AAC9E,SAASC,8BAA8B,QAAQ,yBAAyB;AAGxE,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;AAGA,OAAO,MAAMC,eAAe,gBAA8CL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxG,MAAMC,KAAK,GAAGR,2BAA2B,CAACM,KAAK,EAAEC,GAAG,CAAC;EAErDN,iCAAiC,CAACO,KAAK,CAAC;EAExC,MAAM;IAAEP,iCAAiC,EAAEQ;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EAC7FM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAON,8BAA8B,CAACM,KAAK,CAAC;AAC9C,CAAC,CAAC;AAEFJ,eAAe,CAACM,WAAW,GAAG,iBAAiB"}

package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;;AAIA,OAAO,MAAMC,8BAA8B,GAAIC,KAA2B,IAAI;EAC5E,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAuBE,KAAK,CAAC;EAElE,oBAAOH,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,EAAI;AAC3C,CAAC","names":["React","getSlots","renderMenuGroupHeader_unstable","state","slots","slotProps","root"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuGroupHeader/renderMenuGroupHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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) => {\n  const { slots, slotProps } = getSlots<MenuGroupHeaderSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"]}
+{"version":3,"names":["React","getSlots","renderMenuGroupHeader_unstable","state","slots","slotProps","createElement","root"],"sources":["../src/packages/react-components/react-menu/src/components/MenuGroupHeader/renderMenuGroupHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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) => {\n  const { slots, slotProps } = getSlots<MenuGroupHeaderSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;;AAIA,OAAO,MAAMC,8BAA8B,GAAIC,KAA2B,IAAI;EAC5E,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAuBE,KAAK,CAAC;EAElE,oBAAOH,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,EAAI;AAC3C,CAAC"}