@fluentui/react-menu 9.4.1 → 9.5.0

package/lib-amd/components/MenuItem/useMenuItem.js

@@ -0,0 +1,80 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "@fluentui/react-shared-contexts", "./useCharacterSearch", "../../contexts/menuTriggerContext", "@fluentui/react-icons", "../../contexts/menuListContext", "../../contexts/menuContext", "@fluentui/react-aria", "@fluentui/keyboard-keys"], function (require, exports, tslib_1, React, react_utilities_1, react_shared_contexts_1, useCharacterSearch_1, menuTriggerContext_1, react_icons_1, menuListContext_1, menuContext_1, react_aria_1, keyboard_keys_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useMenuItem_unstable = void 0;
+    var ChevronRightIcon = react_icons_1.bundleIcon(react_icons_1.ChevronRightFilled, react_icons_1.ChevronRightRegular);
+    var ChevronLeftIcon = react_icons_1.bundleIcon(react_icons_1.ChevronLeftFilled, react_icons_1.ChevronLeftRegular);
+    /**
+     * Returns the props and state required to render the component
+     */
+    var useMenuItem_unstable = function (props, ref) {
+        var isSubmenuTrigger = menuTriggerContext_1.useMenuTriggerContext_unstable();
+        var persistOnClickContext = menuContext_1.useMenuContext_unstable(function (context) { return context.persistOnItemClick; });
+        var _a = props.as, as = _a === void 0 ? 'div' : _a, disabled = props.disabled, disabledFocusable = props.disabledFocusable, _b = props.hasSubmenu, hasSubmenu = _b === void 0 ? isSubmenuTrigger : _b, _c = props.persistOnClick, persistOnClick = _c === void 0 ? persistOnClickContext : _c;
+        var hasIcons = menuListContext_1.useMenuListContext_unstable(function (context) { return context.hasIcons; });
+        var hasCheckmarks = menuListContext_1.useMenuListContext_unstable(function (context) { return context.hasCheckmarks; });
+        var setOpen = menuContext_1.useMenuContext_unstable(function (context) { return context.setOpen; });
+        var dir = react_shared_contexts_1.useFluent_unstable().dir;
+        var innerRef = React.useRef(null);
+        var dismissedWithKeyboardRef = React.useRef(false);
+        var isDisabled = Boolean(disabled || disabledFocusable);
+        var state = {
+            hasSubmenu: hasSubmenu,
+            disabled: isDisabled,
+            persistOnClick: persistOnClick,
+            components: {
+                root: 'div',
+                icon: 'span',
+                checkmark: 'span',
+                submenuIndicator: 'span',
+                content: 'span',
+                secondaryContent: 'span',
+            },
+            isNativeButton: as === 'button',
+            root: react_utilities_1.getNativeElementProps(as, react_aria_1.useARIAButtonShorthand({ disabled: false, disabledFocusable: isDisabled, as: as }, {
+                required: true,
+                defaultProps: tslib_1.__assign(tslib_1.__assign({ role: 'menuitem' }, props), { ref: react_utilities_1.useMergedRefs(ref, innerRef), onKeyDown: react_utilities_1.useEventCallback(function (event) {
+                        var _a;
+                        (_a = props.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(props, event);
+                        if (!event.isDefaultPrevented() && (event.key === keyboard_keys_1.Space || event.key === keyboard_keys_1.Enter)) {
+                            dismissedWithKeyboardRef.current = true;
+                        }
+                    }), onMouseEnter: react_utilities_1.useEventCallback(function (event) {
+                        var _a, _b;
+                        (_a = innerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+                        (_b = props.onMouseEnter) === null || _b === void 0 ? void 0 : _b.call(props, event);
+                    }), onClick: react_utilities_1.useEventCallback(function (event) {
+                        var _a;
+                        if (!hasSubmenu && !persistOnClick) {
+                            setOpen(event, {
+                                open: false,
+                                keyboard: dismissedWithKeyboardRef.current,
+                                bubble: true,
+                                type: 'menuItemClick',
+                                event: event,
+                            });
+                            dismissedWithKeyboardRef.current = false;
+                        }
+                        (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, event);
+                    }) }),
+            })),
+            icon: react_utilities_1.resolveShorthand(props.icon, { required: hasIcons }),
+            checkmark: react_utilities_1.resolveShorthand(props.checkmark, { required: hasCheckmarks }),
+            submenuIndicator: react_utilities_1.resolveShorthand(props.submenuIndicator, {
+                required: hasSubmenu,
+                defaultProps: {
+                    children: dir === 'ltr' ? React.createElement(ChevronRightIcon, null) : React.createElement(ChevronLeftIcon, null),
+                },
+            }),
+            content: react_utilities_1.resolveShorthand(props.content, {
+                required: !!props.children,
+                defaultProps: { children: props.children },
+            }),
+            secondaryContent: react_utilities_1.resolveShorthand(props.secondaryContent),
+        };
+        useCharacterSearch_1.useCharacterSearch(state, innerRef);
+        return state;
+    };
+    exports.useMenuItem_unstable = useMenuItem_unstable;
+});
+//# sourceMappingURL=useMenuItem.js.map

package/lib-amd/components/MenuItem/useMenuItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuItem.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItem/useMenuItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useEventCallback, resolveShorthand, useMergedRefs, getNativeElementProps } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useCharacterSearch } from './useCharacterSearch';\nimport { useMenuTriggerContext_unstable } from '../../contexts/menuTriggerContext';\nimport {\n  ChevronRightFilled,\n  ChevronRightRegular,\n  ChevronLeftFilled,\n  ChevronLeftRegular,\n  bundleIcon,\n} from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport type { MenuItemProps, MenuItemState } from './MenuItem.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection, ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport { useARIAButtonShorthand } from '@fluentui/react-aria';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\n\nconst ChevronRightIcon = bundleIcon(ChevronRightFilled, ChevronRightRegular);\nconst ChevronLeftIcon = bundleIcon(ChevronLeftFilled, ChevronLeftRegular);\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuItem_unstable = (props: MenuItemProps, ref: React.Ref<ARIAButtonElement<'div'>>): MenuItemState => {\n  const isSubmenuTrigger = useMenuTriggerContext_unstable();\n  const persistOnClickContext = useMenuContext_unstable(context => context.persistOnItemClick);\n  const {\n    as = 'div',\n    disabled,\n    disabledFocusable,\n    hasSubmenu = isSubmenuTrigger,\n    persistOnClick = persistOnClickContext,\n  } = props;\n  const hasIcons = useMenuListContext_unstable(context => context.hasIcons);\n  const hasCheckmarks = useMenuListContext_unstable(context => context.hasCheckmarks);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n\n  const { dir } = useFluent();\n  const innerRef = React.useRef<ARIAButtonElementIntersection<'div'>>(null);\n  const dismissedWithKeyboardRef = React.useRef(false);\n\n  const isDisabled = Boolean(disabled || disabledFocusable);\n\n  const state: MenuItemState = {\n    hasSubmenu,\n    disabled: isDisabled,\n    persistOnClick,\n    components: {\n      root: 'div',\n      icon: 'span',\n      checkmark: 'span',\n      submenuIndicator: 'span',\n      content: 'span',\n      secondaryContent: 'span',\n    },\n    isNativeButton: as === 'button',\n    root: getNativeElementProps(\n      as,\n      useARIAButtonShorthand<ARIAButtonSlotProps<'div'>>(\n        { disabled: false, disabledFocusable: isDisabled, as },\n        {\n          required: true,\n          defaultProps: {\n            role: 'menuitem',\n            ...props,\n            ref: useMergedRefs(ref, innerRef) as React.Ref<ARIAButtonElementIntersection<'div'>>,\n            onKeyDown: useEventCallback(event => {\n              props.onKeyDown?.(event);\n              if (!event.isDefaultPrevented() && (event.key === Space || event.key === Enter)) {\n                dismissedWithKeyboardRef.current = true;\n              }\n            }),\n            onMouseEnter: useEventCallback(event => {\n              innerRef.current?.focus();\n\n              props.onMouseEnter?.(event);\n            }),\n            onClick: useEventCallback(event => {\n              if (!hasSubmenu && !persistOnClick) {\n                setOpen(event, {\n                  open: false,\n                  keyboard: dismissedWithKeyboardRef.current,\n                  bubble: true,\n                  type: 'menuItemClick',\n                  event,\n                });\n                dismissedWithKeyboardRef.current = false;\n              }\n\n              props.onClick?.(event);\n            }),\n          },\n        },\n      ),\n    ),\n    icon: resolveShorthand(props.icon, { required: hasIcons }),\n    checkmark: resolveShorthand(props.checkmark, { required: hasCheckmarks }),\n    submenuIndicator: resolveShorthand(props.submenuIndicator, {\n      required: hasSubmenu,\n      defaultProps: {\n        children: dir === 'ltr' ? <ChevronRightIcon /> : <ChevronLeftIcon />,\n      },\n    }),\n    content: resolveShorthand(props.content, {\n      required: !!props.children,\n      defaultProps: { children: props.children },\n    }),\n    secondaryContent: resolveShorthand(props.secondaryContent),\n  };\n  useCharacterSearch(state, innerRef);\n  return state;\n};\n"]}

