@fluentui/react-menu 0.0.0-nightly-20220302-0405.1

package/lib-commonjs/components/MenuList/useMenuListContextValues.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMenuListContextValues_unstable = void 0;
+
+function useMenuListContextValues_unstable(state) {
+  const {
+    onCheckedValueChange,
+    checkedValues,
+    toggleCheckbox,
+    selectRadio,
+    setFocusByFirstCharacter,
+    hasIcons,
+    hasCheckmarks
+  } = state; // This context is created with "@fluentui/react-context-selector", these is no sense to memoize it
+
+  const menuList = {
+    onCheckedValueChange,
+    checkedValues,
+    toggleCheckbox,
+    selectRadio,
+    setFocusByFirstCharacter,
+    hasIcons,
+    hasCheckmarks
+  };
+  return {
+    menuList
+  };
+}
+
+exports.useMenuListContextValues_unstable = useMenuListContextValues_unstable;
+//# sourceMappingURL=useMenuListContextValues.js.map

package/lib-commonjs/components/MenuList/useMenuListContextValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuList/useMenuListContextValues.ts"],"names":[],"mappings":";;;;;;;AAEA,SAAgB,iCAAhB,CAAkD,KAAlD,EAAsE;AACpE,QAAM;AACJ,IAAA,oBADI;AAEJ,IAAA,aAFI;AAGJ,IAAA,cAHI;AAIJ,IAAA,WAJI;AAKJ,IAAA,wBALI;AAMJ,IAAA,QANI;AAOJ,IAAA;AAPI,MAQF,KARJ,CADoE,CAWpE;;AACA,QAAM,QAAQ,GAAG;AACf,IAAA,oBADe;AAEf,IAAA,aAFe;AAGf,IAAA,cAHe;AAIf,IAAA,WAJe;AAKf,IAAA,wBALe;AAMf,IAAA,QANe;AAOf,IAAA;AAPe,GAAjB;AAUA,SAAO;AAAE,IAAA;AAAF,GAAP;AACD;;AAvBD,OAAA,CAAA,iCAAA,GAAA,iCAAA","sourcesContent":["import type { MenuListContextValues, MenuListState } from './MenuList.types';\n\nexport function useMenuListContextValues_unstable(state: MenuListState): MenuListContextValues {\n  const {\n    onCheckedValueChange,\n    checkedValues,\n    toggleCheckbox,\n    selectRadio,\n    setFocusByFirstCharacter,\n    hasIcons,\n    hasCheckmarks,\n  } = state;\n\n  // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n  const menuList = {\n    onCheckedValueChange,\n    checkedValues,\n    toggleCheckbox,\n    selectRadio,\n    setFocusByFirstCharacter,\n    hasIcons,\n    hasCheckmarks,\n  };\n\n  return { menuList };\n}\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuList/useMenuListStyles.d.ts

@@ -0,0 +1,6 @@
+import type { MenuListState } from './MenuList.types';
+export declare const menuListClassName = "fui-MenuList";
+/**
+ * Apply styling to the Menu slots based on the state
+ */
+export declare const useMenuListStyles_unstable: (state: MenuListState) => MenuListState;

package/lib-commonjs/components/MenuList/useMenuListStyles.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMenuListStyles_unstable = exports.menuListClassName = void 0;
+
+const react_1 = /*#__PURE__*/require("@griffel/react");
+
+exports.menuListClassName = 'fui-MenuList';
+
+const useStyles = /*#__PURE__*/react_1.__styles({
+  "root": {
+    "mc9l5x": "f22iagw",
+    "Beiy3e4": "f1vx9l62",
+    "i8kkvl": "f16mnhsx",
+    "Belr9w4": "fbi42co"
+  }
+}, {
+  "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f16mnhsx{-webkit-column-gap:2px;column-gap:2px;}", ".fbi42co{row-gap:2px;}"]
+});
+/**
+ * Apply styling to the Menu slots based on the state
+ */
+
+
+const useMenuListStyles_unstable = state => {
+  const styles = useStyles();
+  state.root.className = react_1.mergeClasses(exports.menuListClassName, styles.root, state.root.className);
+  return state;
+};
+
+exports.useMenuListStyles_unstable = useMenuListStyles_unstable;
+//# sourceMappingURL=useMenuListStyles.js.map

