@fluentui/react-menu 9.6.12 → 9.7.0
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +86 -1
- package/CHANGELOG.md +24 -2
- package/dist/index.d.ts +5 -4
- package/lib/components/Menu/Menu.js.map +1 -1
- package/lib/components/Menu/Menu.types.js.map +1 -1
- package/lib/components/Menu/renderMenu.js.map +1 -1
- package/lib/components/Menu/useMenu.js +7 -1
- package/lib/components/Menu/useMenu.js.map +1 -1
- package/lib/components/Menu/useMenuContextValues.js +2 -0
- package/lib/components/Menu/useMenuContextValues.js.map +1 -1
- package/lib/components/MenuDivider/MenuDivider.js +5 -0
- package/lib/components/MenuDivider/MenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/renderMenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/useMenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
- package/lib/components/MenuGroup/MenuGroup.js +5 -0
- package/lib/components/MenuGroup/MenuGroup.js.map +1 -1
- package/lib/components/MenuGroup/renderMenuGroup.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroup.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroupContextValues.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
- package/lib/components/MenuGroupHeader/MenuGroupHeader.js +5 -0
- package/lib/components/MenuGroupHeader/MenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
- package/lib/components/MenuItem/MenuItem.js +5 -0
- package/lib/components/MenuItem/MenuItem.js.map +1 -1
- package/lib/components/MenuItem/renderMenuItem.js.map +1 -1
- package/lib/components/MenuItem/useCharacterSearch.js.map +1 -1
- package/lib/components/MenuItem/useMenuItem.js.map +1 -1
- package/lib/components/MenuItem/useMenuItemStyles.js +4 -1
- package/lib/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib/components/MenuItemCheckbox/MenuItemCheckbox.js +5 -0
- package/lib/components/MenuItemCheckbox/MenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
- package/lib/components/MenuItemRadio/MenuItemRadio.js +5 -0
- package/lib/components/MenuItemRadio/MenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/renderMenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib/components/MenuList/MenuList.js +5 -0
- package/lib/components/MenuList/MenuList.js.map +1 -1
- package/lib/components/MenuList/renderMenuList.js.map +1 -1
- package/lib/components/MenuList/useMenuList.js.map +1 -1
- package/lib/components/MenuList/useMenuListContextValues.js.map +1 -1
- package/lib/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib/components/MenuPopover/MenuPopover.js +5 -0
- package/lib/components/MenuPopover/MenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/MenuPopover.types.js.map +1 -1
- package/lib/components/MenuPopover/renderMenuPopover.js +3 -1
- package/lib/components/MenuPopover/renderMenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopover.js +2 -0
- package/lib/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
- package/lib/components/MenuSplitGroup/MenuSplitGroup.js +5 -0
- package/lib/components/MenuSplitGroup/MenuSplitGroup.js.map +1 -1
- package/lib/components/MenuSplitGroup/renderMenuSplitGroup.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroup.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
- package/lib/components/MenuTrigger/MenuTrigger.js.map +1 -1
- package/lib/components/MenuTrigger/renderMenuTrigger.js.map +1 -1
- package/lib/components/MenuTrigger/useMenuTrigger.js.map +1 -1
- package/lib/contexts/menuContext.js +1 -0
- package/lib/contexts/menuContext.js.map +1 -1
- package/lib/contexts/menuGroupContext.js.map +1 -1
- package/lib/contexts/menuListContext.js.map +1 -1
- package/lib/contexts/menuTriggerContext.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/selectable/useCheckmarkStyles.js.map +1 -1
- package/lib/utils/useIsSubmenu.js.map +1 -1
- package/lib/utils/useOnMenuEnter.js.map +1 -1
- package/lib-amd/components/Menu/Menu.types.js.map +1 -1
- package/lib-amd/components/Menu/useMenu.js +19 -8
- package/lib-amd/components/Menu/useMenu.js.map +1 -1
- package/lib-amd/components/Menu/useMenuContextValues.js +2 -1
- package/lib-amd/components/Menu/useMenuContextValues.js.map +1 -1
- package/lib-amd/components/MenuDivider/MenuDivider.js +3 -1
- package/lib-amd/components/MenuDivider/MenuDivider.js.map +1 -1
- package/lib-amd/components/MenuGroup/MenuGroup.js +3 -1
- package/lib-amd/components/MenuGroup/MenuGroup.js.map +1 -1
- package/lib-amd/components/MenuGroupHeader/MenuGroupHeader.js +3 -1
- package/lib-amd/components/MenuGroupHeader/MenuGroupHeader.js.map +1 -1
- package/lib-amd/components/MenuItem/MenuItem.js +3 -1
- package/lib-amd/components/MenuItem/MenuItem.js.map +1 -1
- package/lib-amd/components/MenuItem/useMenuItemStyles.js +14 -4
- package/lib-amd/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib-amd/components/MenuItemCheckbox/MenuItemCheckbox.js +3 -1
- package/lib-amd/components/MenuItemCheckbox/MenuItemCheckbox.js.map +1 -1
- package/lib-amd/components/MenuItemRadio/MenuItemRadio.js +3 -1
- package/lib-amd/components/MenuItemRadio/MenuItemRadio.js.map +1 -1
- package/lib-amd/components/MenuList/MenuList.js +3 -1
- package/lib-amd/components/MenuList/MenuList.js.map +1 -1
- package/lib-amd/components/MenuPopover/MenuPopover.js +3 -1
- package/lib-amd/components/MenuPopover/MenuPopover.js.map +1 -1
- package/lib-amd/components/MenuPopover/MenuPopover.types.js.map +1 -1
- package/lib-amd/components/MenuPopover/renderMenuPopover.js +1 -1
- package/lib-amd/components/MenuPopover/renderMenuPopover.js.map +1 -1
- package/lib-amd/components/MenuPopover/useMenuPopover.js +2 -0
- package/lib-amd/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib-amd/components/MenuSplitGroup/MenuSplitGroup.js +3 -1
- package/lib-amd/components/MenuSplitGroup/MenuSplitGroup.js.map +1 -1
- package/lib-amd/contexts/menuContext.js +1 -0
- package/lib-amd/contexts/menuContext.js.map +1 -1
- package/lib-commonjs/Menu.js.map +1 -1
- package/lib-commonjs/MenuDivider.js.map +1 -1
- package/lib-commonjs/MenuGroup.js.map +1 -1
- package/lib-commonjs/MenuGroupHeader.js.map +1 -1
- package/lib-commonjs/MenuItem.js.map +1 -1
- package/lib-commonjs/MenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/MenuItemRadio.js.map +1 -1
- package/lib-commonjs/MenuList.js.map +1 -1
- package/lib-commonjs/MenuPopover.js.map +1 -1
- package/lib-commonjs/MenuSplitGroup.js.map +1 -1
- package/lib-commonjs/MenuTrigger.js.map +1 -1
- package/lib-commonjs/components/Menu/Menu.js.map +1 -1
- package/lib-commonjs/components/Menu/Menu.types.js.map +1 -1
- package/lib-commonjs/components/Menu/index.js.map +1 -1
- package/lib-commonjs/components/Menu/renderMenu.js.map +1 -1
- package/lib-commonjs/components/Menu/useMenu.js +7 -1
- package/lib-commonjs/components/Menu/useMenu.js.map +1 -1
- package/lib-commonjs/components/Menu/useMenuContextValues.js +2 -0
- package/lib-commonjs/components/Menu/useMenuContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/MenuDivider.js +5 -0
- package/lib-commonjs/components/MenuDivider/MenuDivider.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/MenuDivider.types.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/index.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/renderMenuDivider.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDivider.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/MenuGroup.js +5 -0
- package/lib-commonjs/components/MenuGroup/MenuGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/MenuGroup.types.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/index.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/renderMenuGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.js +5 -0
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.types.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/index.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/renderMenuGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItem/MenuItem.js +5 -0
- package/lib-commonjs/components/MenuItem/MenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/MenuItem.types.js.map +1 -1
- package/lib-commonjs/components/MenuItem/index.js.map +1 -1
- package/lib-commonjs/components/MenuItem/renderMenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useCharacterSearch.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js +4 -1
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.js +5 -0
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.types.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/index.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.js +5 -0
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.types.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/index.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/renderMenuItemRadio.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadio.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib-commonjs/components/MenuList/MenuList.js +5 -0
- package/lib-commonjs/components/MenuList/MenuList.js.map +1 -1
- package/lib-commonjs/components/MenuList/MenuList.types.js.map +1 -1
- package/lib-commonjs/components/MenuList/index.js.map +1 -1
- package/lib-commonjs/components/MenuList/renderMenuList.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuList.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/MenuPopover.js +5 -0
- package/lib-commonjs/components/MenuPopover/MenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/MenuPopover.types.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/index.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/renderMenuPopover.js +3 -1
- package/lib-commonjs/components/MenuPopover/renderMenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopover.js +2 -0
- package/lib-commonjs/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.js +5 -0
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/index.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.types.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/index.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/renderMenuTrigger.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.js.map +1 -1
- package/lib-commonjs/components/index.js.map +1 -1
- package/lib-commonjs/contexts/menuContext.js +1 -0
- package/lib-commonjs/contexts/menuContext.js.map +1 -1
- package/lib-commonjs/contexts/menuGroupContext.js.map +1 -1
- package/lib-commonjs/contexts/menuListContext.js.map +1 -1
- package/lib-commonjs/contexts/menuTriggerContext.js.map +1 -1
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/selectable/index.js.map +1 -1
- package/lib-commonjs/selectable/types.js.map +1 -1
- package/lib-commonjs/selectable/useCheckmarkStyles.js.map +1 -1
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/useIsSubmenu.js.map +1 -1
- package/lib-commonjs/utils/useOnMenuEnter.js.map +1 -1
- package/package.json +8 -8
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["menuListContext_1","require","useCharacterSearch","state","ref","setFocusByFirstCharacter","useMenuListContext_unstable","context","onKeyDown","originalOnKeyDown","root","e","_a","key","length","current","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItem/useCharacterSearch.ts"],"sourcesContent":["import * as React from 'react';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport type { MenuItemState } from '../../components/index';\nimport type { ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\nexport const useCharacterSearch = (state: MenuItemState, ref: React.RefObject<HTMLElement>) => {\n const setFocusByFirstCharacter = useMenuListContext_unstable(context => context.setFocusByFirstCharacter);\n\n const { onKeyDown: originalOnKeyDown } = state.root;\n\n state.root.onKeyDown = (e: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n originalOnKeyDown?.(e);\n\n if (e.key?.length > 1) {\n return;\n }\n\n if (ref.current) {\n setFocusByFirstCharacter?.(e, ref.current);\n }\n };\n\n return state;\n};\n"],"mappings":";;;;;;AACA,MAAAA,iBAAA,gBAAAC,OAAA;AAIO,MAAMC,kBAAkB,GAAGA,CAACC,KAAoB,EAAEC,GAAiC,KAAI;EAC5F,MAAMC,wBAAwB,GAAGL,iBAAA,CAAAM,2BAA2B,CAACC,OAAO,IAAIA,OAAO,CAACF,wBAAwB,CAAC;EAEzG,MAAM;IAAEG,SAAS,EAAEC;EAAiB,CAAE,GAAGN,KAAK,CAACO,IAAI;EAEnDP,KAAK,CAACO,IAAI,CAACF,SAAS,GAAIG,CAAqD,IAAI;;IAC/EF,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAAGE,CAAC,CAAC;IAEtB,IAAI,EAAAC,EAAA,GAAAD,CAAC,CAACE,GAAG,cAAAD,EAAA,uBAAAA,EAAA,CAAEE,MAAM,IAAG,CAAC,EAAE;MACrB;;IAGF,IAAIV,GAAG,CAACW,OAAO,EAAE;MACfV,wBAAwB,aAAxBA,wBAAwB,uBAAxBA,wBAAwB,CAAGM,CAAC,EAAEP,GAAG,CAACW,OAAO,CAAC;;EAE9C,CAAC;EAED,OAAOZ,KAAK;AACd,CAAC;AAlBYa,OAAA,CAAAd,kBAAkB,GAAAA,kBAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","react_utilities_1","react_shared_contexts_1","useCharacterSearch_1","menuTriggerContext_1","react_icons_1","menuListContext_1","menuContext_1","react_aria_1","keyboard_keys_1","ChevronRightIcon","bundleIcon","ChevronRightFilled","ChevronRightRegular","ChevronLeftIcon","ChevronLeftFilled","ChevronLeftRegular","useMenuItem_unstable","props","ref","isSubmenuTrigger","useMenuTriggerContext_unstable","persistOnClickContext","useMenuContext_unstable","context","persistOnItemClick","as","disabled","hasSubmenu","persistOnClick","hasIcons","useMenuListContext_unstable","hasCheckmarks","setOpen","dir","useFluent_unstable","innerRef","useRef","dismissedWithKeyboardRef","state","components","root","icon","checkmark","submenuIndicator","content","secondaryContent","getNativeElementProps","useARIAButtonProps","role","disabledFocusable","useMergedRefs","onKeyDown","useEventCallback","event","_a","call","isDefaultPrevented","key","Space","Enter","current","onMouseEnter","focus","_b","onClick","open","keyboard","bubble","type","resolveShorthand","required","defaultProps","children","createElement","useCharacterSearch","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItem/useMenuItem.tsx"],"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 { ARIAButtonElement, ARIAButtonElementIntersection, useARIAButtonProps } 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 { as = 'div', disabled = false, hasSubmenu = isSubmenuTrigger, persistOnClick = persistOnClickContext } = 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 state: MenuItemState = {\n hasSubmenu,\n disabled,\n persistOnClick,\n components: {\n root: 'div',\n icon: 'span',\n checkmark: 'span',\n submenuIndicator: 'span',\n content: 'span',\n secondaryContent: 'span',\n },\n root: getNativeElementProps(\n as,\n useARIAButtonProps(as, {\n role: 'menuitem',\n ...props,\n disabled: false,\n disabledFocusable: disabled,\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 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"],"mappings":"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"}
|
@@ -108,13 +108,16 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
108
108
|
disabled: {
|
109
109
|
sj55zd: "f1s2aq7o",
|
110
110
|
Bi91k9c: "fvgxktp",
|
111
|
+
Bk3fhr4: "f19vpps7",
|
112
|
+
Bmfj8id: "fv5swzo",
|
113
|
+
Bg7n49j: "f1q1x1ba",
|
111
114
|
t0hwav: "ft33916"
|
112
115
|
}
|
113
116
|
}, {
|
114
117
|
f: [".ftqa4ok:focus{outline-style:none;}", ".fc1cou1:focus{color:var(--colorNeutralForeground3Hover);}", ".ft33916:focus{color:var(--colorNeutralForegroundDisabled);}"],
|
115
118
|
i: [".f2hkw1w:focus-visible{outline-style:none;}"],
|
116
119
|
d: [".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".fdiulkx[data-fui-focus-visible]::after{top:-2px;}", ".f1yalx80[data-fui-focus-visible]::after{bottom:-2px;}", ".fq22d5a[data-fui-focus-visible]::after{left:-2px;}", ".f1jw7pan[data-fui-focus-visible]::after{right:-2px;}", ".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);}", ".f10pi13n{position:relative;}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f81rol6{padding-right:10px;}", ".frdkuqy{padding-left:10px;}", ".f1d2rq10{height:32px;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1k6fduh{cursor:pointer;}", ".f1q8lukm{-webkit-column-gap:4px;column-gap:4px;}", ".f1ma2n7n{row-gap:4px;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f161knb0{padding-left:2px;}", ".f12huiiw{padding-right:2px;}", ".f3rmtva{background-color:transparent;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f64fuq3{width:20px;}", ".fjamq6b{height:20px;}", ".fe5j1ua{font-size:20px;}", ".fez10in{line-height:0;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}"],
|
117
|
-
h: [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".ft1hn21:hover .fui-Icon-filled{display:inline;}", ".fuxngvv:hover .fui-Icon-regular{display:none;}", ".fp258yr:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".f1jp5ecu:hover{color:var(--colorNeutralForeground3Hover);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}"]
|
120
|
+
h: [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".ft1hn21:hover .fui-Icon-filled{display:inline;}", ".fuxngvv:hover .fui-Icon-regular{display:none;}", ".fp258yr:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".f1jp5ecu:hover{color:var(--colorNeutralForeground3Hover);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}", ".f19vpps7:hover .fui-Icon-filled{display:none;}", ".fv5swzo:hover .fui-Icon-regular{display:inline;}", ".f1q1x1ba:hover .fui-MenuItem__icon{color:var(--colorNeutralForegroundDisabled);}"]
|
118
121
|
});
|
119
122
|
/** Applies style classnames to slots */
|
120
123
|
const useMenuItemStyles_unstable = state => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["react_1","require","react_icons_1","react_tabster_1","react_theme_1","index_1","exports","menuItemClassNames","root","icon","checkmark","submenuIndicator","content","secondaryContent","useStyles","__styles","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bjwuhne","Ghsupd","Bule8hv","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","qhf8xq","sj55zd","De3pzq","z189sj","uwmqm3","Bqenvij","mc9l5x","Bt984gj","Be2twd7","Bceei9c","i8kkvl","Belr9w4","Jwef8y","Bi91k9c","Bk3fhr4","Bmfj8id","Bg7n49j","famaaq","Bh6795r","t0hwav","a9b677","Bg96gwp","Brf1p80","disabled","f","i","d","h","useMenuItemStyles_unstable","state","styles","className","mergeClasses","useCheckmarkStyles_unstable"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItem/useMenuItemStyles.ts"],"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 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 [`& .${iconFilledClassName}`]: {\n display: 'none',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'inline',\n },\n [`& .${menuItemClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\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 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"],"mappings":"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"}
|
@@ -8,12 +8,17 @@ const React = /*#__PURE__*/require("react");
|
|
8
8
|
const useMenuItemCheckbox_1 = /*#__PURE__*/require("./useMenuItemCheckbox");
|
9
9
|
const renderMenuItemCheckbox_1 = /*#__PURE__*/require("./renderMenuItemCheckbox");
|
10
10
|
const useMenuItemCheckboxStyles_1 = /*#__PURE__*/require("./useMenuItemCheckboxStyles");
|
11
|
+
const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
|
11
12
|
/**
|
12
13
|
* Define a styled MenuItemCheckbox, using the `useMenuItemCheckbox_unstable` hook.
|
13
14
|
*/
|
14
15
|
exports.MenuItemCheckbox = /*#__PURE__*/React.forwardRef((props, ref) => {
|
15
16
|
const state = useMenuItemCheckbox_1.useMenuItemCheckbox_unstable(props, ref);
|
16
17
|
useMenuItemCheckboxStyles_1.useMenuItemCheckboxStyles_unstable(state);
|
18
|
+
const {
|
19
|
+
useMenuItemCheckboxStyles_unstable: useCustomStyles
|
20
|
+
} = react_shared_contexts_1.useCustomStyleHooks_unstable();
|
21
|
+
useCustomStyles(state);
|
17
22
|
return renderMenuItemCheckbox_1.renderMenuItemCheckbox_unstable(state);
|
18
23
|
});
|
19
24
|
exports.MenuItemCheckbox.displayName = 'MenuItemCheckbox';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","useMenuItemCheckbox_1","renderMenuItemCheckbox_1","useMenuItemCheckboxStyles_1","react_shared_contexts_1","exports","MenuItemCheckbox","forwardRef","props","ref","state","useMenuItemCheckbox_unstable","useMenuItemCheckboxStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderMenuItemCheckbox_unstable","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemCheckbox/MenuItemCheckbox.tsx"],"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';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\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\n useMenuItemCheckboxStyles_unstable(state);\n\n const { useMenuItemCheckboxStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderMenuItemCheckbox_unstable(state);\n});\n\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,qBAAA,gBAAAD,OAAA;AACA,MAAAE,wBAAA,gBAAAF,OAAA;AACA,MAAAG,2BAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;AAGaK,OAAA,CAAAC,gBAAgB,gBAA+CP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC1G,MAAMC,KAAK,GAAGT,qBAAA,CAAAU,4BAA4B,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEtDN,2BAAA,CAAAS,kCAAkC,CAACF,KAAK,CAAC;EAEzC,MAAM;IAAEE,kCAAkC,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EAC9FD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOR,wBAAA,CAAAa,+BAA+B,CAACL,KAAK,CAAC;AAC/C,CAAC,CAAC;AAEFL,OAAA,CAAAC,gBAAgB,CAACU,WAAW,GAAG,kBAAkB"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":[],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemCheckbox/MenuItemCheckbox.types.ts"],"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"],"mappings":""}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemCheckbox/index.ts"],"sourcesContent":["export * from './MenuItemCheckbox.types';\nexport * from './MenuItemCheckbox';\nexport * from './renderMenuItemCheckbox';\nexport * from './useMenuItemCheckbox';\nexport * from './useMenuItemCheckboxStyles';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,8BAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,wBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,8BAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,2BAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,iCAAAC,OAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","react_utilities_1","renderMenuItemCheckbox_unstable","state","slots","slotProps","getSlots","createElement","root","checkmark","icon","content","secondaryContent","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemCheckbox/renderMenuItemCheckbox.tsx"],"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"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAIA;AACO,MAAME,+BAA+B,GAAIC,KAA4B,IAAI;EAC9E,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,iBAAA,CAAAK,QAAQ,CAAgBH,KAAK,CAAC;EAE3D,OACEJ,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAC3BJ,KAAK,CAACK,SAAS,IAAIV,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACK,SAAS;IAAA,GAAKJ,SAAS,CAACI;EAAS,EAAI,EAC/DL,KAAK,CAACM,IAAI,IAAIX,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACM,IAAI;IAAA,GAAKL,SAAS,CAACK;EAAI,EAAI,EAChDN,KAAK,CAACO,OAAO,IAAIZ,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACO,OAAO;IAAA,GAAKN,SAAS,CAACM;EAAO,EAAI,EACzDP,KAAK,CAACQ,gBAAgB,IAAIb,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACQ,gBAAgB;IAAA,GAAKP,SAAS,CAACO;EAAgB,EAAI,CAC1E;AAEjB,CAAC;AAXYC,OAAA,CAAAX,+BAA+B,GAAAA,+BAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","react_utilities_1","react_icons_1","menuListContext_1","useMenuItem_1","useMenuItemCheckbox_unstable","props","ref","toggleCheckbox","useMenuListContext_unstable","context","name","value","checked","checkedItems","_a","checkedValues","indexOf","state","useMenuItem_unstable","role","persistOnClick","checkmark","resolveShorthand","defaultProps","children","createElement","Checkmark16Filled","required","onClick","e","call","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemCheckbox/useMenuItemCheckbox.tsx"],"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"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AACA,MAAAE,aAAA,gBAAAF,OAAA;AACA,MAAAG,iBAAA,gBAAAH,OAAA;AACA,MAAAI,aAAA,gBAAAJ,OAAA;AAIA;AACO,MAAMK,4BAA4B,GAAGA,CAC1CC,KAA4B,EAC5BC,GAAwC,KACf;EACzB,MAAMC,cAAc,GAAGL,iBAAA,CAAAM,2BAA2B,CAACC,OAAO,IAAIA,OAAO,CAACF,cAAc,CAAC;EACrF,MAAM;IAAEG,IAAI;IAAEC;EAAK,CAAE,GAAGN,KAAK;EAE7B,MAAMO,OAAO,GAAGV,iBAAA,CAAAM,2BAA2B,CAACC,OAAO,IAAG;;IACpD,MAAMI,YAAY,GAAG,EAAAC,EAAA,GAAAL,OAAO,CAACM,aAAa,cAAAD,EAAA,uBAAAA,EAAA,CAAGJ,IAAI,CAAC,KAAI,EAAE;IACxD,OAAOG,YAAY,CAACG,OAAO,CAACL,KAAK,CAAC,KAAK,CAAC,CAAC;EAC3C,CAAC,CAAC;EAEF,MAAMM,KAAK,GAA0B;IACnC,GAAGd,aAAA,CAAAe,oBAAoB,CACrB;MACEC,IAAI,EAAE,kBAAkB;MACxBC,cAAc,EAAE,IAAI;MACpB,GAAGf,KAAK;MACR,cAAc,EAAEO,OAAO;MACvBS,SAAS,EAAErB,iBAAA,CAAAsB,gBAAgB,CAACjB,KAAK,CAACgB,SAAS,EAAE;QAC3CE,YAAY,EAAE;UAAEC,QAAQ,EAAE1B,KAAA,CAAA2B,aAAA,CAACxB,aAAA,CAAAyB,iBAAiB;QAAG,CAAE;QACjDC,QAAQ,EAAE;OACX,CAAC;MACFC,OAAO,EAAGC,CAAyD,IAAI;;QACrEtB,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAGsB,CAAC,EAAEnB,IAAI,EAAEC,KAAK,EAAEC,OAAO,CAAC;QACzC,CAAAE,EAAA,GAAAT,KAAK,CAACuB,OAAO,cAAAd,EAAA,uBAAAA,EAAA,CAAAgB,IAAA,CAAbzB,KAAK,EAAWwB,CAAC,CAAC;MACpB;KACD,EACDvB,GAAG,CACJ;IACDI,IAAI;IACJC,KAAK;IACLC;GACD;EAED,OAAOK,KAAK;AACd,CAAC;AApCYc,OAAA,CAAA3B,4BAA4B,GAAAA,4BAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["react_1","require","index_1","useMenuItemStyles_1","exports","menuItemCheckboxClassNames","root","icon","checkmark","content","secondaryContent","useMenuItemCheckboxStyles_unstable","state","className","mergeClasses","useMenuItemStyles_unstable","useCheckmarkStyles_unstable"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemCheckbox/useMenuItemCheckboxStyles.ts"],"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"],"mappings":";;;;;;AAAA,MAAAA,OAAA,gBAAAC,OAAA;AACA,MAAAC,OAAA,gBAAAD,OAAA;AACA,MAAAE,mBAAA,gBAAAF,OAAA;AAKaG,OAAA,CAAAC,0BAA0B,GAA4D;EACjGC,IAAI,EAAE,sBAAsB;EAC5BC,IAAI,EAAE,4BAA4B;EAClCC,SAAS,EAAE,iCAAiC;EAC5CC,OAAO,EAAE,+BAA+B;EACxCC,gBAAgB,EAAE;CACnB;AAEM,MAAMC,kCAAkC,GAAIC,KAA4B,IAAI;EACjFA,KAAK,CAACN,IAAI,CAACO,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAACV,OAAA,CAAAC,0BAA0B,CAACC,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACO,SAAS,CAAC;EAE1F,IAAID,KAAK,CAACH,OAAO,EAAE;IACjBG,KAAK,CAACH,OAAO,CAACI,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAACV,OAAA,CAAAC,0BAA0B,CAACI,OAAO,EAAEG,KAAK,CAACH,OAAO,CAACI,SAAS,CAAC;;EAGrG,IAAID,KAAK,CAACF,gBAAgB,EAAE;IAC1BE,KAAK,CAACF,gBAAgB,CAACG,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAC7CV,OAAA,CAAAC,0BAA0B,CAACK,gBAAgB,EAC3CE,KAAK,CAACF,gBAAgB,CAACG,SAAS,CACjC;;EAGH,IAAID,KAAK,CAACL,IAAI,EAAE;IACdK,KAAK,CAACL,IAAI,CAACM,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAACV,OAAA,CAAAC,0BAA0B,CAACE,IAAI,EAAEK,KAAK,CAACL,IAAI,CAACM,SAAS,CAAC;;EAG5F,IAAID,KAAK,CAACJ,SAAS,EAAE;IACnBI,KAAK,CAACJ,SAAS,CAACK,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAACV,OAAA,CAAAC,0BAA0B,CAACG,SAAS,EAAEI,KAAK,CAACJ,SAAS,CAACK,SAAS,CAAC;;EAG3GV,mBAAA,CAAAY,0BAA0B,CAACH,KAAK,CAAC;EACjCV,OAAA,CAAAc,2BAA2B,CAACJ,KAAK,CAAC;AACpC,CAAC;AAxBYR,OAAA,CAAAO,kCAAkC,GAAAA,kCAAA"}
|
@@ -8,12 +8,17 @@ const React = /*#__PURE__*/require("react");
|
|
8
8
|
const useMenuItemRadio_1 = /*#__PURE__*/require("./useMenuItemRadio");
|
9
9
|
const renderMenuItemRadio_1 = /*#__PURE__*/require("./renderMenuItemRadio");
|
10
10
|
const useMenuItemRadioStyles_1 = /*#__PURE__*/require("./useMenuItemRadioStyles");
|
11
|
+
const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
|
11
12
|
/**
|
12
13
|
* Define a styled MenuItemRadio, using the `useMenuItemRadio_unstable` hook.
|
13
14
|
*/
|
14
15
|
exports.MenuItemRadio = /*#__PURE__*/React.forwardRef((props, ref) => {
|
15
16
|
const state = useMenuItemRadio_1.useMenuItemRadio_unstable(props, ref);
|
16
17
|
useMenuItemRadioStyles_1.useMenuItemRadioStyles_unstable(state);
|
18
|
+
const {
|
19
|
+
useMenuItemRadioStyles_unstable: useCustomStyles
|
20
|
+
} = react_shared_contexts_1.useCustomStyleHooks_unstable();
|
21
|
+
useCustomStyles(state);
|
17
22
|
return renderMenuItemRadio_1.renderMenuItemRadio_unstable(state);
|
18
23
|
});
|
19
24
|
exports.MenuItemRadio.displayName = 'MenuItemRadio';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","useMenuItemRadio_1","renderMenuItemRadio_1","useMenuItemRadioStyles_1","react_shared_contexts_1","exports","MenuItemRadio","forwardRef","props","ref","state","useMenuItemRadio_unstable","useMenuItemRadioStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderMenuItemRadio_unstable","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemRadio/MenuItemRadio.tsx"],"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';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\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\n useMenuItemRadioStyles_unstable(state);\n\n const { useMenuItemRadioStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderMenuItemRadio_unstable(state);\n});\n\nMenuItemRadio.displayName = 'MenuItemRadio';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,kBAAA,gBAAAD,OAAA;AACA,MAAAE,qBAAA,gBAAAF,OAAA;AACA,MAAAG,wBAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;AAGaK,OAAA,CAAAC,aAAa,gBAA4CP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACpG,MAAMC,KAAK,GAAGT,kBAAA,CAAAU,yBAAyB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEnDN,wBAAA,CAAAS,+BAA+B,CAACF,KAAK,CAAC;EAEtC,MAAM;IAAEE,+BAA+B,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EAC3FD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOR,qBAAA,CAAAa,4BAA4B,CAACL,KAAK,CAAC;AAC5C,CAAC,CAAC;AAEFL,OAAA,CAAAC,aAAa,CAACU,WAAW,GAAG,eAAe"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":[],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemRadio/MenuItemRadio.types.ts"],"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"],"mappings":""}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemRadio/index.ts"],"sourcesContent":["export * from './MenuItemRadio.types';\nexport * from './MenuItemRadio';\nexport * from './renderMenuItemRadio';\nexport * from './useMenuItemRadio';\nexport * from './useMenuItemRadioStyles';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,2BAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,qBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,2BAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,wBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,8BAAAC,OAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","react_utilities_1","renderMenuItemRadio_unstable","state","slots","slotProps","getSlots","createElement","root","checkmark","icon","content","secondaryContent","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemRadio/renderMenuItemRadio.tsx"],"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"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAIA;;;;AAIO,MAAME,4BAA4B,GAAIC,KAAyB,IAAI;EACxE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,iBAAA,CAAAK,QAAQ,CAAgBH,KAAK,CAAC;EAE3D,OACEJ,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAC3BJ,KAAK,CAACK,SAAS,IAAIV,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACK,SAAS;IAAA,GAAKJ,SAAS,CAACI;EAAS,EAAI,EAC/DL,KAAK,CAACM,IAAI,IAAIX,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACM,IAAI;IAAA,GAAKL,SAAS,CAACK;EAAI,EAAI,EAChDN,KAAK,CAACO,OAAO,IAAIZ,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACO,OAAO;IAAA,GAAKN,SAAS,CAACM;EAAO,EAAI,EACzDP,KAAK,CAACQ,gBAAgB,IAAIb,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACQ,gBAAgB;IAAA,GAAKP,SAAS,CAACO;EAAgB,EAAI,CAC1E;AAEjB,CAAC;AAXYC,OAAA,CAAAX,4BAA4B,GAAAA,4BAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","react_utilities_1","react_icons_1","menuListContext_1","useMenuItem_1","useMenuItemRadio_unstable","props","ref","name","value","checked","useMenuListContext_unstable","context","checkedItems","_a","checkedValues","indexOf","selectRadio","useMenuItem_unstable","role","checkmark","resolveShorthand","defaultProps","children","createElement","Checkmark16Filled","required","onClick","e","call","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemRadio/useMenuItemRadio.tsx"],"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"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AACA,MAAAE,aAAA,gBAAAF,OAAA;AACA,MAAAG,iBAAA,gBAAAH,OAAA;AACA,MAAAI,aAAA,gBAAAJ,OAAA;AAIA;;;AAGO,MAAMK,yBAAyB,GAAGA,CACvCC,KAAyB,EACzBC,GAAwC,KAClB;EACtB,MAAM;IAAEC,IAAI;IAAEC;EAAK,CAAE,GAAGH,KAAK;EAE7B,MAAMI,OAAO,GAAGP,iBAAA,CAAAQ,2BAA2B,CAACC,OAAO,IAAG;;IACpD,MAAMC,YAAY,GAAG,EAAAC,EAAA,GAAAF,OAAO,CAACG,aAAa,cAAAD,EAAA,uBAAAA,EAAA,CAAGN,IAAI,CAAC,KAAI,EAAE;IACxD,OAAOK,YAAY,CAACG,OAAO,CAACP,KAAK,CAAC,KAAK,CAAC,CAAC;EAC3C,CAAC,CAAC;EAEF,MAAMQ,WAAW,GAAGd,iBAAA,CAAAQ,2BAA2B,CAACC,OAAO,IAAIA,OAAO,CAACK,WAAW,CAAC;EAE/E,OAAO;IACL,GAAGb,aAAA,CAAAc,oBAAoB,CACrB;MACE,GAAGZ,KAAK;MACRa,IAAI,EAAE,eAAe;MACrB,cAAc,EAAET,OAAO;MACvBU,SAAS,EAAEnB,iBAAA,CAAAoB,gBAAgB,CAACf,KAAK,CAACc,SAAS,EAAE;QAC3CE,YAAY,EAAE;UAAEC,QAAQ,EAAExB,KAAA,CAAAyB,aAAA,CAACtB,aAAA,CAAAuB,iBAAiB;QAAG,CAAE;QACjDC,QAAQ,EAAE;OACX,CAAC;MACFC,OAAO,EAAGC,CAAyD,IAAI;;QACrEX,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAGW,CAAC,EAAEpB,IAAI,EAAEC,KAAK,EAAEC,OAAO,CAAC;QACtC,CAAAI,EAAA,GAAAR,KAAK,CAACqB,OAAO,cAAAb,EAAA,uBAAAA,EAAA,CAAAe,IAAA,CAAbvB,KAAK,EAAWsB,CAAC,CAAC;MACpB;KACD,EACDrB,GAAG,CACJ;IACDG,OAAO;IACPF,IAAI;IACJC;GACD;AACH,CAAC;AAlCYqB,OAAA,CAAAzB,yBAAyB,GAAAA,yBAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["react_1","require","index_1","useMenuItemStyles_1","exports","menuItemRadioClassNames","root","icon","checkmark","content","secondaryContent","useMenuItemRadioStyles_unstable","state","className","mergeClasses","useMenuItemStyles_unstable","useCheckmarkStyles_unstable"],"sources":["../src/packages/react-components/react-menu/src/components/MenuItemRadio/useMenuItemRadioStyles.ts"],"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"],"mappings":";;;;;;AAAA,MAAAA,OAAA,gBAAAC,OAAA;AACA,MAAAC,OAAA,gBAAAD,OAAA;AACA,MAAAE,mBAAA,gBAAAF,OAAA;AAKaG,OAAA,CAAAC,uBAAuB,GAA4D;EAC9FC,IAAI,EAAE,mBAAmB;EACzBC,IAAI,EAAE,yBAAyB;EAC/BC,SAAS,EAAE,8BAA8B;EACzCC,OAAO,EAAE,4BAA4B;EACrCC,gBAAgB,EAAE;CACnB;AAEM,MAAMC,+BAA+B,GAAIC,KAAyB,IAAI;EAC3EA,KAAK,CAACN,IAAI,CAACO,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAACV,OAAA,CAAAC,uBAAuB,CAACC,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACO,SAAS,CAAC;EAEvF,IAAID,KAAK,CAACH,OAAO,EAAE;IACjBG,KAAK,CAACH,OAAO,CAACI,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAACV,OAAA,CAAAC,uBAAuB,CAACI,OAAO,EAAEG,KAAK,CAACH,OAAO,CAACI,SAAS,CAAC;;EAGlG,IAAID,KAAK,CAACF,gBAAgB,EAAE;IAC1BE,KAAK,CAACF,gBAAgB,CAACG,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAC7CV,OAAA,CAAAC,uBAAuB,CAACK,gBAAgB,EACxCE,KAAK,CAACF,gBAAgB,CAACG,SAAS,CACjC;;EAGH,IAAID,KAAK,CAACL,IAAI,EAAE;IACdK,KAAK,CAACL,IAAI,CAACM,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAACV,OAAA,CAAAC,uBAAuB,CAACE,IAAI,EAAEK,KAAK,CAACL,IAAI,CAACM,SAAS,CAAC;;EAGzF,IAAID,KAAK,CAACJ,SAAS,EAAE;IACnBI,KAAK,CAACJ,SAAS,CAACK,SAAS,GAAGb,OAAA,CAAAc,YAAY,CAACV,OAAA,CAAAC,uBAAuB,CAACG,SAAS,EAAEI,KAAK,CAACJ,SAAS,CAACK,SAAS,CAAC;;EAGxGV,mBAAA,CAAAY,0BAA0B,CAACH,KAAK,CAAC;EACjCV,OAAA,CAAAc,2BAA2B,CAACJ,KAAK,CAAC;AACpC,CAAC;AAxBYR,OAAA,CAAAO,+BAA+B,GAAAA,+BAAA"}
|
@@ -9,6 +9,7 @@ const useMenuList_1 = /*#__PURE__*/require("./useMenuList");
|
|
9
9
|
const renderMenuList_1 = /*#__PURE__*/require("./renderMenuList");
|
10
10
|
const useMenuListContextValues_1 = /*#__PURE__*/require("./useMenuListContextValues");
|
11
11
|
const useMenuListStyles_1 = /*#__PURE__*/require("./useMenuListStyles");
|
12
|
+
const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
|
12
13
|
/**
|
13
14
|
* Define a styled MenuList, using the `useMenuList_unstable` hook.
|
14
15
|
*/
|
@@ -16,6 +17,10 @@ exports.MenuList = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
16
17
|
const state = useMenuList_1.useMenuList_unstable(props, ref);
|
17
18
|
const contextValues = useMenuListContextValues_1.useMenuListContextValues_unstable(state);
|
18
19
|
useMenuListStyles_1.useMenuListStyles_unstable(state);
|
20
|
+
const {
|
21
|
+
useMenuListStyles_unstable: useCustomStyles
|
22
|
+
} = react_shared_contexts_1.useCustomStyleHooks_unstable();
|
23
|
+
useCustomStyles(state);
|
19
24
|
return renderMenuList_1.renderMenuList_unstable(state, contextValues);
|
20
25
|
});
|
21
26
|
exports.MenuList.displayName = 'MenuList';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","useMenuList_1","renderMenuList_1","useMenuListContextValues_1","useMenuListStyles_1","react_shared_contexts_1","exports","MenuList","forwardRef","props","ref","state","useMenuList_unstable","contextValues","useMenuListContextValues_unstable","useMenuListStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderMenuList_unstable","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuList/MenuList.tsx"],"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';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\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\n useMenuListStyles_unstable(state);\n\n const { useMenuListStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderMenuList_unstable(state, contextValues);\n});\n\nMenuList.displayName = 'MenuList';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,aAAA,gBAAAD,OAAA;AACA,MAAAE,gBAAA,gBAAAF,OAAA;AACA,MAAAG,0BAAA,gBAAAH,OAAA;AACA,MAAAI,mBAAA,gBAAAJ,OAAA;AAGA,MAAAK,uBAAA,gBAAAL,OAAA;AAEA;;;AAGaM,OAAA,CAAAC,QAAQ,gBAAuCR,KAAK,CAACS,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC1F,MAAMC,KAAK,GAAGV,aAAA,CAAAW,oBAAoB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAC9C,MAAMG,aAAa,GAAGV,0BAAA,CAAAW,iCAAiC,CAACH,KAAK,CAAC;EAE9DP,mBAAA,CAAAW,0BAA0B,CAACJ,KAAK,CAAC;EAEjC,MAAM;IAAEI,0BAA0B,EAAEC;EAAe,CAAE,GAAGX,uBAAA,CAAAY,4BAA4B,EAAE;EACtFD,eAAe,CAACL,KAAK,CAAC;EAEtB,OAAOT,gBAAA,CAAAgB,uBAAuB,CAACP,KAAK,EAAEE,aAAa,CAAC;AACtD,CAAC,CAAC;AAEFP,OAAA,CAAAC,QAAQ,CAACY,WAAW,GAAG,UAAU"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":[],"sources":["../src/packages/react-components/react-menu/src/components/MenuList/MenuList.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { MenuListContextValue } from '../../contexts/menuListContext';\nimport type { SelectableHandler } from '../../selectable/index';\n\nexport type MenuCheckedValueChangeEvent = React.MouseEvent | React.KeyboardEvent;\n\nexport type MenuCheckedValueChangeData = {\n /** The items for this value that are checked */\n checkedItems: string[];\n /** The name of the value */\n name: string;\n};\n\nexport type MenuListSlots = {\n root: Slot<'div'>;\n};\n\nexport type MenuListProps = ComponentProps<MenuListSlots> & {\n /**\n * Map of all checked values\n */\n checkedValues?: Record<string, string[]>;\n\n /**\n * Default values to be checked on mount\n */\n defaultCheckedValues?: Record<string, string[]>;\n\n /**\n * States that menu items can contain selectable items and reserve slots for item alignment\n */\n hasCheckmarks?: boolean;\n\n /**\n * States that menu items can contain icons and reserve slots for item alignment\n */\n hasIcons?: boolean;\n\n /**\n * Callback when checked items change for value with a name\n *\n * @param event - React's original SyntheticEvent\n * @param data - A data object with relevant information\n */\n onCheckedValueChange?: (e: MenuCheckedValueChangeEvent, data: MenuCheckedValueChangeData) => void;\n};\n\nexport type MenuListState = ComponentState<MenuListSlots> &\n Required<Pick<MenuListProps, 'checkedValues' | 'hasCheckmarks' | 'hasIcons'>> &\n Pick<MenuListProps, 'defaultCheckedValues' | 'onCheckedValueChange'> & {\n /**\n * Selects a radio item, will de-select the currently selected ratio item\n */\n selectRadio: SelectableHandler;\n\n /**\n * Callback to set focus on the next menu item by first character\n */\n setFocusByFirstCharacter: NonNullable<MenuListContextValue['setFocusByFirstCharacter']>;\n\n /*\n * Toggles the state of a checkbox item\n */\n toggleCheckbox: SelectableHandler;\n };\n\nexport type MenuListContextValues = {\n menuList: MenuListContextValue;\n};\n\n/**\n * @deprecated this type is not being used internally anymore\n */\nexport type UninitializedMenuListState = Omit<\n MenuListState,\n 'checkedValues' | 'selectRadio' | 'setFocusByFirstCharacter' | 'toggleCheckbox'\n> &\n Partial<Pick<MenuListState, 'checkedValues'>>;\n"],"mappings":""}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuList/index.ts"],"sourcesContent":["export * from './MenuList';\nexport * from './MenuList.types';\nexport * from './renderMenuList';\nexport * from './useMenuList';\nexport * from './useMenuListStyles';\nexport * from './useMenuListContextValues';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,gBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,sBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,sBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,mBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,yBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,gCAAAC,OAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","react_utilities_1","menuListContext_1","renderMenuList_unstable","state","contextValues","slots","slotProps","getSlots","createElement","MenuListProvider","value","menuList","root","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuList/renderMenuList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { MenuListContextValues, MenuListSlots, MenuListState } from './MenuList.types';\nimport { MenuListProvider } from '../../contexts/menuListContext';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderMenuList_unstable = (state: MenuListState, contextValues: MenuListContextValues) => {\n const { slots, slotProps } = getSlots<MenuListSlots>(state);\n\n return (\n <MenuListProvider value={contextValues.menuList}>\n <slots.root {...slotProps.root} />\n </MenuListProvider>\n );\n};\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAEA,MAAAE,iBAAA,gBAAAF,OAAA;AAEA;;;AAGO,MAAMG,uBAAuB,GAAGA,CAACC,KAAoB,EAAEC,aAAoC,KAAI;EACpG,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGN,iBAAA,CAAAO,QAAQ,CAAgBJ,KAAK,CAAC;EAE3D,OACEL,KAAA,CAAAU,aAAA,CAACP,iBAAA,CAAAQ,gBAAgB;IAACC,KAAK,EAAEN,aAAa,CAACO;EAAQ,GAC7Cb,KAAA,CAAAU,aAAA,CAACH,KAAK,CAACO,IAAI;IAAA,GAAKN,SAAS,CAACM;EAAI,EAAI,CACjB;AAEvB,CAAC;AARYC,OAAA,CAAAX,uBAAuB,GAAAA,uBAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"mappings":"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","names":["useMenuList_unstable","props","ref","findAllFocusable","react_tabster_1","menuContext","useMenuContextSelectors","hasMenuContext","react_context_selector_1","menuContext_2","focusAttributes","circular","ignoreDefaultKeydown","Tab","usingPropsAndMenuContext","console","warn","innerRef","React","useRef","setFocusByFirstCharacter","useCallback","e","itemEl","acceptedRoles","current","menuItems","el","hasAttribute","indexOf","getAttribute","startIndex","length","firstChars","map","menuItem","textContent","charAt","toLowerCase","char","key","getIndexFirstChars","start","firstChar","i","index","focus","checkedValues","setCheckedValues","react_utilities_1","state","undefined","defaultState","defaultCheckedValues","initialState","handleCheckedValueChange","onCheckedValueChange","toggleCheckbox","name","value","checked","checkedItems","newCheckedItems","splice","push","s","selectRadio","components","root","role","triggerId","hasIcons","hasCheckmarks","exports","menuContext_1","context","contextValue","isUsingPropsAndContext","val"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuList/useMenuList.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n useMergedRefs,\n useEventCallback,\n useControllableState,\n getNativeElementProps,\n} from '@fluentui/react-utilities';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MenuContext } from '../../contexts/menuContext';\nimport type { MenuListProps, MenuListState } from './MenuList.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuList_unstable = (props: MenuListProps, ref: React.Ref<HTMLElement>): MenuListState => {\n const { findAllFocusable } = useFocusFinders();\n const menuContext = useMenuContextSelectors();\n const hasMenuContext = useHasParentContext(MenuContext);\n const focusAttributes = useArrowNavigationGroup({ circular: true, ignoreDefaultKeydown: { Tab: hasMenuContext } });\n\n if (usingPropsAndMenuContext(props, menuContext, hasMenuContext)) {\n // TODO throw warnings in development safely\n // eslint-disable-next-line no-console\n console.warn('You are using both MenuList and Menu props, we recommend you to use Menu props when available');\n }\n\n const innerRef = React.useRef<HTMLElement>(null);\n\n const setFocusByFirstCharacter = React.useCallback(\n (e: React.KeyboardEvent<HTMLElement>, itemEl: HTMLElement) => {\n // TODO use some kind of children registration to reduce dependency on DOM roles\n const acceptedRoles = ['menuitem', 'menuitemcheckbox', 'menuitemradio'];\n if (!innerRef.current) {\n return;\n }\n\n const menuItems = findAllFocusable(\n innerRef.current,\n (el: HTMLElement) => el.hasAttribute('role') && acceptedRoles.indexOf(el.getAttribute('role')!) !== -1,\n );\n\n let startIndex = menuItems.indexOf(itemEl) + 1;\n if (startIndex === menuItems.length) {\n startIndex = 0;\n }\n\n const firstChars = menuItems.map(menuItem => menuItem.textContent?.charAt(0).toLowerCase());\n const char = e.key.toLowerCase();\n\n const getIndexFirstChars = (start: number, firstChar: string) => {\n for (let i = start; i < firstChars.length; i++) {\n if (char === firstChars[i]) {\n return i;\n }\n }\n return -1;\n };\n\n // Check remaining slots in the menu\n let index = getIndexFirstChars(startIndex, char);\n\n // If not found in remaining slots, check from beginning\n if (index === -1) {\n index = getIndexFirstChars(0, char);\n }\n\n // If match was found...\n if (index > -1) {\n menuItems[index].focus();\n }\n },\n [findAllFocusable],\n );\n\n const [checkedValues, setCheckedValues] = useControllableState({\n state: props.checkedValues ?? (hasMenuContext ? menuContext.checkedValues : undefined),\n defaultState: props.defaultCheckedValues,\n initialState: {},\n });\n\n const handleCheckedValueChange =\n props.onCheckedValueChange ?? (hasMenuContext ? menuContext.onCheckedValueChange : undefined);\n\n const toggleCheckbox = useEventCallback(\n (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked: boolean) => {\n const checkedItems = checkedValues?.[name] || [];\n const newCheckedItems = [...checkedItems];\n if (checked) {\n newCheckedItems.splice(newCheckedItems.indexOf(value), 1);\n } else {\n newCheckedItems.push(value);\n }\n\n handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n },\n );\n\n const selectRadio = useEventCallback((e: React.MouseEvent | React.KeyboardEvent, name: string, value: string) => {\n const newCheckedItems = [value];\n setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n });\n\n return {\n components: {\n root: 'div',\n },\n root: getNativeElementProps('div', {\n ref: useMergedRefs(ref, innerRef),\n role: 'menu',\n 'aria-labelledby': menuContext.triggerId,\n ...focusAttributes,\n ...props,\n }),\n hasIcons: menuContext.hasIcons || false,\n hasCheckmarks: menuContext.hasCheckmarks || false,\n checkedValues,\n setFocusByFirstCharacter,\n selectRadio,\n toggleCheckbox,\n };\n};\n\n/**\n * Adds some sugar to fetching multiple context selector values\n */\nconst useMenuContextSelectors = () => {\n const checkedValues = useMenuContext_unstable(context => context.checkedValues);\n const onCheckedValueChange = useMenuContext_unstable(context => context.onCheckedValueChange);\n const triggerId = useMenuContext_unstable(context => context.triggerId);\n const hasIcons = useMenuContext_unstable(context => context.hasIcons);\n const hasCheckmarks = useMenuContext_unstable(context => context.hasCheckmarks);\n\n return {\n checkedValues,\n onCheckedValueChange,\n triggerId,\n hasIcons,\n hasCheckmarks,\n };\n};\n\n/**\n * Helper function to detect if props and MenuContext values are both used\n */\nconst usingPropsAndMenuContext = (\n props: MenuListProps,\n contextValue: ReturnType<typeof useMenuContextSelectors>,\n hasMenuContext: boolean,\n) => {\n let isUsingPropsAndContext = false;\n for (const val in contextValue) {\n if (props[val as keyof Omit<typeof contextValue, 'hasMenuContext' | 'onCheckedValueChange' | 'triggerId'>]) {\n isUsingPropsAndContext = true;\n }\n }\n\n return hasMenuContext && isUsingPropsAndContext;\n};\n"]}
|
1
|
+
{"version":3,"names":["React","require","react_utilities_1","react_tabster_1","react_context_selector_1","menuContext_1","menuContext_2","useMenuList_unstable","props","ref","findAllFocusable","useFocusFinders","menuContext","useMenuContextSelectors","hasMenuContext","useHasParentContext","MenuContext","focusAttributes","useArrowNavigationGroup","circular","ignoreDefaultKeydown","Tab","usingPropsAndMenuContext","console","warn","innerRef","useRef","setFocusByFirstCharacter","useCallback","e","itemEl","acceptedRoles","current","menuItems","el","hasAttribute","indexOf","getAttribute","startIndex","length","firstChars","map","menuItem","_a","textContent","charAt","toLowerCase","char","key","getIndexFirstChars","start","firstChar","i","index","focus","checkedValues","setCheckedValues","useControllableState","state","undefined","defaultState","defaultCheckedValues","initialState","handleCheckedValueChange","_b","onCheckedValueChange","toggleCheckbox","useEventCallback","name","value","checked","checkedItems","newCheckedItems","splice","push","s","selectRadio","components","root","getNativeElementProps","useMergedRefs","role","triggerId","hasIcons","hasCheckmarks","exports","useMenuContext_unstable","context","contextValue","isUsingPropsAndContext","val"],"sources":["../src/packages/react-components/react-menu/src/components/MenuList/useMenuList.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n useMergedRefs,\n useEventCallback,\n useControllableState,\n getNativeElementProps,\n} from '@fluentui/react-utilities';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MenuContext } from '../../contexts/menuContext';\nimport type { MenuListProps, MenuListState } from './MenuList.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuList_unstable = (props: MenuListProps, ref: React.Ref<HTMLElement>): MenuListState => {\n const { findAllFocusable } = useFocusFinders();\n const menuContext = useMenuContextSelectors();\n const hasMenuContext = useHasParentContext(MenuContext);\n const focusAttributes = useArrowNavigationGroup({ circular: true, ignoreDefaultKeydown: { Tab: hasMenuContext } });\n\n if (usingPropsAndMenuContext(props, menuContext, hasMenuContext)) {\n // TODO throw warnings in development safely\n // eslint-disable-next-line no-console\n console.warn('You are using both MenuList and Menu props, we recommend you to use Menu props when available');\n }\n\n const innerRef = React.useRef<HTMLElement>(null);\n\n const setFocusByFirstCharacter = React.useCallback(\n (e: React.KeyboardEvent<HTMLElement>, itemEl: HTMLElement) => {\n // TODO use some kind of children registration to reduce dependency on DOM roles\n const acceptedRoles = ['menuitem', 'menuitemcheckbox', 'menuitemradio'];\n if (!innerRef.current) {\n return;\n }\n\n const menuItems = findAllFocusable(\n innerRef.current,\n (el: HTMLElement) => el.hasAttribute('role') && acceptedRoles.indexOf(el.getAttribute('role')!) !== -1,\n );\n\n let startIndex = menuItems.indexOf(itemEl) + 1;\n if (startIndex === menuItems.length) {\n startIndex = 0;\n }\n\n const firstChars = menuItems.map(menuItem => menuItem.textContent?.charAt(0).toLowerCase());\n const char = e.key.toLowerCase();\n\n const getIndexFirstChars = (start: number, firstChar: string) => {\n for (let i = start; i < firstChars.length; i++) {\n if (char === firstChars[i]) {\n return i;\n }\n }\n return -1;\n };\n\n // Check remaining slots in the menu\n let index = getIndexFirstChars(startIndex, char);\n\n // If not found in remaining slots, check from beginning\n if (index === -1) {\n index = getIndexFirstChars(0, char);\n }\n\n // If match was found...\n if (index > -1) {\n menuItems[index].focus();\n }\n },\n [findAllFocusable],\n );\n\n const [checkedValues, setCheckedValues] = useControllableState({\n state: props.checkedValues ?? (hasMenuContext ? menuContext.checkedValues : undefined),\n defaultState: props.defaultCheckedValues,\n initialState: {},\n });\n\n const handleCheckedValueChange =\n props.onCheckedValueChange ?? (hasMenuContext ? menuContext.onCheckedValueChange : undefined);\n\n const toggleCheckbox = useEventCallback(\n (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked: boolean) => {\n const checkedItems = checkedValues?.[name] || [];\n const newCheckedItems = [...checkedItems];\n if (checked) {\n newCheckedItems.splice(newCheckedItems.indexOf(value), 1);\n } else {\n newCheckedItems.push(value);\n }\n\n handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n },\n );\n\n const selectRadio = useEventCallback((e: React.MouseEvent | React.KeyboardEvent, name: string, value: string) => {\n const newCheckedItems = [value];\n setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n });\n\n return {\n components: {\n root: 'div',\n },\n root: getNativeElementProps('div', {\n ref: useMergedRefs(ref, innerRef),\n role: 'menu',\n 'aria-labelledby': menuContext.triggerId,\n ...focusAttributes,\n ...props,\n }),\n hasIcons: menuContext.hasIcons || false,\n hasCheckmarks: menuContext.hasCheckmarks || false,\n checkedValues,\n setFocusByFirstCharacter,\n selectRadio,\n toggleCheckbox,\n };\n};\n\n/**\n * Adds some sugar to fetching multiple context selector values\n */\nconst useMenuContextSelectors = () => {\n const checkedValues = useMenuContext_unstable(context => context.checkedValues);\n const onCheckedValueChange = useMenuContext_unstable(context => context.onCheckedValueChange);\n const triggerId = useMenuContext_unstable(context => context.triggerId);\n const hasIcons = useMenuContext_unstable(context => context.hasIcons);\n const hasCheckmarks = useMenuContext_unstable(context => context.hasCheckmarks);\n\n return {\n checkedValues,\n onCheckedValueChange,\n triggerId,\n hasIcons,\n hasCheckmarks,\n };\n};\n\n/**\n * Helper function to detect if props and MenuContext values are both used\n */\nconst usingPropsAndMenuContext = (\n props: MenuListProps,\n contextValue: ReturnType<typeof useMenuContextSelectors>,\n hasMenuContext: boolean,\n) => {\n let isUsingPropsAndContext = false;\n for (const val in contextValue) {\n if (props[val as keyof Omit<typeof contextValue, 'hasMenuContext' | 'onCheckedValueChange' | 'triggerId'>]) {\n isUsingPropsAndContext = true;\n }\n }\n\n return hasMenuContext && isUsingPropsAndContext;\n};\n"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["useMenuListContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","selectRadio","setFocusByFirstCharacter","toggleCheckbox","menuList","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuList/useMenuListContextValues.ts"],"sourcesContent":["import type { MenuListContextValues, MenuListState } from './MenuList.types';\n\nexport function useMenuListContextValues_unstable(state: MenuListState): MenuListContextValues {\n const { checkedValues, hasCheckmarks, hasIcons, selectRadio, setFocusByFirstCharacter, toggleCheckbox } = state;\n\n // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n const menuList = {\n checkedValues,\n hasCheckmarks,\n hasIcons,\n selectRadio,\n setFocusByFirstCharacter,\n toggleCheckbox,\n };\n\n return { menuList };\n}\n"],"mappings":";;;;;;AAEA,SAAgBA,iCAAiCA,CAACC,KAAoB;EACpE,MAAM;IAAEC,aAAa;IAAEC,aAAa;IAAEC,QAAQ;IAAEC,WAAW;IAAEC,wBAAwB;IAAEC;EAAc,CAAE,GAAGN,KAAK;EAE/G;EACA,MAAMO,QAAQ,GAAG;IACfN,aAAa;IACbC,aAAa;IACbC,QAAQ;IACRC,WAAW;IACXC,wBAAwB;IACxBC;GACD;EAED,OAAO;IAAEC;EAAQ,CAAE;AACrB;AAdAC,OAAA,CAAAT,iCAAA,GAAAA,iCAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["react_1","require","exports","menuListClassNames","root","useStyles","__styles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","d","useMenuListStyles_unstable","state","styles","className","mergeClasses"],"sources":["../src/packages/react-components/react-menu/src/components/MenuList/useMenuListStyles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport type { MenuListSlots, MenuListState } from './MenuList.types';\n\nexport const menuListClassNames: SlotClassNames<MenuListSlots> = {\n root: 'fui-MenuList',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n ...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(menuListClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":";;;;;;AACA,MAAAA,OAAA,gBAAAC,OAAA;AAGaC,OAAA,CAAAC,kBAAkB,GAAkC;EAC/DC,IAAI,EAAE;CACP;AAED,MAAMC,SAAS,gBAAGL,OAAA,CAAAM,QAAU;EAAAF,IAAA;IAAAG,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAM1B;AAEF;;;AAGO,MAAMC,0BAA0B,GAAIC,KAAoB,IAAmB;EAChF,MAAMC,MAAM,GAAGT,SAAS,EAAE;EAC1BQ,KAAK,CAACT,IAAI,CAACW,SAAS,GAAGf,OAAA,CAAAgB,YAAY,CAACd,OAAA,CAAAC,kBAAkB,CAACC,IAAI,EAAEU,MAAM,CAACV,IAAI,EAAES,KAAK,CAACT,IAAI,CAACW,SAAS,CAAC;EAC/F,OAAOF,KAAK;AACd,CAAC;AAJYX,OAAA,CAAAU,0BAA0B,GAAAA,0BAAA"}
|
@@ -8,12 +8,17 @@ const React = /*#__PURE__*/require("react");
|
|
8
8
|
const useMenuPopover_1 = /*#__PURE__*/require("./useMenuPopover");
|
9
9
|
const useMenuPopoverStyles_1 = /*#__PURE__*/require("./useMenuPopoverStyles");
|
10
10
|
const renderMenuPopover_1 = /*#__PURE__*/require("./renderMenuPopover");
|
11
|
+
const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
|
11
12
|
/**
|
12
13
|
* Popover intended to wrap `MenuList` and adds styling and interaction support specific to menus
|
13
14
|
*/
|
14
15
|
exports.MenuPopover = /*#__PURE__*/React.forwardRef((props, ref) => {
|
15
16
|
const state = useMenuPopover_1.useMenuPopover_unstable(props, ref);
|
16
17
|
useMenuPopoverStyles_1.useMenuPopoverStyles_unstable(state);
|
18
|
+
const {
|
19
|
+
useMenuPopoverStyles_unstable: useCustomStyles
|
20
|
+
} = react_shared_contexts_1.useCustomStyleHooks_unstable();
|
21
|
+
useCustomStyles(state);
|
17
22
|
return renderMenuPopover_1.renderMenuPopover_unstable(state);
|
18
23
|
});
|
19
24
|
exports.MenuPopover.displayName = 'MenuPopover';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","useMenuPopover_1","useMenuPopoverStyles_1","renderMenuPopover_1","react_shared_contexts_1","exports","MenuPopover","forwardRef","props","ref","state","useMenuPopover_unstable","useMenuPopoverStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderMenuPopover_unstable","displayName"],"sources":["../src/packages/react-components/react-menu/src/components/MenuPopover/MenuPopover.tsx"],"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';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\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\n const { useMenuPopoverStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderMenuPopover_unstable(state);\n});\n\nMenuPopover.displayName = 'MenuPopover';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,gBAAA,gBAAAD,OAAA;AACA,MAAAE,sBAAA,gBAAAF,OAAA;AACA,MAAAG,mBAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;AAGaK,OAAA,CAAAC,WAAW,gBAA0CP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGT,gBAAA,CAAAU,uBAAuB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEjDP,sBAAA,CAAAU,6BAA6B,CAACF,KAAK,CAAC;EAEpC,MAAM;IAAEE,6BAA6B,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EACzFD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOP,mBAAA,CAAAY,0BAA0B,CAACL,KAAK,CAAC;AAC1C,CAAC,CAAC;AAEFL,OAAA,CAAAC,WAAW,CAACU,WAAW,GAAG,aAAa"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":[],"sources":["../src/packages/react-components/react-menu/src/components/MenuPopover/MenuPopover.types.ts"],"sourcesContent":["import type { PortalProps } from '@fluentui/react-portal';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type MenuPopoverSlots = {\n root: Slot<'div'>;\n};\n\n/**\n * MenuPopover Props\n */\nexport type MenuPopoverProps = ComponentProps<MenuPopoverSlots>;\n\n/**\n * State used in rendering MenuPopover\n */\nexport type MenuPopoverState = ComponentState<MenuPopoverSlots> &\n Pick<PortalProps, 'mountNode'> & {\n /**\n * Root menus are rendered out of DOM order on `document.body`, use this to render the menu in DOM order\n * This option is disregarded for submenus\n */\n inline: boolean;\n };\n"],"mappings":""}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuPopover/index.ts"],"sourcesContent":["export * from './MenuPopover';\nexport * from './MenuPopover.types';\nexport * from './renderMenuPopover';\nexport * from './useMenuPopover';\nexport * from './useMenuPopoverStyles';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,mBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,yBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,yBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,sBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,4BAAAC,OAAA"}
|
@@ -20,7 +20,9 @@ const renderMenuPopover_unstable = state => {
|
|
20
20
|
...slotProps.root
|
21
21
|
});
|
22
22
|
}
|
23
|
-
return React.createElement(react_portal_1.Portal,
|
23
|
+
return React.createElement(react_portal_1.Portal, {
|
24
|
+
mountNode: state.mountNode
|
25
|
+
}, React.createElement(slots.root, {
|
24
26
|
...slotProps.root
|
25
27
|
}));
|
26
28
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"names":["React","require","react_utilities_1","react_portal_1","renderMenuPopover_unstable","state","slots","slotProps","getSlots","inline","createElement","root","Portal","mountNode","exports"],"sources":["../src/packages/react-components/react-menu/src/components/MenuPopover/renderMenuPopover.tsx"],"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 mountNode={state.mountNode}>\n <slots.root {...slotProps.root} />\n </Portal>\n );\n};\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAEA,MAAAE,cAAA,gBAAAF,OAAA;AAEA;;;AAGO,MAAMG,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGL,iBAAA,CAAAM,QAAQ,CAAmBH,KAAK,CAAC;EAE9D,IAAIA,KAAK,CAACI,MAAM,EAAE;IAChB,OAAOT,KAAA,CAAAU,aAAA,CAACJ,KAAK,CAACK,IAAI;MAAA,GAAKJ,SAAS,CAACI;IAAI,EAAI;;EAG3C,OACEX,KAAA,CAAAU,aAAA,CAACP,cAAA,CAAAS,MAAM;IAACC,SAAS,EAAER,KAAK,CAACQ;EAAS,GAChCb,KAAA,CAAAU,aAAA,CAACJ,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,EAAI,CAC3B;AAEb,CAAC;AAZYG,OAAA,CAAAV,0BAA0B,GAAAA,0BAAA"}
|
@@ -55,6 +55,7 @@ const useMenuPopover_unstable = (props, ref) => {
|
|
55
55
|
() => clearTimeout(throttleDispatchTimerRef.current);
|
56
56
|
}, []);
|
57
57
|
const inline = (_a = menuContext_1.useMenuContext_unstable(context => context.inline)) !== null && _a !== void 0 ? _a : false;
|
58
|
+
const mountNode = menuContext_1.useMenuContext_unstable(context => context.mountNode);
|
58
59
|
const rootProps = react_utilities_1.getNativeElementProps('div', {
|
59
60
|
role: 'presentation',
|
60
61
|
...props,
|
@@ -103,6 +104,7 @@ const useMenuPopover_unstable = (props, ref) => {
|
|
103
104
|
});
|
104
105
|
return {
|
105
106
|
inline,
|
107
|
+
mountNode,
|
106
108
|
components: {
|
107
109
|
root: 'div'
|
108
110
|
},
|