package/lib-amd/components/MenuItem/useMenuItemStyles.js

@@ -0,0 +1,100 @@
+define(["require", "exports", "tslib", "@griffel/react", "@fluentui/react-icons", "@fluentui/react-tabster", "@fluentui/react-theme", "../../selectable/index"], function (require, exports, tslib_1, react_1, react_icons_1, react_tabster_1, react_theme_1, index_1) {
+    "use strict";
+    var _a;
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useMenuItemStyles_unstable = exports.menuItemClassNames = void 0;
+    exports.menuItemClassNames = {
+        root: 'fui-MenuItem',
+        icon: 'fui-MenuItem__icon',
+        checkmark: 'fui-MenuItem__checkmark',
+        submenuIndicator: 'fui-MenuItem__submenuIndicator',
+        content: 'fui-MenuItem__content',
+        secondaryContent: 'fui-MenuItem__secondaryContent',
+    };
+    var useStyles = react_1.makeStyles({
+        focusIndicator: react_tabster_1.createFocusOutlineStyle(),
+        // TODO: this should be extracted to another package
+        resetButton: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({ boxSizing: 'content-box', backgroundColor: 'inherit', color: 'inherit', fontFamily: 'inherit', fontSize: 'inherit', lineHeight: 'normal' }, react_1.shorthands.borderColor('transparent')), react_1.shorthands.overflow('visible')), react_1.shorthands.padding(0)), { WebkitAppearance: 'button', textAlign: 'unset' }),
+        root: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, react_1.shorthands.borderRadius(react_theme_1.tokens.borderRadiusMedium)), { position: 'relative', color: react_theme_1.tokens.colorNeutralForeground2, backgroundColor: react_theme_1.tokens.colorNeutralBackground1, paddingRight: '10px', paddingLeft: '10px', height: '32px', display: 'flex', alignItems: 'center', fontSize: react_theme_1.tokens.fontSizeBase300, cursor: 'pointer' }), react_1.shorthands.gap('4px')), { ':hover': (_a = {
+                    backgroundColor: react_theme_1.tokens.colorNeutralBackground1Hover,
+                    color: react_theme_1.tokens.colorNeutralForeground2Hover
+                },
+                _a["& ." + react_icons_1.iconFilledClassName] = {
+                    display: 'inline',
+                },
+                _a["& ." + react_icons_1.iconRegularClassName] = {
+                    display: 'none',
+                },
+                _a["& ." + exports.menuItemClassNames.icon] = {
+                    color: react_theme_1.tokens.colorNeutralForeground2BrandSelected,
+                },
+                _a), userSelect: 'none' }),
+        content: {
+            paddingLeft: '2px',
+            paddingRight: '2px',
+            backgroundColor: 'transparent',
+            flexGrow: 1,
+        },
+        secondaryContent: {
+            paddingLeft: '2px',
+            paddingRight: '2px',
+            color: react_theme_1.tokens.colorNeutralForeground3,
+            ':hover': {
+                color: react_theme_1.tokens.colorNeutralForeground3Hover,
+            },
+            ':focus': {
+                color: react_theme_1.tokens.colorNeutralForeground3Hover,
+            },
+        },
+        icon: {
+            width: '20px',
+            height: '20px',
+            fontSize: '20px',
+            lineHeight: 0,
+            alignItems: 'center',
+            display: 'inline-flex',
+            justifyContent: 'center',
+        },
+        submenuIndicator: {
+            width: '20px',
+            height: '20px',
+            fontSize: '20px',
+            lineHeight: 0,
+            alignItems: 'center',
+            display: 'inline-flex',
+            justifyContent: 'center',
+        },
+        disabled: {
+            color: react_theme_1.tokens.colorNeutralForegroundDisabled,
+            ':hover': {
+                color: react_theme_1.tokens.colorNeutralForegroundDisabled,
+            },
+            ':focus': {
+                color: react_theme_1.tokens.colorNeutralForegroundDisabled,
+            },
+        },
+    });
+    /** Applies style classnames to slots */
+    var useMenuItemStyles_unstable = function (state) {
+        var styles = useStyles();
+        state.root.className = react_1.mergeClasses(exports.menuItemClassNames.root, state.isNativeButton && styles.resetButton, styles.root, styles.focusIndicator, state.disabled && styles.disabled, state.root.className);
+        if (state.content) {
+            state.content.className = react_1.mergeClasses(exports.menuItemClassNames.content, styles.content, state.content.className);
+        }
+        if (state.checkmark) {
+            state.checkmark.className = react_1.mergeClasses(exports.menuItemClassNames.checkmark, state.checkmark.className);
+        }
+        if (state.secondaryContent) {
+            state.secondaryContent.className = react_1.mergeClasses(exports.menuItemClassNames.secondaryContent, !state.disabled && styles.secondaryContent, state.secondaryContent.className);
+        }
+        if (state.icon) {
+            state.icon.className = react_1.mergeClasses(exports.menuItemClassNames.icon, styles.icon, state.icon.className);
+        }
+        if (state.submenuIndicator) {
+            state.submenuIndicator.className = react_1.mergeClasses(exports.menuItemClassNames.submenuIndicator, styles.submenuIndicator, state.submenuIndicator.className);
+        }
+        index_1.useCheckmarkStyles_unstable(state);
+    };
+    exports.useMenuItemStyles_unstable = useMenuItemStyles_unstable;
+});
+//# sourceMappingURL=useMenuItemStyles.js.map