package/lib-commonjs/components/MenuList/useMenuListStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuList/useMenuListStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AAGa,OAAA,CAAA,iBAAA,GAAoB,cAApB;;AAEb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAQA;;AAEG;;;AACI,MAAM,0BAA0B,GAAI,KAAD,IAAwC;AAChF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,iBAAb,EAAgC,MAAM,CAAC,IAAvC,EAA6C,KAAK,CAAC,IAAN,CAAW,SAAxD,CAAvB;AACA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B","sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport type { MenuListState } from './MenuList.types';\n\nexport const menuListClassName = 'fui-MenuList';\n\nconst useStyles = makeStyles({\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    ...shorthands.gap('2px'),\n  },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuListStyles_unstable = (state: MenuListState): MenuListState => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuListClassName, styles.root, state.root.className);\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuPopover/MenuPopover.d.ts

@@ -0,0 +1,6 @@
+import type { MenuPopoverProps } from './MenuPopover.types';
+import type { ForwardRefComponent } from '@fluentui/react-utilities';
+/**
+ * Popover intended to wrap `MenuList` and adds styling and interaction support specific to menus
+ */
+export declare const MenuPopover: ForwardRefComponent<MenuPopoverProps>;

package/lib-commonjs/components/MenuPopover/MenuPopover.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MenuPopover = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const useMenuPopover_1 = /*#__PURE__*/require("./useMenuPopover");
+
+const useMenuPopoverStyles_1 = /*#__PURE__*/require("./useMenuPopoverStyles");
+
+const renderMenuPopover_1 = /*#__PURE__*/require("./renderMenuPopover");
+/**
+ * Popover intended to wrap `MenuList` and adds styling and interaction support specific to menus
+ */
+
+
+exports.MenuPopover = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useMenuPopover_1.useMenuPopover_unstable(props, ref);
+  useMenuPopoverStyles_1.useMenuPopoverStyles_unstable(state);
+  return renderMenuPopover_1.renderMenuPopover_unstable(state);
+});
+exports.MenuPopover.displayName = 'MenuPopover';
+//# sourceMappingURL=MenuPopover.js.map

package/lib-commonjs/components/MenuPopover/MenuPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,WAAA,gBAAqD,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAChG,QAAM,KAAK,GAAG,gBAAA,CAAA,uBAAA,CAAwB,KAAxB,EAA+B,GAA/B,CAAd;AAEA,EAAA,sBAAA,CAAA,6BAAA,CAA8B,KAA9B;AACA,SAAO,mBAAA,CAAA,0BAAA,CAA2B,KAA3B,CAAP;AACD,CALiE,CAArD;AAOb,OAAA,CAAA,WAAA,CAAY,WAAZ,GAA0B,aAA1B","sourcesContent":["import * as React from 'react';\nimport { useMenuPopover_unstable } from './useMenuPopover';\nimport { useMenuPopoverStyles_unstable } from './useMenuPopoverStyles';\nimport { renderMenuPopover_unstable } from './renderMenuPopover';\nimport type { MenuPopoverProps } from './MenuPopover.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Popover intended to wrap `MenuList` and adds styling and interaction support specific to menus\n */\nexport const MenuPopover: ForwardRefComponent<MenuPopoverProps> = React.forwardRef((props, ref) => {\n  const state = useMenuPopover_unstable(props, ref);\n\n  useMenuPopoverStyles_unstable(state);\n  return renderMenuPopover_unstable(state);\n});\n\nMenuPopover.displayName = 'MenuPopover';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuPopover/MenuPopover.types.d.ts

@@ -0,0 +1,18 @@
+import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
+export declare type MenuPopoverSlots = {
+    root: Slot<'div'>;
+};
+/**
+ * MenuPopover Props
+ */
+export declare type MenuPopoverProps = ComponentProps<MenuPopoverSlots>;
+/**
+ * State used in rendering MenuPopover
+ */
+export declare type MenuPopoverState = ComponentState<MenuPopoverSlots> & {
+    /**
+     * 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
+     */
+    inline: boolean;
+};

package/lib-commonjs/components/MenuPopover/MenuPopover.types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=MenuPopover.types.js.map

package/lib-commonjs/components/MenuPopover/MenuPopover.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}

package/lib-commonjs/components/MenuPopover/index.d.ts

@@ -0,0 +1,5 @@
+export * from './MenuPopover';
+export * from './MenuPopover.types';
+export * from './renderMenuPopover';
+export * from './useMenuPopover';
+export * from './useMenuPopoverStyles';

package/lib-commonjs/components/MenuPopover/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+const tslib_1 = /*#__PURE__*/require("tslib");
+
+tslib_1.__exportStar(require("./MenuPopover"), exports);
+
+tslib_1.__exportStar(require("./MenuPopover.types"), exports);
+
+tslib_1.__exportStar(require("./renderMenuPopover"), exports);
+
+tslib_1.__exportStar(require("./useMenuPopover"), exports);
+
+tslib_1.__exportStar(require("./useMenuPopoverStyles"), exports);
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuPopover/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './MenuPopover';\nexport * from './MenuPopover.types';\nexport * from './renderMenuPopover';\nexport * from './useMenuPopover';\nexport * from './useMenuPopoverStyles';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuPopover/renderMenuPopover.d.ts

@@ -0,0 +1,5 @@
+import { MenuPopoverState } from './MenuPopover.types';
+/**
+ * Render the final JSX of MenuPopover
+ */
+export declare const renderMenuPopover_unstable: (state: MenuPopoverState) => JSX.Element;

package/lib-commonjs/components/MenuPopover/renderMenuPopover.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.renderMenuPopover_unstable = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+
+const react_portal_1 = /*#__PURE__*/require("@fluentui/react-portal");
+/**
+ * Render the final JSX of MenuPopover
+ */
+
+
+const renderMenuPopover_unstable = state => {
+  const {
+    slots,
+    slotProps
+  } = react_utilities_1.getSlots(state);
+
+  if (state.inline) {
+    return React.createElement(slots.root, { ...slotProps.root
+    });
+  }
+
+  return React.createElement(react_portal_1.Portal, null, React.createElement(slots.root, { ...slotProps.root
+  }));
+};
+
+exports.renderMenuPopover_unstable = renderMenuPopover_unstable;
+//# sourceMappingURL=renderMenuPopover.js.map