package/lib-amd/components/MenuItem/useMenuItemStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuItemStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItem/useMenuItemStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport type { MenuItemCheckboxState } from '../MenuItemCheckbox/index';\nimport type { MenuItemSlots, MenuItemState } from './MenuItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuItemClassNames: SlotClassNames<MenuItemSlots> = {\n  root: 'fui-MenuItem',\n  icon: 'fui-MenuItem__icon',\n  checkmark: 'fui-MenuItem__checkmark',\n  submenuIndicator: 'fui-MenuItem__submenuIndicator',\n  content: 'fui-MenuItem__content',\n  secondaryContent: 'fui-MenuItem__secondaryContent',\n};\n\nconst useStyles = makeStyles({\n  focusIndicator: createFocusOutlineStyle(),\n  // TODO: this should be extracted to another package\n  resetButton: {\n    boxSizing: 'content-box',\n    backgroundColor: 'inherit',\n    color: 'inherit',\n    fontFamily: 'inherit',\n    fontSize: 'inherit',\n    lineHeight: 'normal',\n    ...shorthands.borderColor('transparent'),\n    ...shorthands.overflow('visible'),\n    ...shorthands.padding(0),\n    WebkitAppearance: 'button',\n    textAlign: 'unset',\n  },\n  root: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n    position: 'relative',\n    color: tokens.colorNeutralForeground2,\n    backgroundColor: tokens.colorNeutralBackground1,\n    paddingRight: '10px',\n    paddingLeft: '10px',\n    height: '32px',\n    display: 'flex',\n    alignItems: 'center',\n    fontSize: tokens.fontSizeBase300,\n    cursor: 'pointer',\n    ...shorthands.gap('4px'),\n\n    ':hover': {\n      backgroundColor: tokens.colorNeutralBackground1Hover,\n      color: tokens.colorNeutralForeground2Hover,\n\n      [`& .${iconFilledClassName}`]: {\n        display: 'inline',\n      },\n      [`& .${iconRegularClassName}`]: {\n        display: 'none',\n      },\n      [`& .${menuItemClassNames.icon}`]: {\n        color: tokens.colorNeutralForeground2BrandSelected,\n      },\n    },\n\n    userSelect: 'none',\n  },\n  content: {\n    paddingLeft: '2px',\n    paddingRight: '2px',\n    backgroundColor: 'transparent',\n    flexGrow: 1,\n  },\n  secondaryContent: {\n    paddingLeft: '2px',\n    paddingRight: '2px',\n    color: tokens.colorNeutralForeground3,\n    ':hover': {\n      color: tokens.colorNeutralForeground3Hover,\n    },\n    ':focus': {\n      color: tokens.colorNeutralForeground3Hover,\n    },\n  },\n  icon: {\n    width: '20px',\n    height: '20px',\n    fontSize: '20px',\n    lineHeight: 0,\n    alignItems: 'center',\n    display: 'inline-flex',\n    justifyContent: 'center',\n  },\n  submenuIndicator: {\n    width: '20px',\n    height: '20px',\n    fontSize: '20px',\n    lineHeight: 0,\n    alignItems: 'center',\n    display: 'inline-flex',\n    justifyContent: 'center',\n  },\n  disabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':hover': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n\n    ':focus': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\n/** Applies style classnames to slots */\nexport const useMenuItemStyles_unstable = (state: MenuItemState) => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    menuItemClassNames.root,\n    state.isNativeButton && styles.resetButton,\n    styles.root,\n    styles.focusIndicator,\n    state.disabled && styles.disabled,\n    state.root.className,\n  );\n\n  if (state.content) {\n    state.content.className = mergeClasses(menuItemClassNames.content, styles.content, state.content.className);\n  }\n\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, state.checkmark.className);\n  }\n\n  if (state.secondaryContent) {\n    state.secondaryContent.className = mergeClasses(\n      menuItemClassNames.secondaryContent,\n      !state.disabled && styles.secondaryContent,\n      state.secondaryContent.className,\n    );\n  }\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(menuItemClassNames.icon, styles.icon, state.icon.className);\n  }\n\n  if (state.submenuIndicator) {\n    state.submenuIndicator.className = mergeClasses(\n      menuItemClassNames.submenuIndicator,\n      styles.submenuIndicator,\n      state.submenuIndicator.className,\n    );\n  }\n  useCheckmarkStyles_unstable(state as MenuItemCheckboxState);\n};\n"]}

package/lib-amd/components/MenuItemCheckbox/MenuItemCheckbox.js

@@ -0,0 +1,15 @@
+define(["require", "exports", "react", "./useMenuItemCheckbox", "./renderMenuItemCheckbox", "./useMenuItemCheckboxStyles"], function (require, exports, React, useMenuItemCheckbox_1, renderMenuItemCheckbox_1, useMenuItemCheckboxStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.MenuItemCheckbox = void 0;
+    /**
+     * Define a styled MenuItemCheckbox, using the `useMenuItemCheckbox_unstable` hook.
+     */
+    exports.MenuItemCheckbox = React.forwardRef(function (props, ref) {
+        var state = useMenuItemCheckbox_1.useMenuItemCheckbox_unstable(props, ref);
+        useMenuItemCheckboxStyles_1.useMenuItemCheckboxStyles_unstable(state);
+        return renderMenuItemCheckbox_1.renderMenuItemCheckbox_unstable(state);
+    });
+    exports.MenuItemCheckbox.displayName = 'MenuItemCheckbox';
+});
+//# sourceMappingURL=MenuItemCheckbox.js.map

package/lib-amd/components/MenuItemCheckbox/MenuItemCheckbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemCheckbox.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemCheckbox/MenuItemCheckbox.tsx"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,gBAAgB,GAA+C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACtG,IAAM,KAAK,GAAG,kDAA4B,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACvD,8DAAkC,CAAC,KAAK,CAAC,CAAC;QAE1C,OAAO,wDAA+B,CAAC,KAAK,CAAC,CAAC;IAChD,CAAC,CAAC,CAAC;IAEH,wBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAC","sourcesContent":["import * as React from 'react';\nimport { useMenuItemCheckbox_unstable } from './useMenuItemCheckbox';\nimport { renderMenuItemCheckbox_unstable } from './renderMenuItemCheckbox';\nimport { useMenuItemCheckboxStyles_unstable } from './useMenuItemCheckboxStyles';\nimport type { MenuItemCheckboxProps } from './MenuItemCheckbox.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled MenuItemCheckbox, using the `useMenuItemCheckbox_unstable` hook.\n */\nexport const MenuItemCheckbox: ForwardRefComponent<MenuItemCheckboxProps> = React.forwardRef((props, ref) => {\n  const state = useMenuItemCheckbox_unstable(props, ref);\n  useMenuItemCheckboxStyles_unstable(state);\n\n  return renderMenuItemCheckbox_unstable(state);\n});\n\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n"]}

package/lib-amd/components/MenuItemCheckbox/MenuItemCheckbox.types.js

@@ -0,0 +1,5 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});
+//# sourceMappingURL=MenuItemCheckbox.types.js.map