package/lib-commonjs/components/MenuPopover/renderMenuPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuPopover/renderMenuPopover.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,cAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;AAEA;;AAEG;;;AACI,MAAM,0BAA0B,GAAI,KAAD,IAA4B;AACpE,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA2B,KAA3B,CAA7B;;AAEA,MAAI,KAAK,CAAC,MAAV,EAAkB;AAChB,WAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,KAAX,CAAP;AACD;;AAED,SACE,KAAA,CAAA,aAAA,CAAC,cAAA,CAAA,MAAD,EAAO,IAAP,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CADF,CADF;AAKD,CAZM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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) => {\n  const { slots, slotProps } = getSlots<MenuPopoverSlots>(state);\n\n  if (state.inline) {\n    return <slots.root {...slotProps.root} />;\n  }\n\n  return (\n    <Portal>\n      <slots.root {...slotProps.root} />\n    </Portal>\n  );\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuPopover/useMenuPopover.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';
+/**
+ * Create the state required to render MenuPopover.
+ *
+ * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,
+ * before being passed to renderMenuPopover_unstable.
+ *
+ * @param props - props from this instance of MenuPopover
+ * @param ref - reference to root HTMLElement of MenuPopover
+ */
+export declare const useMenuPopover_unstable: (props: MenuPopoverProps, ref: React.Ref<HTMLElement>) => MenuPopoverState;

package/lib-commonjs/components/MenuPopover/useMenuPopover.js

@@ -0,0 +1,120 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMenuPopover_unstable = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const keyboard_keys_1 = /*#__PURE__*/require("@fluentui/keyboard-keys");
+
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+
+const menuContext_1 = /*#__PURE__*/require("../../contexts/menuContext");
+
+const index_1 = /*#__PURE__*/require("../../utils/index");
+
+const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
+
+const useIsSubmenu_1 = /*#__PURE__*/require("../../utils/useIsSubmenu");
+/**
+ * Create the state required to render MenuPopover.
+ *
+ * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,
+ * before being passed to renderMenuPopover_unstable.
+ *
+ * @param props - props from this instance of MenuPopover
+ * @param ref - reference to root HTMLElement of MenuPopover
+ */
+
+
+const useMenuPopover_unstable = (props, ref) => {
+  var _a;
+
+  const popoverRef = menuContext_1.useMenuContext_unstable(context => context.menuPopoverRef);
+  const setOpen = menuContext_1.useMenuContext_unstable(context => context.setOpen);
+  const openOnHover = menuContext_1.useMenuContext_unstable(context => context.openOnHover);
+  const isSubmenu = useIsSubmenu_1.useIsSubmenu();
+  const canDispatchCustomEventRef = React.useRef(true);
+  const throttleDispatchTimerRef = React.useRef(0);
+  const {
+    dir
+  } = react_shared_contexts_1.useFluent();
+  const CloseArrowKey = dir === 'ltr' ? keyboard_keys_1.ArrowLeft : keyboard_keys_1.ArrowRight; // use DOM listener since react events propagate up the react tree
+  // no need to do `contains` logic as menus are all positioned in different portals
+
+  const mouseOverListenerCallbackRef = React.useCallback(node => {
+    if (node) {
+      // Dispatches the custom menu mouse enter event with throttling
+      // Needs to trigger on mouseover to support keyboard + mouse together
+      // i.e. keyboard opens submenus while cursor is still on the parent
+      node.addEventListener('mouseover', e => {
+        if (canDispatchCustomEventRef.current) {
+          canDispatchCustomEventRef.current = false;
+          index_1.dispatchMenuEnterEvent(popoverRef.current, e); // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+          // @ts-ignore #16889 Node setTimeout type leaking
+
+          throttleDispatchTimerRef.current = setTimeout(() => canDispatchCustomEventRef.current = true, 250);
+        }
+      });
+    }
+  }, [popoverRef, throttleDispatchTimerRef]);
+  React.useEffect(() => {
+    () => clearTimeout(throttleDispatchTimerRef.current);
+  }, []);
+  const inline = (_a = menuContext_1.useMenuContext_unstable(context => context.inline)) !== null && _a !== void 0 ? _a : false;
+  const rootProps = react_utilities_1.getNativeElementProps('div', {
+    role: 'presentation',
+    ...props,
+    ref: react_utilities_1.useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef)
+  });
+  const {
+    onMouseEnter: onMouseEnterOriginal,
+    onKeyDown: onKeyDownOriginal
+  } = rootProps;
+  rootProps.onMouseEnter = react_utilities_1.useEventCallback(e => {
+    if (openOnHover) {
+      setOpen(e, {
+        open: true,
+        keyboard: false
+      });
+    }
+
+    onMouseEnterOriginal === null || onMouseEnterOriginal === void 0 ? void 0 : onMouseEnterOriginal(e);
+  });
+  rootProps.onKeyDown = react_utilities_1.useEventCallback(e => {
+    var _a;
+
+    const key = e.key;
+
+    if (key === keyboard_keys_1.Escape || isSubmenu && key === CloseArrowKey) {
+      if ((_a = popoverRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target)) {
+        setOpen(e, {
+          open: false,
+          keyboard: true
+        });
+      }
+    }
+
+    if (key === keyboard_keys_1.Tab) {
+      setOpen(e, {
+        open: false,
+        keyboard: true
+      });
+      e.preventDefault();
+    }
+
+    onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(e);
+  });
+  return {
+    inline,
+    components: {
+      root: 'div'
+    },
+    root: rootProps
+  };
+};
+
+exports.useMenuPopover_unstable = useMenuPopover_unstable;
+//# sourceMappingURL=useMenuPopover.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const isSubmenu = useIsSubmenu();\n  const canDispatchCustomEventRef = React.useRef(true);\n  const throttleDispatchTimerRef = React.useRef(0);\n\n  const { dir } = useFluent();\n  const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n  // use DOM listener since react events propagate up the react tree\n  // no need to do `contains` logic as menus are all positioned in different portals\n  const mouseOverListenerCallbackRef = React.useCallback(\n    (node: HTMLElement) => {\n      if (node) {\n        // Dispatches the custom menu mouse enter event with throttling\n        // Needs to trigger on mouseover to support keyboard + mouse together\n        // i.e. keyboard opens submenus while cursor is still on the parent\n        node.addEventListener('mouseover', e => {\n          if (canDispatchCustomEventRef.current) {\n            canDispatchCustomEventRef.current = false;\n            dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore #16889 Node setTimeout type leaking\n            throttleDispatchTimerRef.current = setTimeout(() => (canDispatchCustomEventRef.current = true), 250);\n          }\n        });\n      }\n    },\n    [popoverRef, throttleDispatchTimerRef],\n  );\n\n  React.useEffect(() => {\n    () => clearTimeout(throttleDispatchTimerRef.current);\n  }, []);\n\n  const inline = useMenuContext_unstable(context => context.inline) ?? false;\n  const rootProps = getNativeElementProps('div', {\n    role: 'presentation',\n    ...props,\n    ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef),\n  });\n\n  const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n\n  rootProps.onMouseEnter = useEventCallback((e: React.MouseEvent<HTMLElement>) => {\n    if (openOnHover) {\n      setOpen(e, { open: true, keyboard: false });\n    }\n\n    onMouseEnterOriginal?.(e);\n  });\n\n  rootProps.onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLElement>) => {\n    const key = e.key;\n\n    if (key === Escape || (isSubmenu && key === CloseArrowKey)) {\n      if (popoverRef.current?.contains(e.target as HTMLElement)) {\n        setOpen(e, { open: false, keyboard: true });\n      }\n    }\n\n    if (key === Tab) {\n      setOpen(e, { open: false, keyboard: true });\n      e.preventDefault();\n    }\n\n    onKeyDownOriginal?.(e);\n  });\n\n  return {\n    inline,\n    components: {\n      root: 'div',\n    },\n    root: rootProps,\n  };\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.d.ts

@@ -0,0 +1,6 @@
+import type { MenuPopoverState } from './MenuPopover.types';
+export declare const menuPopoverClassName = "fui-MenuPopover";
+/**
+ * Apply styling to the Menu slots based on the state
+ */
+export declare const useMenuPopoverStyles_unstable: (state: MenuPopoverState) => MenuPopoverState;

package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMenuPopoverStyles_unstable = exports.menuPopoverClassName = void 0;
+
+const react_1 = /*#__PURE__*/require("@griffel/react");
+
+const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
+
+exports.menuPopoverClassName = 'fui-MenuPopover';
+
+const useStyles = /*#__PURE__*/react_1.__styles({
+  "root": {
+    "Bbmb7ep": ["f1aa9q02", "f16jpd5f"],
+    "Beyfa6y": ["f16jpd5f", "f1aa9q02"],
+    "B7oj6ja": ["f1jar5jt", "fyu767a"],
+    "Btl43ni": ["fyu767a", "f1jar5jt"],
+    "De3pzq": "fxugw4r",
+    "Bf4jedk": "fkqu4gx",
+    "B2u0y6b": "f1kaai3v",
+    "a9b677": "f1ahpp82",
+    "E5pizo": "f1hg901r",
+    "z8tnut": "f10ra9hq",
+    "z189sj": ["f8wuabp", "fycuoez"],
+    "Byoj8tv": "f1y2xyjm",
+    "uwmqm3": ["fycuoez", "f8wuabp"],
+    "B4j52fo": "f5ogflp",
+    "Bekrc4i": ["f1hqa2wf", "finvdd3"],
+    "Bn0qgzm": "f1f09k3d",
+    "ibv6hh": ["finvdd3", "f1hqa2wf"],
+    "icvyot": "fzkkow9",
+    "vrafjx": ["fcdblym", "fjik90z"],
+    "oivjwe": "fg706s2",
+    "wvpqe5": ["fjik90z", "fcdblym"],
+    "g2u3we": "fghlq4f",
+    "h3c5rm": ["f1gn591s", "fjscplz"],
+    "B9xav0g": "fb073pr",
+    "zhjwy3": ["fjscplz", "f1gn591s"]
+  }
+}, {
+  "d": [".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".fkqu4gx{min-width:128px;}", ".f1kaai3v{max-width:300px;}", ".f1ahpp82{width:-webkit-max-content;width:-moz-max-content;width:max-content;}", ".f1hg901r{box-shadow:var(--shadow16);}", ".f10ra9hq{padding-top:4px;}", ".f8wuabp{padding-right:4px;}", ".fycuoez{padding-left:4px;}", ".f1y2xyjm{padding-bottom:4px;}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}"]
+});
+/**
+ * Apply styling to the Menu slots based on the state
+ */
+
+
+const useMenuPopoverStyles_unstable = state => {
+  const styles = useStyles();
+  state.root.className = react_1.mergeClasses(exports.menuPopoverClassName, styles.root, state.root.className);
+  return state;
+};
+
+exports.useMenuPopoverStyles_unstable = useMenuPopoverStyles_unstable;
+//# sourceMappingURL=useMenuPopoverStyles.js.map