package/lib-amd/components/MenuItemCheckbox/MenuItemCheckbox.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemCheckbox.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemCheckbox/MenuItemCheckbox.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { MenuItemSelectableProps, MenuItemSelectableState } from '../../selectable/index';\nimport type { MenuItemProps, MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport type MenuItemCheckboxProps = MenuItemProps & MenuItemSelectableProps;\n\nexport type MenuItemCheckboxState = MenuItemState & MenuItemSelectableState;\n"]}

package/lib-amd/components/MenuItemCheckbox/index.js

@@ -0,0 +1,10 @@
+define(["require", "exports", "tslib", "./MenuItemCheckbox.types", "./MenuItemCheckbox", "./renderMenuItemCheckbox", "./useMenuItemCheckbox", "./useMenuItemCheckboxStyles"], function (require, exports, tslib_1, MenuItemCheckbox_types_1, MenuItemCheckbox_1, renderMenuItemCheckbox_1, useMenuItemCheckbox_1, useMenuItemCheckboxStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(MenuItemCheckbox_types_1, exports);
+    tslib_1.__exportStar(MenuItemCheckbox_1, exports);
+    tslib_1.__exportStar(renderMenuItemCheckbox_1, exports);
+    tslib_1.__exportStar(useMenuItemCheckbox_1, exports);
+    tslib_1.__exportStar(useMenuItemCheckboxStyles_1, exports);
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/components/MenuItemCheckbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemCheckbox/index.ts"],"names":[],"mappings":";;;IAAA,wDAAyC;IACzC,kDAAmC;IACnC,wDAAyC;IACzC,qDAAsC;IACtC,2DAA4C","sourcesContent":["export * from './MenuItemCheckbox.types';\nexport * from './MenuItemCheckbox';\nexport * from './renderMenuItemCheckbox';\nexport * from './useMenuItemCheckbox';\nexport * from './useMenuItemCheckboxStyles';\n"]}

package/lib-amd/components/MenuItemCheckbox/renderMenuItemCheckbox.js

@@ -0,0 +1,16 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-utilities"], function (require, exports, tslib_1, React, react_utilities_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.renderMenuItemCheckbox_unstable = void 0;
+    /** Function that renders the final JSX of the component  */
+    var renderMenuItemCheckbox_unstable = function (state) {
+        var _a = react_utilities_1.getSlots(state), slots = _a.slots, slotProps = _a.slotProps;
+        return (React.createElement(slots.root, tslib_1.__assign({}, slotProps.root),
+            slots.checkmark && React.createElement(slots.checkmark, tslib_1.__assign({}, slotProps.checkmark)),
+            slots.icon && React.createElement(slots.icon, tslib_1.__assign({}, slotProps.icon)),
+            slots.content && React.createElement(slots.content, tslib_1.__assign({}, slotProps.content)),
+            slots.secondaryContent && React.createElement(slots.secondaryContent, tslib_1.__assign({}, slotProps.secondaryContent))));
+    };
+    exports.renderMenuItemCheckbox_unstable = renderMenuItemCheckbox_unstable;
+});
+//# sourceMappingURL=renderMenuItemCheckbox.js.map

package/lib-amd/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderMenuItemCheckbox.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemCheckbox/renderMenuItemCheckbox.tsx"],"names":[],"mappings":";;;;IAKA,4DAA4D;IACrD,IAAM,+BAA+B,GAAG,UAAC,KAA4B;QACpE,IAAA,KAAuB,0BAAQ,CAAgB,KAAK,CAAC,EAAnD,KAAK,WAAA,EAAE,SAAS,eAAmC,CAAC;QAE5D,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI;YAC3B,KAAK,CAAC,SAAS,IAAI,oBAAC,KAAK,CAAC,SAAS,uBAAK,SAAS,CAAC,SAAS,EAAI;YAC/D,KAAK,CAAC,IAAI,IAAI,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI,EAAI;YAChD,KAAK,CAAC,OAAO,IAAI,oBAAC,KAAK,CAAC,OAAO,uBAAK,SAAS,CAAC,OAAO,EAAI;YACzD,KAAK,CAAC,gBAAgB,IAAI,oBAAC,KAAK,CAAC,gBAAgB,uBAAK,SAAS,CAAC,gBAAgB,EAAI,CAC1E,CACd,CAAC;IACJ,CAAC,CAAC;IAXW,QAAA,+BAA+B,mCAW1C","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { MenuItemSlots } from '../MenuItem/MenuItem.types';\n\n/** Function that renders the final JSX of the component  */\nexport const renderMenuItemCheckbox_unstable = (state: MenuItemCheckboxState) => {\n  const { slots, slotProps } = getSlots<MenuItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.checkmark && <slots.checkmark {...slotProps.checkmark} />}\n      {slots.icon && <slots.icon {...slotProps.icon} />}\n      {slots.content && <slots.content {...slotProps.content} />}\n      {slots.secondaryContent && <slots.secondaryContent {...slotProps.secondaryContent} />}\n    </slots.root>\n  );\n};\n"]}

package/lib-amd/components/MenuItemCheckbox/useMenuItemCheckbox.js

@@ -0,0 +1,26 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "@fluentui/react-icons", "../../contexts/menuListContext", "../MenuItem/useMenuItem"], function (require, exports, tslib_1, React, react_utilities_1, react_icons_1, menuListContext_1, useMenuItem_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useMenuItemCheckbox_unstable = void 0;
+    /** Returns the props and state required to render the component */
+    var useMenuItemCheckbox_unstable = function (props, ref) {
+        var toggleCheckbox = menuListContext_1.useMenuListContext_unstable(function (context) { return context.toggleCheckbox; });
+        var name = props.name, value = props.value;
+        var checked = menuListContext_1.useMenuListContext_unstable(function (context) {
+            var _a;
+            var checkedItems = ((_a = context.checkedValues) === null || _a === void 0 ? void 0 : _a[name]) || [];
+            return checkedItems.indexOf(value) !== -1;
+        });
+        var state = tslib_1.__assign(tslib_1.__assign({}, useMenuItem_1.useMenuItem_unstable(tslib_1.__assign(tslib_1.__assign({ role: 'menuitemcheckbox', persistOnClick: true }, props), { 'aria-checked': checked, checkmark: react_utilities_1.resolveShorthand(props.checkmark, {
+                defaultProps: { children: React.createElement(react_icons_1.Checkmark16Filled, null) },
+                required: true,
+            }), onClick: function (e) {
+                var _a;
+                toggleCheckbox === null || toggleCheckbox === void 0 ? void 0 : toggleCheckbox(e, name, value, checked);
+                (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
+            } }), ref)), { name: name, value: value, checked: checked });
+        return state;
+    };
+    exports.useMenuItemCheckbox_unstable = useMenuItemCheckbox_unstable;
+});
+//# sourceMappingURL=useMenuItemCheckbox.js.map

package/lib-amd/components/MenuItemCheckbox/useMenuItemCheckbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuItemCheckbox.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemCheckbox/useMenuItemCheckbox.tsx"],"names":[],"mappings":";;;;IAQA,mEAAmE;IAC5D,IAAM,4BAA4B,GAAG,UAC1C,KAA4B,EAC5B,GAAwC;QAExC,IAAM,cAAc,GAAG,6CAA2B,CAAC,UAAA,OAAO,IAAI,OAAA,OAAO,CAAC,cAAc,EAAtB,CAAsB,CAAC,CAAC;QAC9E,IAAA,IAAI,GAAY,KAAK,KAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;QAE9B,IAAM,OAAO,GAAG,6CAA2B,CAAC,UAAA,OAAO;;YACjD,IAAM,YAAY,GAAG,CAAA,MAAA,OAAO,CAAC,aAAa,0CAAG,IAAI,CAAC,KAAI,EAAE,CAAC;YACzD,OAAO,YAAY,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;QAC5C,CAAC,CAAC,CAAC;QAEH,IAAM,KAAK,yCACN,kCAAoB,qCAEnB,IAAI,EAAE,kBAAkB,EACxB,cAAc,EAAE,IAAI,IACjB,KAAK,KACR,cAAc,EAAE,OAAO,EACvB,SAAS,EAAE,kCAAgB,CAAC,KAAK,CAAC,SAAS,EAAE;gBAC3C,YAAY,EAAE,EAAE,QAAQ,EAAE,oBAAC,+BAAiB,OAAG,EAAE;gBACjD,QAAQ,EAAE,IAAI;aACf,CAAC,EACF,OAAO,EAAE,UAAC,CAAyD;;gBACjE,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;gBAC1C,MAAA,KAAK,CAAC,OAAO,+CAAb,KAAK,EAAW,CAAC,CAAC,CAAC;YACrB,CAAC,KAEH,GAAG,CACJ,KACD,IAAI,MAAA,EACJ,KAAK,OAAA,EACL,OAAO,SAAA,GACR,CAAC;QAEF,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IApCW,QAAA,4BAA4B,gCAoCvC","sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { Checkmark16Filled } from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuItem_unstable } from '../MenuItem/useMenuItem';\nimport type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\n/** Returns the props and state required to render the component */\nexport const useMenuItemCheckbox_unstable = (\n  props: MenuItemCheckboxProps,\n  ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemCheckboxState => {\n  const toggleCheckbox = useMenuListContext_unstable(context => context.toggleCheckbox);\n  const { name, value } = props;\n\n  const checked = useMenuListContext_unstable(context => {\n    const checkedItems = context.checkedValues?.[name] || [];\n    return checkedItems.indexOf(value) !== -1;\n  });\n\n  const state: MenuItemCheckboxState = {\n    ...useMenuItem_unstable(\n      {\n        role: 'menuitemcheckbox',\n        persistOnClick: true,\n        ...props,\n        'aria-checked': checked,\n        checkmark: resolveShorthand(props.checkmark, {\n          defaultProps: { children: <Checkmark16Filled /> },\n          required: true,\n        }),\n        onClick: (e: React.MouseEvent<ARIAButtonElementIntersection<'div'>>) => {\n          toggleCheckbox?.(e, name, value, checked);\n          props.onClick?.(e);\n        },\n      },\n      ref,\n    ),\n    name,\n    value,\n    checked,\n  };\n\n  return state;\n};\n"]}

package/lib-amd/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js

@@ -0,0 +1,31 @@
+define(["require", "exports", "@griffel/react", "../../selectable/index", "../MenuItem/useMenuItemStyles"], function (require, exports, react_1, index_1, useMenuItemStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useMenuItemCheckboxStyles_unstable = exports.menuItemCheckboxClassNames = void 0;
+    exports.menuItemCheckboxClassNames = {
+        root: 'fui-MenuItemCheckbox',
+        icon: 'fui-MenuItemCheckbox__icon',
+        checkmark: 'fui-MenuItemCheckbox__checkmark',
+        content: 'fui-MenuItemCheckbox__content',
+        secondaryContent: 'fui-MenuItemCheckbox__secondaryContent',
+    };
+    var useMenuItemCheckboxStyles_unstable = function (state) {
+        state.root.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.root, state.root.className);
+        if (state.content) {
+            state.content.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.content, state.content.className);
+        }
+        if (state.secondaryContent) {
+            state.secondaryContent.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.secondaryContent, state.secondaryContent.className);
+        }
+        if (state.icon) {
+            state.icon.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.icon, state.icon.className);
+        }
+        if (state.checkmark) {
+            state.checkmark.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.checkmark, state.checkmark.className);
+        }
+        useMenuItemStyles_1.useMenuItemStyles_unstable(state);
+        index_1.useCheckmarkStyles_unstable(state);
+    };
+    exports.useMenuItemCheckboxStyles_unstable = useMenuItemCheckboxStyles_unstable;
+});
+//# sourceMappingURL=useMenuItemCheckboxStyles.js.map

package/lib-amd/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuItemCheckboxStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemCheckbox/useMenuItemCheckboxStyles.ts"],"names":[],"mappings":";;;;IAOa,QAAA,0BAA0B,GAA4D;QACjG,IAAI,EAAE,sBAAsB;QAC5B,IAAI,EAAE,4BAA4B;QAClC,SAAS,EAAE,iCAAiC;QAC5C,OAAO,EAAE,+BAA+B;QACxC,gBAAgB,EAAE,wCAAwC;KAC3D,CAAC;IAEK,IAAM,kCAAkC,GAAG,UAAC,KAA4B;QAC7E,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,oBAAY,CAAC,kCAA0B,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAE3F,IAAI,KAAK,CAAC,OAAO,EAAE;YACjB,KAAK,CAAC,OAAO,CAAC,SAAS,GAAG,oBAAY,CAAC,kCAA0B,CAAC,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;SACrG;QAED,IAAI,KAAK,CAAC,gBAAgB,EAAE;YAC1B,KAAK,CAAC,gBAAgB,CAAC,SAAS,GAAG,oBAAY,CAC7C,kCAA0B,CAAC,gBAAgB,EAC3C,KAAK,CAAC,gBAAgB,CAAC,SAAS,CACjC,CAAC;SACH;QAED,IAAI,KAAK,CAAC,IAAI,EAAE;YACd,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,oBAAY,CAAC,kCAA0B,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;SAC5F;QAED,IAAI,KAAK,CAAC,SAAS,EAAE;YACnB,KAAK,CAAC,SAAS,CAAC,SAAS,GAAG,oBAAY,CAAC,kCAA0B,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;SAC3G;QAED,8CAA0B,CAAC,KAAK,CAAC,CAAC;QAClC,mCAA2B,CAAC,KAAK,CAAC,CAAC;IACrC,CAAC,CAAC;IAxBW,QAAA,kCAAkC,sCAwB7C","sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSlots } from '../index';\nimport type { MenuItemCheckboxState } from './MenuItemCheckbox.types';\n\nexport const menuItemCheckboxClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n  root: 'fui-MenuItemCheckbox',\n  icon: 'fui-MenuItemCheckbox__icon',\n  checkmark: 'fui-MenuItemCheckbox__checkmark',\n  content: 'fui-MenuItemCheckbox__content',\n  secondaryContent: 'fui-MenuItemCheckbox__secondaryContent',\n};\n\nexport const useMenuItemCheckboxStyles_unstable = (state: MenuItemCheckboxState) => {\n  state.root.className = mergeClasses(menuItemCheckboxClassNames.root, state.root.className);\n\n  if (state.content) {\n    state.content.className = mergeClasses(menuItemCheckboxClassNames.content, state.content.className);\n  }\n\n  if (state.secondaryContent) {\n    state.secondaryContent.className = mergeClasses(\n      menuItemCheckboxClassNames.secondaryContent,\n      state.secondaryContent.className,\n    );\n  }\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(menuItemCheckboxClassNames.icon, state.icon.className);\n  }\n\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(menuItemCheckboxClassNames.checkmark, state.checkmark.className);\n  }\n\n  useMenuItemStyles_unstable(state);\n  useCheckmarkStyles_unstable(state);\n};\n"]}

package/lib-amd/components/MenuItemRadio/MenuItemRadio.js

@@ -0,0 +1,15 @@
+define(["require", "exports", "react", "./useMenuItemRadio", "./renderMenuItemRadio", "./useMenuItemRadioStyles"], function (require, exports, React, useMenuItemRadio_1, renderMenuItemRadio_1, useMenuItemRadioStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.MenuItemRadio = void 0;
+    /**
+     * Define a styled MenuItemRadio, using the `useMenuItemRadio_unstable` hook.
+     */
+    exports.MenuItemRadio = React.forwardRef(function (props, ref) {
+        var state = useMenuItemRadio_1.useMenuItemRadio_unstable(props, ref);
+        useMenuItemRadioStyles_1.useMenuItemRadioStyles_unstable(state);
+        return renderMenuItemRadio_1.renderMenuItemRadio_unstable(state);
+    });
+    exports.MenuItemRadio.displayName = 'MenuItemRadio';
+});
+//# sourceMappingURL=MenuItemRadio.js.map