package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAGa,OAAA,CAAA,oBAAA,GAAuB,iBAAvB;;AAEb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAaA;;AAEG;;;AACI,MAAM,6BAA6B,GAAI,KAAD,IAA8C;AACzF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,oBAAb,EAAmC,MAAM,CAAC,IAA1C,EAAgD,KAAK,CAAC,IAAN,CAAW,SAA3D,CAAvB;AACA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,6BAAA,GAA6B,6BAA7B","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuPopoverState } from './MenuPopover.types';\n\nexport const menuPopoverClassName = 'fui-MenuPopover';\n\nconst useStyles = makeStyles({\n  root: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n    backgroundColor: tokens.colorNeutralBackground1,\n    minWidth: '128px',\n    maxWidth: '300px',\n    width: 'max-content',\n    boxShadow: `${tokens.shadow16}`,\n    ...shorthands.padding('4px'),\n    ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n  },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuPopoverStyles_unstable = (state: MenuPopoverState): MenuPopoverState => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(menuPopoverClassName, styles.root, state.root.className);\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.d.ts

@@ -0,0 +1,6 @@
+import type { MenuSplitGroupProps } from './MenuSplitGroup.types';
+import type { ForwardRefComponent } from '@fluentui/react-utilities';
+/**
+ * Layout wrapper that provides extra keyboard navigation behavior for two `MenuItem` components.
+ */
+export declare const MenuSplitGroup: ForwardRefComponent<MenuSplitGroupProps>;

package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MenuSplitGroup = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const useMenuSplitGroup_1 = /*#__PURE__*/require("./useMenuSplitGroup");
+
+const renderMenuSplitGroup_1 = /*#__PURE__*/require("./renderMenuSplitGroup");
+
+const useMenuSplitGroupStyles_1 = /*#__PURE__*/require("./useMenuSplitGroupStyles");
+/**
+ * Layout wrapper that provides extra keyboard navigation behavior for two `MenuItem` components.
+ */
+
+
+exports.MenuSplitGroup = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useMenuSplitGroup_1.useMenuSplitGroup_unstable(props, ref);
+  useMenuSplitGroupStyles_1.useMenuSplitGroupStyles_unstable(state);
+  return renderMenuSplitGroup_1.renderMenuSplitGroup_unstable(state);
+});
+exports.MenuSplitGroup.displayName = 'MenuSplitGroup';
+//# sourceMappingURL=MenuSplitGroup.js.map

package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuSplitGroup/MenuSplitGroup.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,yBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,cAAA,gBAA2D,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtG,QAAM,KAAK,GAAG,mBAAA,CAAA,0BAAA,CAA2B,KAA3B,EAAkC,GAAlC,CAAd;AAEA,EAAA,yBAAA,CAAA,gCAAA,CAAiC,KAAjC;AACA,SAAO,sBAAA,CAAA,6BAAA,CAA8B,KAA9B,CAAP;AACD,CALuE,CAA3D;AAOb,OAAA,CAAA,cAAA,CAAe,WAAf,GAA6B,gBAA7B","sourcesContent":["import * as React from 'react';\nimport { useMenuSplitGroup_unstable } from './useMenuSplitGroup';\nimport { renderMenuSplitGroup_unstable } from './renderMenuSplitGroup';\nimport { useMenuSplitGroupStyles_unstable } from './useMenuSplitGroupStyles';\nimport type { MenuSplitGroupProps } from './MenuSplitGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Layout wrapper that provides extra keyboard navigation behavior for two `MenuItem` components.\n */\nexport const MenuSplitGroup: ForwardRefComponent<MenuSplitGroupProps> = React.forwardRef((props, ref) => {\n  const state = useMenuSplitGroup_unstable(props, ref);\n\n  useMenuSplitGroupStyles_unstable(state);\n  return renderMenuSplitGroup_unstable(state);\n});\n\nMenuSplitGroup.displayName = 'MenuSplitGroup';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
+export declare type MenuSplitGroupSlots = {
+    root: Slot<'div'>;
+};
+declare type MenuSplitGroupCommons = {};
+/**
+ * MenuSplitGroup Props
+ */
+export declare type MenuSplitGroupProps = ComponentProps<MenuSplitGroupSlots> & MenuSplitGroupCommons;
+/**
+ * State used in rendering MenuSplitGroup
+ */
+export declare type MenuSplitGroupState = ComponentState<MenuSplitGroupSlots> & MenuSplitGroupCommons;
+export {};