package/lib-amd/components/MenuItemRadio/MenuItemRadio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemRadio.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemRadio/MenuItemRadio.tsx"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACpD,wDAA+B,CAAC,KAAK,CAAC,CAAC;QAEvC,OAAO,kDAA4B,CAAC,KAAK,CAAC,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport { useMenuItemRadio_unstable } from './useMenuItemRadio';\nimport { renderMenuItemRadio_unstable } from './renderMenuItemRadio';\nimport { useMenuItemRadioStyles_unstable } from './useMenuItemRadioStyles';\nimport type { MenuItemRadioProps } from './MenuItemRadio.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled MenuItemRadio, using the `useMenuItemRadio_unstable` hook.\n */\nexport const MenuItemRadio: ForwardRefComponent<MenuItemRadioProps> = React.forwardRef((props, ref) => {\n  const state = useMenuItemRadio_unstable(props, ref);\n  useMenuItemRadioStyles_unstable(state);\n\n  return renderMenuItemRadio_unstable(state);\n});\n\nMenuItemRadio.displayName = 'MenuItemRadio';\n"]}

package/lib-amd/components/MenuItemRadio/MenuItemRadio.types.js

@@ -0,0 +1,5 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});
+//# sourceMappingURL=MenuItemRadio.types.js.map

package/lib-amd/components/MenuItemRadio/MenuItemRadio.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemRadio.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemRadio/MenuItemRadio.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { MenuItemSelectableProps, MenuItemSelectableState } from '../../selectable/index';\nimport type { MenuItemProps, MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport type MenuItemRadioProps = MenuItemProps & MenuItemSelectableProps;\n\nexport type MenuItemRadioState = MenuItemState & MenuItemSelectableState;\n"]}

package/lib-amd/components/MenuItemRadio/index.js

@@ -0,0 +1,10 @@
+define(["require", "exports", "tslib", "./MenuItemRadio.types", "./MenuItemRadio", "./renderMenuItemRadio", "./useMenuItemRadio", "./useMenuItemRadioStyles"], function (require, exports, tslib_1, MenuItemRadio_types_1, MenuItemRadio_1, renderMenuItemRadio_1, useMenuItemRadio_1, useMenuItemRadioStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(MenuItemRadio_types_1, exports);
+    tslib_1.__exportStar(MenuItemRadio_1, exports);
+    tslib_1.__exportStar(renderMenuItemRadio_1, exports);
+    tslib_1.__exportStar(useMenuItemRadio_1, exports);
+    tslib_1.__exportStar(useMenuItemRadioStyles_1, exports);
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/components/MenuItemRadio/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemRadio/index.ts"],"names":[],"mappings":";;;IAAA,qDAAsC;IACtC,+CAAgC;IAChC,qDAAsC;IACtC,kDAAmC;IACnC,wDAAyC","sourcesContent":["export * from './MenuItemRadio.types';\nexport * from './MenuItemRadio';\nexport * from './renderMenuItemRadio';\nexport * from './useMenuItemRadio';\nexport * from './useMenuItemRadioStyles';\n"]}

package/lib-amd/components/MenuItemRadio/renderMenuItemRadio.js

@@ -0,0 +1,19 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-utilities"], function (require, exports, tslib_1, React, react_utilities_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.renderMenuItemRadio_unstable = void 0;
+    /**
+     * Redefine the render function to add slots. Reuse the menuitemradio structure but add
+     * slots to children.
+     */
+    var renderMenuItemRadio_unstable = function (state) {
+        var _a = react_utilities_1.getSlots(state), slots = _a.slots, slotProps = _a.slotProps;
+        return (React.createElement(slots.root, tslib_1.__assign({}, slotProps.root),
+            slots.checkmark && React.createElement(slots.checkmark, tslib_1.__assign({}, slotProps.checkmark)),
+            slots.icon && React.createElement(slots.icon, tslib_1.__assign({}, slotProps.icon)),
+            slots.content && React.createElement(slots.content, tslib_1.__assign({}, slotProps.content)),
+            slots.secondaryContent && React.createElement(slots.secondaryContent, tslib_1.__assign({}, slotProps.secondaryContent))));
+    };
+    exports.renderMenuItemRadio_unstable = renderMenuItemRadio_unstable;
+});
+//# sourceMappingURL=renderMenuItemRadio.js.map

package/lib-amd/components/MenuItemRadio/renderMenuItemRadio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderMenuItemRadio.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemRadio/renderMenuItemRadio.tsx"],"names":[],"mappings":";;;;IAKA;;;OAGG;IACI,IAAM,4BAA4B,GAAG,UAAC,KAAyB;QAC9D,IAAA,KAAuB,0BAAQ,CAAgB,KAAK,CAAC,EAAnD,KAAK,WAAA,EAAE,SAAS,eAAmC,CAAC;QAE5D,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI;YAC3B,KAAK,CAAC,SAAS,IAAI,oBAAC,KAAK,CAAC,SAAS,uBAAK,SAAS,CAAC,SAAS,EAAI;YAC/D,KAAK,CAAC,IAAI,IAAI,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI,EAAI;YAChD,KAAK,CAAC,OAAO,IAAI,oBAAC,KAAK,CAAC,OAAO,uBAAK,SAAS,CAAC,OAAO,EAAI;YACzD,KAAK,CAAC,gBAAgB,IAAI,oBAAC,KAAK,CAAC,gBAAgB,uBAAK,SAAS,CAAC,gBAAgB,EAAI,CAC1E,CACd,CAAC;IACJ,CAAC,CAAC;IAXW,QAAA,4BAA4B,gCAWvC","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\nimport type { MenuItemSlots } from '../MenuItem/MenuItem.types';\n\n/**\n * Redefine the render function to add slots. Reuse the menuitemradio structure but add\n * slots to children.\n */\nexport const renderMenuItemRadio_unstable = (state: MenuItemRadioState) => {\n  const { slots, slotProps } = getSlots<MenuItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.checkmark && <slots.checkmark {...slotProps.checkmark} />}\n      {slots.icon && <slots.icon {...slotProps.icon} />}\n      {slots.content && <slots.content {...slotProps.content} />}\n      {slots.secondaryContent && <slots.secondaryContent {...slotProps.secondaryContent} />}\n    </slots.root>\n  );\n};\n"]}

package/lib-amd/components/MenuItemRadio/useMenuItemRadio.js

@@ -0,0 +1,27 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "@fluentui/react-icons", "../../contexts/menuListContext", "../MenuItem/useMenuItem"], function (require, exports, tslib_1, React, react_utilities_1, react_icons_1, menuListContext_1, useMenuItem_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useMenuItemRadio_unstable = void 0;
+    /**
+     * Given user props, returns state and render function for a MenuItemRadio.
+     */
+    var useMenuItemRadio_unstable = function (props, ref) {
+        var name = props.name, value = props.value;
+        var checked = menuListContext_1.useMenuListContext_unstable(function (context) {
+            var _a;
+            var checkedItems = ((_a = context.checkedValues) === null || _a === void 0 ? void 0 : _a[name]) || [];
+            return checkedItems.indexOf(value) !== -1;
+        });
+        var selectRadio = menuListContext_1.useMenuListContext_unstable(function (context) { return context.selectRadio; });
+        return tslib_1.__assign(tslib_1.__assign({}, useMenuItem_1.useMenuItem_unstable(tslib_1.__assign(tslib_1.__assign({}, props), { role: 'menuitemradio', 'aria-checked': checked, checkmark: react_utilities_1.resolveShorthand(props.checkmark, {
+                defaultProps: { children: React.createElement(react_icons_1.Checkmark16Filled, null) },
+                required: true,
+            }), onClick: function (e) {
+                var _a;
+                selectRadio === null || selectRadio === void 0 ? void 0 : selectRadio(e, name, value, checked);
+                (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
+            } }), ref)), { checked: checked, name: name, value: value });
+    };
+    exports.useMenuItemRadio_unstable = useMenuItemRadio_unstable;
+});
+//# sourceMappingURL=useMenuItemRadio.js.map

package/lib-amd/components/MenuItemRadio/useMenuItemRadio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuItemRadio.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemRadio/useMenuItemRadio.tsx"],"names":[],"mappings":";;;;IAQA;;OAEG;IACI,IAAM,yBAAyB,GAAG,UACvC,KAAyB,EACzB,GAAwC;QAEhC,IAAA,IAAI,GAAY,KAAK,KAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;QAE9B,IAAM,OAAO,GAAG,6CAA2B,CAAC,UAAA,OAAO;;YACjD,IAAM,YAAY,GAAG,CAAA,MAAA,OAAO,CAAC,aAAa,0CAAG,IAAI,CAAC,KAAI,EAAE,CAAC;YACzD,OAAO,YAAY,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;QAC5C,CAAC,CAAC,CAAC;QAEH,IAAM,WAAW,GAAG,6CAA2B,CAAC,UAAA,OAAO,IAAI,OAAA,OAAO,CAAC,WAAW,EAAnB,CAAmB,CAAC,CAAC;QAEhF,6CACK,kCAAoB,uCAEhB,KAAK,KACR,IAAI,EAAE,eAAe,EACrB,cAAc,EAAE,OAAO,EACvB,SAAS,EAAE,kCAAgB,CAAC,KAAK,CAAC,SAAS,EAAE;gBAC3C,YAAY,EAAE,EAAE,QAAQ,EAAE,oBAAC,+BAAiB,OAAG,EAAE;gBACjD,QAAQ,EAAE,IAAI;aACf,CAAC,EACF,OAAO,EAAE,UAAC,CAAyD;;gBACjE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;gBACvC,MAAA,KAAK,CAAC,OAAO,+CAAb,KAAK,EAAW,CAAC,CAAC,CAAC;YACrB,CAAC,KAEH,GAAG,CACJ,KACD,OAAO,SAAA,EACP,IAAI,MAAA,EACJ,KAAK,OAAA,IACL;IACJ,CAAC,CAAC;IAlCW,QAAA,yBAAyB,6BAkCpC","sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { Checkmark16Filled } from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuItem_unstable } from '../MenuItem/useMenuItem';\nimport type { MenuItemRadioProps, MenuItemRadioState } from './MenuItemRadio.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\n/**\n * Given user props, returns state and render function for a MenuItemRadio.\n */\nexport const useMenuItemRadio_unstable = (\n  props: MenuItemRadioProps,\n  ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemRadioState => {\n  const { name, value } = props;\n\n  const checked = useMenuListContext_unstable(context => {\n    const checkedItems = context.checkedValues?.[name] || [];\n    return checkedItems.indexOf(value) !== -1;\n  });\n\n  const selectRadio = useMenuListContext_unstable(context => context.selectRadio);\n\n  return {\n    ...useMenuItem_unstable(\n      {\n        ...props,\n        role: 'menuitemradio',\n        'aria-checked': checked,\n        checkmark: resolveShorthand(props.checkmark, {\n          defaultProps: { children: <Checkmark16Filled /> },\n          required: true,\n        }),\n        onClick: (e: React.MouseEvent<ARIAButtonElementIntersection<'div'>>) => {\n          selectRadio?.(e, name, value, checked);\n          props.onClick?.(e);\n        },\n      },\n      ref,\n    ),\n    checked,\n    name,\n    value,\n  };\n};\n"]}

package/lib-amd/components/MenuItemRadio/useMenuItemRadioStyles.js

@@ -0,0 +1,31 @@
+define(["require", "exports", "@griffel/react", "../../selectable/index", "../MenuItem/useMenuItemStyles"], function (require, exports, react_1, index_1, useMenuItemStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useMenuItemRadioStyles_unstable = exports.menuItemRadioClassNames = void 0;
+    exports.menuItemRadioClassNames = {
+        root: 'fui-MenuItemRadio',
+        icon: 'fui-MenuItemRadio__icon',
+        checkmark: 'fui-MenuItemRadio__checkmark',
+        content: 'fui-MenuItemRadio__content',
+        secondaryContent: 'fui-MenuItemRadio__secondaryContent',
+    };
+    var useMenuItemRadioStyles_unstable = function (state) {
+        state.root.className = react_1.mergeClasses(exports.menuItemRadioClassNames.root, state.root.className);
+        if (state.content) {
+            state.content.className = react_1.mergeClasses(exports.menuItemRadioClassNames.content, state.content.className);
+        }
+        if (state.secondaryContent) {
+            state.secondaryContent.className = react_1.mergeClasses(exports.menuItemRadioClassNames.secondaryContent, state.secondaryContent.className);
+        }
+        if (state.icon) {
+            state.icon.className = react_1.mergeClasses(exports.menuItemRadioClassNames.icon, state.icon.className);
+        }
+        if (state.checkmark) {
+            state.checkmark.className = react_1.mergeClasses(exports.menuItemRadioClassNames.checkmark, state.checkmark.className);
+        }
+        useMenuItemStyles_1.useMenuItemStyles_unstable(state);
+        index_1.useCheckmarkStyles_unstable(state);
+    };
+    exports.useMenuItemRadioStyles_unstable = useMenuItemRadioStyles_unstable;
+});
+//# sourceMappingURL=useMenuItemRadioStyles.js.map

package/lib-amd/components/MenuItemRadio/useMenuItemRadioStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuItemRadioStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuItemRadio/useMenuItemRadioStyles.ts"],"names":[],"mappings":";;;;IAOa,QAAA,uBAAuB,GAA4D;QAC9F,IAAI,EAAE,mBAAmB;QACzB,IAAI,EAAE,yBAAyB;QAC/B,SAAS,EAAE,8BAA8B;QACzC,OAAO,EAAE,4BAA4B;QACrC,gBAAgB,EAAE,qCAAqC;KACxD,CAAC;IAEK,IAAM,+BAA+B,GAAG,UAAC,KAAyB;QACvE,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,oBAAY,CAAC,+BAAuB,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAExF,IAAI,KAAK,CAAC,OAAO,EAAE;YACjB,KAAK,CAAC,OAAO,CAAC,SAAS,GAAG,oBAAY,CAAC,+BAAuB,CAAC,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;SAClG;QAED,IAAI,KAAK,CAAC,gBAAgB,EAAE;YAC1B,KAAK,CAAC,gBAAgB,CAAC,SAAS,GAAG,oBAAY,CAC7C,+BAAuB,CAAC,gBAAgB,EACxC,KAAK,CAAC,gBAAgB,CAAC,SAAS,CACjC,CAAC;SACH;QAED,IAAI,KAAK,CAAC,IAAI,EAAE;YACd,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,oBAAY,CAAC,+BAAuB,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;SACzF;QAED,IAAI,KAAK,CAAC,SAAS,EAAE;YACnB,KAAK,CAAC,SAAS,CAAC,SAAS,GAAG,oBAAY,CAAC,+BAAuB,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;SACxG;QAED,8CAA0B,CAAC,KAAK,CAAC,CAAC;QAClC,mCAA2B,CAAC,KAAK,CAAC,CAAC;IACrC,CAAC,CAAC;IAxBW,QAAA,+BAA+B,mCAwB1C","sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSlots } from '../index';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\n\nexport const menuItemRadioClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n  root: 'fui-MenuItemRadio',\n  icon: 'fui-MenuItemRadio__icon',\n  checkmark: 'fui-MenuItemRadio__checkmark',\n  content: 'fui-MenuItemRadio__content',\n  secondaryContent: 'fui-MenuItemRadio__secondaryContent',\n};\n\nexport const useMenuItemRadioStyles_unstable = (state: MenuItemRadioState) => {\n  state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);\n\n  if (state.content) {\n    state.content.className = mergeClasses(menuItemRadioClassNames.content, state.content.className);\n  }\n\n  if (state.secondaryContent) {\n    state.secondaryContent.className = mergeClasses(\n      menuItemRadioClassNames.secondaryContent,\n      state.secondaryContent.className,\n    );\n  }\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(menuItemRadioClassNames.icon, state.icon.className);\n  }\n\n  if (state.checkmark) {\n    state.checkmark.className = mergeClasses(menuItemRadioClassNames.checkmark, state.checkmark.className);\n  }\n\n  useMenuItemStyles_unstable(state);\n  useCheckmarkStyles_unstable(state);\n};\n"]}