package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=MenuSplitGroup.types.js.map

package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}

package/lib-commonjs/components/MenuSplitGroup/index.d.ts

@@ -0,0 +1,5 @@
+export * from './MenuSplitGroup';
+export * from './MenuSplitGroup.types';
+export * from './renderMenuSplitGroup';
+export * from './useMenuSplitGroup';
+export * from './useMenuSplitGroupStyles';

package/lib-commonjs/components/MenuSplitGroup/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+const tslib_1 = /*#__PURE__*/require("tslib");
+
+tslib_1.__exportStar(require("./MenuSplitGroup"), exports);
+
+tslib_1.__exportStar(require("./MenuSplitGroup.types"), exports);
+
+tslib_1.__exportStar(require("./renderMenuSplitGroup"), exports);
+
+tslib_1.__exportStar(require("./useMenuSplitGroup"), exports);
+
+tslib_1.__exportStar(require("./useMenuSplitGroupStyles"), exports);
+//# sourceMappingURL=index.js.map

package/lib-commonjs/components/MenuSplitGroup/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuSplitGroup/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,2BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './MenuSplitGroup';\nexport * from './MenuSplitGroup.types';\nexport * from './renderMenuSplitGroup';\nexport * from './useMenuSplitGroup';\nexport * from './useMenuSplitGroupStyles';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.d.ts

@@ -0,0 +1,5 @@
+import type { MenuSplitGroupState } from './MenuSplitGroup.types';
+/**
+ * Render the final JSX of MenuSplitGroup
+ */
+export declare const renderMenuSplitGroup_unstable: (state: MenuSplitGroupState) => JSX.Element;

package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.renderMenuSplitGroup_unstable = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+/**
+ * Render the final JSX of MenuSplitGroup
+ */
+
+
+const renderMenuSplitGroup_unstable = state => {
+  const {
+    slots,
+    slotProps
+  } = react_utilities_1.getSlots(state);
+  return React.createElement(slots.root, { ...slotProps.root
+  });
+};
+
+exports.renderMenuSplitGroup_unstable = renderMenuSplitGroup_unstable;
+//# sourceMappingURL=renderMenuSplitGroup.js.map

package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/MenuSplitGroup/renderMenuSplitGroup.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,6BAA6B,GAAI,KAAD,IAA+B;AAC1E,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA8B,KAA9B,CAA7B;AAEA,SAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAAP;AACD,CAJM;;AAAM,OAAA,CAAA,6BAAA,GAA6B,6BAA7B","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuSplitGroupState, MenuSplitGroupSlots } from './MenuSplitGroup.types';\n\n/**\n * Render the final JSX of MenuSplitGroup\n */\nexport const renderMenuSplitGroup_unstable = (state: MenuSplitGroupState) => {\n  const { slots, slotProps } = getSlots<MenuSplitGroupSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import type { MenuSplitGroupProps, MenuSplitGroupState } from './MenuSplitGroup.types';
+/**
+ * Create the state required to render MenuSplitGroup.
+ *
+ * The returned state can be modified with hooks such as useMenuSplitGroupStyles_unstable,
+ * before being passed to renderMenuSplitGroup_unstable.
+ *
+ * @param props - props from this instance of MenuSplitGroup
+ * @param ref - reference to root HTMLElement of MenuSplitGroup
+ */
+export declare const useMenuSplitGroup_unstable: (props: MenuSplitGroupProps, ref: React.Ref<HTMLElement>) => MenuSplitGroupState;