package/lib-amd/components/MenuList/MenuList.js

@@ -0,0 +1,16 @@
+define(["require", "exports", "react", "./useMenuList", "./renderMenuList", "./useMenuListContextValues", "./useMenuListStyles"], function (require, exports, React, useMenuList_1, renderMenuList_1, useMenuListContextValues_1, useMenuListStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.MenuList = void 0;
+    /**
+     * Define a styled MenuList, using the `useMenuList_unstable` hook.
+     */
+    exports.MenuList = React.forwardRef(function (props, ref) {
+        var state = useMenuList_1.useMenuList_unstable(props, ref);
+        var contextValues = useMenuListContextValues_1.useMenuListContextValues_unstable(state);
+        useMenuListStyles_1.useMenuListStyles_unstable(state);
+        return renderMenuList_1.renderMenuList_unstable(state, contextValues);
+    });
+    exports.MenuList.displayName = 'MenuList';
+});
+//# sourceMappingURL=MenuList.js.map

package/lib-amd/components/MenuList/MenuList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuList.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuList/MenuList.tsx"],"names":[],"mappings":";;;;IAQA;;OAEG;IACU,QAAA,QAAQ,GAAuC,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACtF,IAAM,KAAK,GAAG,kCAAoB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAC/C,IAAM,aAAa,GAAG,4DAAiC,CAAC,KAAK,CAAC,CAAC;QAC/D,8CAA0B,CAAC,KAAK,CAAC,CAAC;QAElC,OAAO,wCAAuB,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IACvD,CAAC,CAAC,CAAC;IAEH,gBAAQ,CAAC,WAAW,GAAG,UAAU,CAAC","sourcesContent":["import * as React from 'react';\nimport { useMenuList_unstable } from './useMenuList';\nimport { renderMenuList_unstable } from './renderMenuList';\nimport { useMenuListContextValues_unstable } from './useMenuListContextValues';\nimport { useMenuListStyles_unstable } from './useMenuListStyles';\nimport type { MenuListProps } from './MenuList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled MenuList, using the `useMenuList_unstable` hook.\n */\nexport const MenuList: ForwardRefComponent<MenuListProps> = React.forwardRef((props, ref) => {\n  const state = useMenuList_unstable(props, ref);\n  const contextValues = useMenuListContextValues_unstable(state);\n  useMenuListStyles_unstable(state);\n\n  return renderMenuList_unstable(state, contextValues);\n});\n\nMenuList.displayName = 'MenuList';\n"]}

package/lib-amd/components/MenuList/MenuList.types.js

@@ -0,0 +1,5 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});
+//# sourceMappingURL=MenuList.types.js.map

package/lib-amd/components/MenuList/MenuList.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuList.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuList/MenuList.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { MenuListContextValue } from '../../contexts/menuListContext';\nimport type { SelectableHandler } from '../../selectable/index';\n\nexport type MenuCheckedValueChangeEvent = React.MouseEvent | React.KeyboardEvent;\n\nexport type MenuCheckedValueChangeData = {\n  /** The items for this value that are checked */\n  checkedItems: string[];\n  /** The name of the value */\n  name: string;\n};\n\nexport type MenuListSlots = {\n  root: Slot<'div'>;\n};\n\nexport type MenuListProps = ComponentProps<MenuListSlots> & {\n  /**\n   * Map of all checked values\n   */\n  checkedValues?: Record<string, string[]>;\n\n  /**\n   * Default values to be checked on mount\n   */\n  defaultCheckedValues?: Record<string, string[]>;\n\n  /**\n   * States that menu items can contain selectable items and reserve slots for item alignment\n   */\n  hasCheckmarks?: boolean;\n\n  /**\n   * States that menu items can contain icons and reserve slots for item alignment\n   */\n  hasIcons?: boolean;\n\n  /**\n   * Callback when checked items change for value with a name\n   *\n   * @param event - React's original SyntheticEvent\n   * @param data - A data object with relevant information\n   */\n  onCheckedValueChange?: (e: MenuCheckedValueChangeEvent, data: MenuCheckedValueChangeData) => void;\n};\n\nexport type MenuListState = ComponentState<MenuListSlots> &\n  Pick<MenuListProps, 'defaultCheckedValues' | 'onCheckedValueChange'> &\n  Required<Pick<MenuListProps, 'checkedValues' | 'hasCheckmarks' | 'hasIcons'>> & {\n    /**\n     * Selects a radio item, will de-select the currently selected ratio item\n     */\n    selectRadio: SelectableHandler;\n\n    /**\n     * Callback to set focus on the next menu item by first character\n     */\n    setFocusByFirstCharacter: NonNullable<MenuListContextValue['setFocusByFirstCharacter']>;\n\n    /*\n     * Toggles the state of a checkbox item\n     */\n    toggleCheckbox: SelectableHandler;\n  };\n\nexport type MenuListContextValues = {\n  menuList: MenuListContextValue;\n};\n\nexport type UninitializedMenuListState = Omit<\n  MenuListState,\n  'checkedValues' | 'selectRadio' | 'setFocusByFirstCharacter' | 'toggleCheckbox'\n> &\n  Partial<Pick<MenuListState, 'checkedValues'>>;\n"]}

package/lib-amd/components/MenuList/index.js

@@ -0,0 +1,11 @@
+define(["require", "exports", "tslib", "./MenuList", "./MenuList.types", "./renderMenuList", "./useMenuList", "./useMenuListStyles", "./useMenuListContextValues"], function (require, exports, tslib_1, MenuList_1, MenuList_types_1, renderMenuList_1, useMenuList_1, useMenuListStyles_1, useMenuListContextValues_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(MenuList_1, exports);
+    tslib_1.__exportStar(MenuList_types_1, exports);
+    tslib_1.__exportStar(renderMenuList_1, exports);
+    tslib_1.__exportStar(useMenuList_1, exports);
+    tslib_1.__exportStar(useMenuListStyles_1, exports);
+    tslib_1.__exportStar(useMenuListContextValues_1, exports);
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/components/MenuList/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuList/index.ts"],"names":[],"mappings":";;;IAAA,0CAA2B;IAC3B,gDAAiC;IACjC,gDAAiC;IACjC,6CAA8B;IAC9B,mDAAoC;IACpC,0DAA2C","sourcesContent":["export * from './MenuList';\nexport * from './MenuList.types';\nexport * from './renderMenuList';\nexport * from './useMenuList';\nexport * from './useMenuListStyles';\nexport * from './useMenuListContextValues';\n"]}