@fluentui/react-menu 9.25.6 → 9.25.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +27 -2
- package/lib/components/Menu/Menu.js.map +1 -1
- package/lib/components/Menu/Menu.types.js.map +1 -1
- package/lib/components/Menu/MenuSurfaceMotion.js.map +1 -1
- package/lib/components/Menu/index.js.map +1 -1
- package/lib/components/Menu/renderMenu.js +2 -2
- package/lib/components/Menu/renderMenu.js.map +1 -1
- package/lib/components/Menu/useMenu.js +2 -2
- package/lib/components/Menu/useMenu.js.map +1 -1
- package/lib/components/Menu/useMenuContextValues.js.map +1 -1
- package/lib/components/MenuDivider/MenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/MenuDivider.types.js.map +1 -1
- package/lib/components/MenuDivider/index.js.map +1 -1
- package/lib/components/MenuDivider/renderMenuDivider.js +2 -2
- package/lib/components/MenuDivider/renderMenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/useMenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/useMenuDividerStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuGroup/MenuGroup.js.map +1 -1
- package/lib/components/MenuGroup/MenuGroup.types.js.map +1 -1
- package/lib/components/MenuGroup/index.js.map +1 -1
- package/lib/components/MenuGroup/renderMenuGroup.js +2 -2
- 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.styles.raw.js.map +1 -1
- package/lib/components/MenuGroupHeader/MenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/MenuGroupHeader.types.js.map +1 -1
- package/lib/components/MenuGroupHeader/index.js.map +1 -1
- package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js +2 -2
- package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuItem/MenuItem.js.map +1 -1
- package/lib/components/MenuItem/MenuItem.types.js.map +1 -1
- package/lib/components/MenuItem/index.js.map +1 -1
- package/lib/components/MenuItem/renderMenuItem.js +2 -2
- package/lib/components/MenuItem/renderMenuItem.js.map +1 -1
- package/lib/components/MenuItem/useCharacterSearch.js.map +1 -1
- package/lib/components/MenuItem/useMenuItem.js +1 -2
- package/lib/components/MenuItem/useMenuItem.js.map +1 -1
- package/lib/components/MenuItem/useMenuItemBase.js.map +1 -1
- package/lib/components/MenuItem/useMenuItemStyles.styles.js +19 -9
- package/lib/components/MenuItem/useMenuItemStyles.styles.js.map +1 -1
- package/lib/components/MenuItem/useMenuItemStyles.styles.raw.js +15 -6
- package/lib/components/MenuItem/useMenuItemStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuItemCheckbox/MenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/MenuItemCheckbox.types.js.map +1 -1
- package/lib/components/MenuItemCheckbox/index.js.map +1 -1
- package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js +2 -2
- package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.js +1 -2
- package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuItemLink/MenuItemLink.js.map +1 -1
- package/lib/components/MenuItemLink/MenuItemLink.types.js.map +1 -1
- package/lib/components/MenuItemLink/index.js.map +1 -1
- package/lib/components/MenuItemLink/renderMenuItemLink.js +2 -2
- package/lib/components/MenuItemLink/renderMenuItemLink.js.map +1 -1
- package/lib/components/MenuItemLink/useMenuItemLink.js.map +1 -1
- package/lib/components/MenuItemLink/useMenuItemLinkStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuItemRadio/MenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/MenuItemRadio.types.js.map +1 -1
- package/lib/components/MenuItemRadio/index.js.map +1 -1
- package/lib/components/MenuItemRadio/renderMenuItemRadio.js +2 -2
- package/lib/components/MenuItemRadio/renderMenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadio.js +1 -2
- package/lib/components/MenuItemRadio/useMenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuItemSwitch/MenuItemSwitch.js.map +1 -1
- package/lib/components/MenuItemSwitch/MenuItemSwitch.types.js.map +1 -1
- package/lib/components/MenuItemSwitch/index.js.map +1 -1
- package/lib/components/MenuItemSwitch/renderMenuItemSwitch.js +2 -2
- package/lib/components/MenuItemSwitch/renderMenuItemSwitch.js.map +1 -1
- package/lib/components/MenuItemSwitch/useMenuItemSwitch.js +1 -2
- package/lib/components/MenuItemSwitch/useMenuItemSwitch.js.map +1 -1
- package/lib/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuList/MenuList.js.map +1 -1
- package/lib/components/MenuList/MenuList.types.js.map +1 -1
- package/lib/components/MenuList/index.js.map +1 -1
- package/lib/components/MenuList/renderMenuList.js +2 -2
- package/lib/components/MenuList/renderMenuList.js.map +1 -1
- package/lib/components/MenuList/useMenuList.js +1 -3
- package/lib/components/MenuList/useMenuList.js.map +1 -1
- package/lib/components/MenuList/useMenuListContextValues.js.map +1 -1
- package/lib/components/MenuList/useMenuListStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuPopover/MenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/MenuPopover.types.js.map +1 -1
- package/lib/components/MenuPopover/index.js.map +1 -1
- package/lib/components/MenuPopover/renderMenuPopover.js +2 -2
- package/lib/components/MenuPopover/renderMenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopover.js +1 -1
- package/lib/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopoverStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuSplitGroup/MenuSplitGroup.js.map +1 -1
- package/lib/components/MenuSplitGroup/MenuSplitGroup.types.js.map +1 -1
- package/lib/components/MenuSplitGroup/index.js.map +1 -1
- package/lib/components/MenuSplitGroup/renderMenuSplitGroup.js +4 -4
- package/lib/components/MenuSplitGroup/renderMenuSplitGroup.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroup.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroupContextValues.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuTrigger/MenuTrigger.js.map +1 -1
- package/lib/components/MenuTrigger/MenuTrigger.types.js.map +1 -1
- package/lib/components/MenuTrigger/index.js.map +1 -1
- package/lib/components/MenuTrigger/renderMenuTrigger.js.map +1 -1
- package/lib/components/MenuTrigger/useMenuTrigger.js +2 -2
- package/lib/components/MenuTrigger/useMenuTrigger.js.map +1 -1
- package/lib/components/index.js.map +1 -1
- 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/menuSplitGroupContext.js.map +1 -1
- package/lib/contexts/menuTriggerContext.js.map +1 -1
- package/lib/selectable/index.js.map +1 -1
- package/lib/selectable/types.js.map +1 -1
- package/lib/selectable/useCheckmarkStyles.styles.raw.js.map +1 -1
- package/lib/utils/index.js.map +1 -1
- package/lib/utils/useIsSubmenu.js.map +1 -1
- package/lib/utils/useOnMenuEnter.js +1 -1
- package/lib/utils/useOnMenuEnter.js.map +1 -1
- package/lib/utils/useOnMenuSafeZoneTimeout.js.map +1 -1
- package/lib/utils/useValidateNesting.js +4 -4
- package/lib/utils/useValidateNesting.js.map +1 -1
- package/lib-commonjs/Menu.cjs +6 -6
- package/lib-commonjs/MenuDivider.cjs +6 -6
- package/lib-commonjs/MenuGroup.cjs +7 -7
- package/lib-commonjs/MenuGroupHeader.cjs +6 -6
- package/lib-commonjs/MenuItem.cjs +7 -7
- package/lib-commonjs/MenuItemCheckbox.cjs +7 -7
- package/lib-commonjs/MenuItemLink.cjs +7 -7
- package/lib-commonjs/MenuItemRadio.cjs +7 -7
- package/lib-commonjs/MenuItemSwitch.cjs +8 -8
- package/lib-commonjs/MenuList.cjs +8 -8
- package/lib-commonjs/MenuPopover.cjs +7 -7
- package/lib-commonjs/MenuSplitGroup.cjs +6 -6
- package/lib-commonjs/MenuTrigger.cjs +5 -5
- package/lib-commonjs/components/Menu/Menu.cjs.map +1 -1
- package/lib-commonjs/components/Menu/Menu.types.cjs.map +1 -1
- package/lib-commonjs/components/Menu/MenuSurfaceMotion.cjs.map +1 -1
- package/lib-commonjs/components/Menu/index.cjs +6 -6
- package/lib-commonjs/components/Menu/index.cjs.map +1 -1
- package/lib-commonjs/components/Menu/renderMenu.cjs.map +1 -1
- package/lib-commonjs/components/Menu/useMenu.cjs +5 -5
- package/lib-commonjs/components/Menu/useMenu.cjs.map +1 -1
- package/lib-commonjs/components/Menu/useMenuContextValues.cjs.map +1 -1
- package/lib-commonjs/components/MenuDivider/MenuDivider.cjs.map +1 -1
- package/lib-commonjs/components/MenuDivider/MenuDivider.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuDivider/index.cjs +6 -6
- package/lib-commonjs/components/MenuDivider/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuDivider/renderMenuDivider.cjs.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDivider.cjs.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.styles.cjs +3 -3
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.styles.raw.cjs +3 -3
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroup/MenuGroup.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroup/MenuGroup.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroup/index.cjs +7 -7
- package/lib-commonjs/components/MenuGroup/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroup/renderMenuGroup.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroup.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupContextValues.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.styles.cjs +3 -3
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.styles.raw.cjs +3 -3
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/index.cjs +6 -6
- package/lib-commonjs/components/MenuGroupHeader/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/renderMenuGroupHeader.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.styles.cjs +3 -3
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.styles.raw.cjs +3 -3
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuItem/MenuItem.cjs.map +1 -1
- package/lib-commonjs/components/MenuItem/MenuItem.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuItem/index.cjs +7 -7
- package/lib-commonjs/components/MenuItem/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuItem/renderMenuItem.cjs.map +1 -1
- package/lib-commonjs/components/MenuItem/useCharacterSearch.cjs.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItem.cjs +1 -2
- package/lib-commonjs/components/MenuItem/useMenuItem.cjs.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItemBase.cjs.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.styles.cjs +60 -38
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.styles.raw.cjs +18 -9
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/index.cjs +7 -7
- package/lib-commonjs/components/MenuItemCheckbox/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/renderMenuItemCheckbox.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckbox.cjs +4 -5
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckbox.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.styles.cjs +3 -3
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.styles.raw.cjs +3 -3
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemLink/MenuItemLink.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemLink/MenuItemLink.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemLink/index.cjs +7 -7
- package/lib-commonjs/components/MenuItemLink/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemLink/renderMenuItemLink.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemLink/useMenuItemLink.cjs +3 -3
- package/lib-commonjs/components/MenuItemLink/useMenuItemLink.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemLink/useMenuItemLinkStyles.styles.cjs +3 -3
- package/lib-commonjs/components/MenuItemLink/useMenuItemLinkStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemLink/useMenuItemLinkStyles.styles.raw.cjs +3 -3
- package/lib-commonjs/components/MenuItemLink/useMenuItemLinkStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/index.cjs +7 -7
- package/lib-commonjs/components/MenuItemRadio/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/renderMenuItemRadio.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadio.cjs +4 -5
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadio.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.styles.cjs +3 -3
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.styles.raw.cjs +3 -3
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemSwitch/MenuItemSwitch.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemSwitch/MenuItemSwitch.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemSwitch/index.cjs +8 -8
- package/lib-commonjs/components/MenuItemSwitch/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemSwitch/renderMenuItemSwitch.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemSwitch/useMenuItemSwitch.cjs +4 -5
- package/lib-commonjs/components/MenuItemSwitch/useMenuItemSwitch.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.cjs +4 -4
- package/lib-commonjs/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.raw.cjs +4 -4
- package/lib-commonjs/components/MenuItemSwitch/useMenuItemSwitchStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuList/MenuList.cjs.map +1 -1
- package/lib-commonjs/components/MenuList/MenuList.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuList/index.cjs +8 -8
- package/lib-commonjs/components/MenuList/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuList/renderMenuList.cjs.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuList.cjs +4 -6
- package/lib-commonjs/components/MenuList/useMenuList.cjs.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListContextValues.cjs.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListStyles.styles.cjs +3 -3
- package/lib-commonjs/components/MenuList/useMenuListStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListStyles.styles.raw.cjs +3 -3
- package/lib-commonjs/components/MenuList/useMenuListStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuPopover/MenuPopover.cjs.map +1 -1
- package/lib-commonjs/components/MenuPopover/MenuPopover.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuPopover/index.cjs +7 -7
- package/lib-commonjs/components/MenuPopover/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuPopover/renderMenuPopover.cjs.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopover.cjs +4 -4
- package/lib-commonjs/components/MenuPopover/useMenuPopover.cjs.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.styles.cjs +3 -3
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.styles.raw.cjs +3 -3
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.cjs.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/index.cjs +6 -6
- package/lib-commonjs/components/MenuSplitGroup/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.cjs +2 -2
- package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.cjs.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.cjs.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupContextValues.cjs.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.cjs +4 -4
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.cjs.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.raw.cjs +4 -4
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.cjs.map +1 -1
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.types.cjs.map +1 -1
- package/lib-commonjs/components/MenuTrigger/index.cjs +5 -5
- package/lib-commonjs/components/MenuTrigger/index.cjs.map +1 -1
- package/lib-commonjs/components/MenuTrigger/renderMenuTrigger.cjs.map +1 -1
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.cjs +5 -5
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.cjs.map +1 -1
- package/lib-commonjs/components/index.cjs +12 -12
- package/lib-commonjs/components/index.cjs.map +1 -1
- package/lib-commonjs/contexts/menuContext.cjs +4 -4
- package/lib-commonjs/contexts/menuContext.cjs.map +1 -1
- package/lib-commonjs/contexts/menuGroupContext.cjs +3 -3
- package/lib-commonjs/contexts/menuGroupContext.cjs.map +1 -1
- package/lib-commonjs/contexts/menuListContext.cjs +4 -4
- package/lib-commonjs/contexts/menuListContext.cjs.map +1 -1
- package/lib-commonjs/contexts/menuSplitGroupContext.cjs +5 -5
- package/lib-commonjs/contexts/menuSplitGroupContext.cjs.map +1 -1
- package/lib-commonjs/contexts/menuTriggerContext.cjs +3 -3
- package/lib-commonjs/contexts/menuTriggerContext.cjs.map +1 -1
- package/lib-commonjs/index.cjs +86 -86
- package/lib-commonjs/index.cjs.map +1 -1
- package/lib-commonjs/selectable/index.cjs.map +1 -1
- package/lib-commonjs/selectable/types.cjs.map +1 -1
- package/lib-commonjs/selectable/useCheckmarkStyles.styles.raw.cjs.map +1 -1
- package/lib-commonjs/utils/index.cjs +8 -8
- package/lib-commonjs/utils/index.cjs.map +1 -1
- package/lib-commonjs/utils/useIsSubmenu.cjs.map +1 -1
- package/lib-commonjs/utils/useOnMenuEnter.cjs +5 -5
- package/lib-commonjs/utils/useOnMenuEnter.cjs.map +1 -1
- package/lib-commonjs/utils/useOnMenuSafeZoneTimeout.cjs +3 -3
- package/lib-commonjs/utils/useOnMenuSafeZoneTimeout.cjs.map +1 -1
- package/lib-commonjs/utils/useValidateNesting.cjs +4 -4
- package/lib-commonjs/utils/useValidateNesting.cjs.map +1 -1
- package/package.json +10 -10
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItem/renderMenuItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { MenuItemSlots, MenuItemState } from './MenuItem.types';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderMenuItem_unstable = (state: MenuItemState): JSXElement => {\n assertSlots<MenuItemSlots>(state);\n\n return (\n <state.root>\n {state.checkmark && <state.checkmark />}\n {state.icon && <state.icon />}\n {state.content && (\n <state.content>\n {state.content.children}\n {state.subText && <state.subText />}\n </state.content>\n )}\n {state.secondaryContent && <state.secondaryContent />}\n {state.submenuIndicator && <state.submenuIndicator />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderMenuItem_unstable","state","root","checkmark","icon","content","children","subText","secondaryContent","submenuIndicator"],"mappings":";AAAA,0BAA0B,GAC1B,iDAAiD,GACjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC;IACtCF,YAA2BE;IAE3B,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAME,SAAS,kBAAI,KAACF,MAAME,SAAS;YACnCF,MAAMG,IAAI,kBAAI,KAACH,MAAMG,IAAI;YACzBH,MAAMI,OAAO,kBACZ,MAACJ,MAAMI,OAAO;;oBACXJ,MAAMI,OAAO,CAACC,QAAQ;oBACtBL,MAAMM,OAAO,kBAAI,KAACN,MAAMM,OAAO;;;YAGnCN,MAAMO,gBAAgB,kBAAI,KAACP,MAAMO,gBAAgB;YACjDP,MAAMQ,gBAAgB,kBAAI,KAACR,MAAMQ,gBAAgB;;;AAGxD,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItem/useCharacterSearch.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport type { MenuItemState } from '../../components/index';\nimport type { ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\nexport const useCharacterSearch = (state: MenuItemState, ref: React.RefObject<HTMLElement | null>): MenuItemState => {\n const setFocusByFirstCharacter = useMenuListContext_unstable(context => context.setFocusByFirstCharacter);\n\n const { onKeyDown: originalOnKeyDown } = state.root;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.onKeyDown = (e: React.KeyboardEvent<ARIAButtonElementIntersection>) => {\n originalOnKeyDown?.(e);\n\n if (e.key?.length > 1) {\n return;\n }\n\n if (ref.current) {\n setFocusByFirstCharacter?.(e, ref.current);\n }\n };\n\n return state;\n};\n"],"names":["useMenuListContext_unstable","useCharacterSearch","state","ref","setFocusByFirstCharacter","context","onKeyDown","originalOnKeyDown","root","e","key","length","current"],"mappings":"AAAA;AAGA,SAASA,2BAA2B,QAAQ,oCAAiC;AAI7E,OAAO,MAAMC,qBAAqB,CAACC,OAAsBC;IACvD,MAAMC,2BAA2BJ,4BAA4BK,CAAAA,UAAWA,QAAQD,wBAAwB;IAExG,MAAM,EAAEE,WAAWC,iBAAiB,EAAE,GAAGL,MAAMM,IAAI;IAEnD,oDAAoD;IACpDN,MAAMM,IAAI,CAACF,SAAS,GAAG,CAACG;YAGlBA;QAFJF,8BAAAA,wCAAAA,kBAAoBE;QAEpB,IAAIA,EAAAA,SAAAA,EAAEC,GAAG,cAALD,6BAAAA,OAAOE,MAAM,IAAG,GAAG;YACrB;QACF;QAEA,IAAIR,IAAIS,OAAO,EAAE;YACfR,qCAAAA,+CAAAA,yBAA2BK,GAAGN,IAAIS,OAAO;QAC3C;IACF;IAEA,OAAOV;AACT,EAAE"}
|
|
@@ -12,8 +12,7 @@ const ChevronLeftIcon = bundleIcon(ChevronLeftFilled, ChevronLeftRegular);
|
|
|
12
12
|
const state = useMenuItemBase_unstable(props, ref);
|
|
13
13
|
// Set default chevron icon
|
|
14
14
|
if (state.submenuIndicator) {
|
|
15
|
-
var _state_submenuIndicator;
|
|
16
|
-
var _children;
|
|
15
|
+
var _state_submenuIndicator, _children;
|
|
17
16
|
(_children = (_state_submenuIndicator = state.submenuIndicator).children) !== null && _children !== void 0 ? _children : _state_submenuIndicator.children = dir === 'rtl' ? /*#__PURE__*/ React.createElement(ChevronLeftIcon, null) : /*#__PURE__*/ React.createElement(ChevronRightIcon, null);
|
|
18
17
|
}
|
|
19
18
|
return state;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItem/useMenuItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n ChevronRightFilled,\n ChevronRightRegular,\n ChevronLeftFilled,\n ChevronLeftRegular,\n bundleIcon,\n} from '@fluentui/react-icons';\nimport { useMenuItemBase_unstable } from './useMenuItemBase';\nimport type { MenuItemProps, MenuItemState } from './MenuItem.types';\nimport type { ARIAButtonElement } from '@fluentui/react-aria';\n\nconst ChevronRightIcon = bundleIcon(ChevronRightFilled, ChevronRightRegular);\nconst ChevronLeftIcon = bundleIcon(ChevronLeftFilled, ChevronLeftRegular);\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuItem_unstable = (props: MenuItemProps, ref: React.Ref<ARIAButtonElement<'div'>>): MenuItemState => {\n const { dir } = useFluent();\n const state = useMenuItemBase_unstable(props, ref);\n\n // Set default chevron icon\n if (state.submenuIndicator) {\n state.submenuIndicator.children ??= dir === 'rtl' ? <ChevronLeftIcon /> : <ChevronRightIcon />;\n }\n\n return state;\n};\n"],"names":["React","useFluent_unstable","useFluent","ChevronRightFilled","ChevronRightRegular","ChevronLeftFilled","ChevronLeftRegular","bundleIcon","useMenuItemBase_unstable","ChevronRightIcon","ChevronLeftIcon","useMenuItem_unstable","props","ref","dir","state","submenuIndicator","children"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SACEC,kBAAkB,EAClBC,mBAAmB,EACnBC,iBAAiB,EACjBC,kBAAkB,EAClBC,UAAU,QACL,wBAAwB;AAC/B,SAASC,wBAAwB,QAAQ,uBAAoB;AAI7D,MAAMC,mBAAmBF,WAAWJ,oBAAoBC;AACxD,MAAMM,kBAAkBH,WAAWF,mBAAmBC;AAEtD;;CAEC,GACD,OAAO,MAAMK,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,GAAG,EAAE,GAAGZ;IAChB,MAAMa,QAAQP,yBAAyBI,OAAOC;IAE9C,2BAA2B;IAC3B,IAAIE,MAAMC,gBAAgB,EAAE;YAC1BD,yBAAAA;SAAAA,YAAAA,CAAAA,0BAAAA,MAAMC,gBAAgB,EAACC,QAAQ,cAA/BF,uBAAAA,YAAAA,wBAAuBE,QAAQ,GAAKH,QAAQ,sBAAQ,oBAACJ,uCAAqB,oBAACD;IAC7E;IAEA,OAAOM;AACT,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuItem/useMenuItemBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n useEventCallback,\n useMergedRefs,\n getIntrinsicElementProps,\n slot,\n useIsomorphicLayoutEffect,\n} from '@fluentui/react-utilities';\nimport { useCharacterSearch } from './useCharacterSearch';\nimport { useMenuTriggerContext_unstable } from '../../contexts/menuTriggerContext';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport type { MenuItemProps, MenuItemState } from './MenuItem.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection, ARIAButtonProps } from '@fluentui/react-aria';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useIsInMenuSplitGroup, useMenuSplitGroupContext_unstable } from '../../contexts/menuSplitGroupContext';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\n/**\n * Base hook for MenuItem component, produces state required to render the component.\n * It doesn't set any design-related props specific to MenuItem such as submenu indicator icon.\n */\nexport const useMenuItemBase_unstable = (\n props: MenuItemProps,\n ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemState => {\n const isSubmenuTrigger = useMenuTriggerContext_unstable();\n const persistOnClickContext = useMenuContext_unstable(context => context.persistOnItemClick);\n const {\n as = 'div',\n disabled = false,\n hasSubmenu = isSubmenuTrigger,\n persistOnClick = persistOnClickContext,\n content: _content, // `content` is a slot and it's type clashes with the HTMLElement `content` attribute\n ...rest\n } = props;\n const { hasIcons, hasCheckmarks } = useIconAndCheckmarkAlignment({ hasSubmenu });\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n const open = useMenuContext_unstable(context => context.open);\n useNotifySplitItemMultiline({ multiline: !!props.subText, hasSubmenu });\n\n const innerRef = React.useRef<ARIAButtonElementIntersection<'div'>>(null);\n const dismissedWithKeyboardRef = React.useRef(false);\n\n const validateNestingRef = useValidateNesting(getValidateNestingComponentName(props.role));\n\n const state: MenuItemState = {\n hasSubmenu,\n submenuOpen: hasSubmenu && open,\n disabled,\n persistOnClick,\n components: {\n root: 'div',\n icon: 'span',\n checkmark: 'span',\n submenuIndicator: 'span',\n content: 'span',\n secondaryContent: 'span',\n subText: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps(\n as,\n useARIAButtonProps<'div', ARIAButtonProps<'div'>>(as, {\n role: 'menuitem',\n ...rest,\n disabled: false,\n disabledFocusable: disabled,\n ref: useMergedRefs(ref, innerRef, validateNestingRef) as React.Ref<ARIAButtonElementIntersection<'div'>>,\n onKeyDown: useEventCallback(event => {\n props.onKeyDown?.(event);\n if (!event.isDefaultPrevented() && (event.key === Space || event.key === Enter)) {\n dismissedWithKeyboardRef.current = true;\n }\n }),\n onMouseMove: useEventCallback(event => {\n if (event.currentTarget.ownerDocument.activeElement !== event.currentTarget) {\n innerRef.current?.focus();\n }\n\n props.onMouseMove?.(event);\n }),\n onClick: useEventCallback(event => {\n if (!hasSubmenu && !persistOnClick) {\n setOpen(event, {\n open: false,\n keyboard: dismissedWithKeyboardRef.current,\n bubble: true,\n type: 'menuItemClick',\n event,\n });\n dismissedWithKeyboardRef.current = false;\n }\n\n props.onClick?.(event);\n }),\n }),\n ),\n { elementType: 'div' },\n ),\n icon: slot.optional(props.icon, { renderByDefault: hasIcons, elementType: 'span' }),\n checkmark: slot.optional(props.checkmark, {\n renderByDefault: hasCheckmarks,\n elementType: 'span',\n }),\n submenuIndicator: slot.optional(props.submenuIndicator, {\n renderByDefault: hasSubmenu,\n elementType: 'span',\n }),\n content: slot.optional(props.content, {\n renderByDefault: !!props.children,\n defaultProps: { children: props.children },\n elementType: 'span',\n }),\n secondaryContent: slot.optional(props.secondaryContent, { elementType: 'span' }),\n subText: slot.optional(props.subText, { elementType: 'span' }),\n };\n useCharacterSearch(state, innerRef);\n return state;\n};\n\n/**\n * MenuSplitGroup needs to apply extra styles when its main item is in multiline layout mode\n * Notify the parent MenuSplitGroup so that it can handle this case\n */\nconst useNotifySplitItemMultiline = (options: { hasSubmenu: boolean; multiline: boolean }) => {\n const { hasSubmenu, multiline } = options;\n const isSplitItemTrigger = useIsInMenuSplitGroup() && hasSubmenu;\n\n const { setMultiline } = useMenuSplitGroupContext_unstable();\n\n useIsomorphicLayoutEffect(() => {\n if (!isSplitItemTrigger) {\n setMultiline(multiline);\n }\n }, [setMultiline, multiline, isSplitItemTrigger]);\n};\n\nconst useIconAndCheckmarkAlignment = (options: { hasSubmenu: boolean }) => {\n const { hasSubmenu } = options;\n const hasIcons = useMenuListContext_unstable(context => context.hasIcons);\n const hasCheckmarks = useMenuListContext_unstable(context => context.hasCheckmarks);\n const isSplitItemTrigger = useIsInMenuSplitGroup() && hasSubmenu;\n\n return {\n hasIcons: hasIcons && !isSplitItemTrigger,\n hasCheckmarks: hasCheckmarks && !isSplitItemTrigger,\n };\n};\n\nconst getValidateNestingComponentName = (role?: string) => {\n switch (role) {\n case 'menuitemcheckbox':\n return 'MenuItemCheckbox';\n case 'menuitemradio':\n return 'MenuItemRadio';\n }\n return 'MenuItem';\n};\n"],"names":["React","useEventCallback","useMergedRefs","getIntrinsicElementProps","slot","useIsomorphicLayoutEffect","useCharacterSearch","useMenuTriggerContext_unstable","useMenuListContext_unstable","useMenuContext_unstable","useARIAButtonProps","Enter","Space","useIsInMenuSplitGroup","useMenuSplitGroupContext_unstable","useValidateNesting","useMenuItemBase_unstable","props","ref","isSubmenuTrigger","persistOnClickContext","context","persistOnItemClick","as","disabled","hasSubmenu","persistOnClick","content","_content","rest","hasIcons","hasCheckmarks","useIconAndCheckmarkAlignment","setOpen","open","useNotifySplitItemMultiline","multiline","subText","innerRef","useRef","dismissedWithKeyboardRef","validateNestingRef","getValidateNestingComponentName","role","state","submenuOpen","components","root","icon","checkmark","submenuIndicator","secondaryContent","always","disabledFocusable","onKeyDown","event","isDefaultPrevented","key","current","onMouseMove","currentTarget","ownerDocument","activeElement","focus","onClick","keyboard","bubble","type","elementType","optional","renderByDefault","children","defaultProps","options","isSplitItemTrigger","setMultiline"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItem/useMenuItemBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n useEventCallback,\n useMergedRefs,\n getIntrinsicElementProps,\n slot,\n useIsomorphicLayoutEffect,\n} from '@fluentui/react-utilities';\nimport { useCharacterSearch } from './useCharacterSearch';\nimport { useMenuTriggerContext_unstable } from '../../contexts/menuTriggerContext';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport type { MenuItemProps, MenuItemState } from './MenuItem.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection, ARIAButtonProps } from '@fluentui/react-aria';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useIsInMenuSplitGroup, useMenuSplitGroupContext_unstable } from '../../contexts/menuSplitGroupContext';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\n/**\n * Base hook for MenuItem component, produces state required to render the component.\n * It doesn't set any design-related props specific to MenuItem such as submenu indicator icon.\n */\nexport const useMenuItemBase_unstable = (\n props: MenuItemProps,\n ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemState => {\n const isSubmenuTrigger = useMenuTriggerContext_unstable();\n const persistOnClickContext = useMenuContext_unstable(context => context.persistOnItemClick);\n const {\n as = 'div',\n disabled = false,\n hasSubmenu = isSubmenuTrigger,\n persistOnClick = persistOnClickContext,\n content: _content, // `content` is a slot and it's type clashes with the HTMLElement `content` attribute\n ...rest\n } = props;\n const { hasIcons, hasCheckmarks } = useIconAndCheckmarkAlignment({ hasSubmenu });\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n const open = useMenuContext_unstable(context => context.open);\n useNotifySplitItemMultiline({ multiline: !!props.subText, hasSubmenu });\n\n const innerRef = React.useRef<ARIAButtonElementIntersection<'div'>>(null);\n const dismissedWithKeyboardRef = React.useRef(false);\n\n const validateNestingRef = useValidateNesting(getValidateNestingComponentName(props.role));\n\n const state: MenuItemState = {\n hasSubmenu,\n submenuOpen: hasSubmenu && open,\n disabled,\n persistOnClick,\n components: {\n root: 'div',\n icon: 'span',\n checkmark: 'span',\n submenuIndicator: 'span',\n content: 'span',\n secondaryContent: 'span',\n subText: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps(\n as,\n useARIAButtonProps<'div', ARIAButtonProps<'div'>>(as, {\n role: 'menuitem',\n ...rest,\n disabled: false,\n disabledFocusable: disabled,\n ref: useMergedRefs(ref, innerRef, validateNestingRef) as React.Ref<ARIAButtonElementIntersection<'div'>>,\n onKeyDown: useEventCallback(event => {\n props.onKeyDown?.(event);\n if (!event.isDefaultPrevented() && (event.key === Space || event.key === Enter)) {\n dismissedWithKeyboardRef.current = true;\n }\n }),\n onMouseMove: useEventCallback(event => {\n if (event.currentTarget.ownerDocument.activeElement !== event.currentTarget) {\n innerRef.current?.focus();\n }\n\n props.onMouseMove?.(event);\n }),\n onClick: useEventCallback(event => {\n if (!hasSubmenu && !persistOnClick) {\n setOpen(event, {\n open: false,\n keyboard: dismissedWithKeyboardRef.current,\n bubble: true,\n type: 'menuItemClick',\n event,\n });\n dismissedWithKeyboardRef.current = false;\n }\n\n props.onClick?.(event);\n }),\n }),\n ),\n { elementType: 'div' },\n ),\n icon: slot.optional(props.icon, { renderByDefault: hasIcons, elementType: 'span' }),\n checkmark: slot.optional(props.checkmark, {\n renderByDefault: hasCheckmarks,\n elementType: 'span',\n }),\n submenuIndicator: slot.optional(props.submenuIndicator, {\n renderByDefault: hasSubmenu,\n elementType: 'span',\n }),\n content: slot.optional(props.content, {\n renderByDefault: !!props.children,\n defaultProps: { children: props.children },\n elementType: 'span',\n }),\n secondaryContent: slot.optional(props.secondaryContent, { elementType: 'span' }),\n subText: slot.optional(props.subText, { elementType: 'span' }),\n };\n useCharacterSearch(state, innerRef);\n return state;\n};\n\n/**\n * MenuSplitGroup needs to apply extra styles when its main item is in multiline layout mode\n * Notify the parent MenuSplitGroup so that it can handle this case\n */\nconst useNotifySplitItemMultiline = (options: { hasSubmenu: boolean; multiline: boolean }) => {\n const { hasSubmenu, multiline } = options;\n const isSplitItemTrigger = useIsInMenuSplitGroup() && hasSubmenu;\n\n const { setMultiline } = useMenuSplitGroupContext_unstable();\n\n useIsomorphicLayoutEffect(() => {\n if (!isSplitItemTrigger) {\n setMultiline(multiline);\n }\n }, [setMultiline, multiline, isSplitItemTrigger]);\n};\n\nconst useIconAndCheckmarkAlignment = (options: { hasSubmenu: boolean }) => {\n const { hasSubmenu } = options;\n const hasIcons = useMenuListContext_unstable(context => context.hasIcons);\n const hasCheckmarks = useMenuListContext_unstable(context => context.hasCheckmarks);\n const isSplitItemTrigger = useIsInMenuSplitGroup() && hasSubmenu;\n\n return {\n hasIcons: hasIcons && !isSplitItemTrigger,\n hasCheckmarks: hasCheckmarks && !isSplitItemTrigger,\n };\n};\n\nconst getValidateNestingComponentName = (role?: string) => {\n switch (role) {\n case 'menuitemcheckbox':\n return 'MenuItemCheckbox';\n case 'menuitemradio':\n return 'MenuItemRadio';\n }\n return 'MenuItem';\n};\n"],"names":["React","useEventCallback","useMergedRefs","getIntrinsicElementProps","slot","useIsomorphicLayoutEffect","useCharacterSearch","useMenuTriggerContext_unstable","useMenuListContext_unstable","useMenuContext_unstable","useARIAButtonProps","Enter","Space","useIsInMenuSplitGroup","useMenuSplitGroupContext_unstable","useValidateNesting","useMenuItemBase_unstable","props","ref","isSubmenuTrigger","persistOnClickContext","context","persistOnItemClick","as","disabled","hasSubmenu","persistOnClick","content","_content","rest","hasIcons","hasCheckmarks","useIconAndCheckmarkAlignment","setOpen","open","useNotifySplitItemMultiline","multiline","subText","innerRef","useRef","dismissedWithKeyboardRef","validateNestingRef","getValidateNestingComponentName","role","state","submenuOpen","components","root","icon","checkmark","submenuIndicator","secondaryContent","always","disabledFocusable","onKeyDown","event","isDefaultPrevented","key","current","onMouseMove","currentTarget","ownerDocument","activeElement","focus","onClick","keyboard","bubble","type","elementType","optional","renderByDefault","children","defaultProps","options","isSplitItemTrigger","setMultiline"],"mappings":"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"}
|
|
@@ -14,9 +14,10 @@ export const menuItemClassNames = {
|
|
|
14
14
|
secondaryContent: 'fui-MenuItem__secondaryContent',
|
|
15
15
|
subText: 'fui-MenuItem__subText'
|
|
16
16
|
};
|
|
17
|
-
const
|
|
18
|
-
|
|
19
|
-
|
|
17
|
+
const slotsSelector = `& .${menuItemClassNames.icon}, & .${menuItemClassNames.checkmark}, & .${menuItemClassNames.subText}, & .${menuItemClassNames.secondaryContent}`;
|
|
18
|
+
const useRootBaseStyles = /*#__PURE__*/__resetStyles("r1rl95jx", "r11uab2l", {
|
|
19
|
+
r: [".r1rl95jx{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-right:var(--spacingVerticalSNudge);padding-left:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}", ".r1rl95jx:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}", ".r1rl95jx:hover .fui-Icon-filled{display:inline;}", ".r1rl95jx:hover .fui-Icon-regular{display:none;}", ".r1rl95jx:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".r1rl95jx:hover .fui-MenuItem__subText{color:var(--colorNeutralForeground3Hover);}", ".r1rl95jx:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}", ".r1rl95jx:hover:active .fui-MenuItem__subText{color:var(--colorNeutralForeground3Pressed);}", ".r1rl95jx:focus{outline-style:none;}", ".r1rl95jx:focus-visible{outline-style:none;}", ".r1rl95jx[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}", ".r1rl95jx[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}", ".r11uab2l{border-radius:var(--borderRadiusMedium);position:relative;color:var(--colorNeutralForeground2);background-color:var(--colorNeutralBackground1);padding-left:var(--spacingVerticalSNudge);padding-right:var(--spacingVerticalSNudge);padding-top:var(--spacingVerticalSNudge);padding-bottom:var(--spacingVerticalSNudge);box-sizing:border-box;max-width:290px;min-height:32px;flex-shrink:0;display:flex;align-items:start;font-size:var(--fontSizeBase300);cursor:pointer;gap:4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;}", ".r11uab2l:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground2Hover);}", ".r11uab2l:hover .fui-Icon-filled{display:inline;}", ".r11uab2l:hover .fui-Icon-regular{display:none;}", ".r11uab2l:hover .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".r11uab2l:hover .fui-MenuItem__subText{color:var(--colorNeutralForeground3Hover);}", ".r11uab2l:hover:active{background-color:var(--colorNeutralBackground1Pressed);color:var(--colorNeutralForeground2Pressed);}", ".r11uab2l:hover:active .fui-MenuItem__subText{color:var(--colorNeutralForeground3Pressed);}", ".r11uab2l:focus{outline-style:none;}", ".r11uab2l:focus-visible{outline-style:none;}", ".r11uab2l[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}", ".r11uab2l[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"],
|
|
20
|
+
s: ["@media (forced-colors: active){.r1rl95jx:hover{forced-color-adjust:none;background-color:Highlight;color:HighlightText;}.r1rl95jx:hover .fui-MenuItem__icon,.r1rl95jx:hover .fui-MenuItem__checkmark,.r1rl95jx:hover .fui-MenuItem__subText,.r1rl95jx:hover .fui-MenuItem__secondaryContent{color:HighlightText;}.r1rl95jx:focus{outline-style:none;}.r1rl95jx:focus-visible{outline-style:none;}.r1rl95jx[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}@media (forced-colors: active){.r1rl95jx[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}.r1rl95jx[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid Highlight;border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}}", "@media (forced-colors: active){.r1rl95jx[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}", "@media (forced-colors: active){.r11uab2l:hover{forced-color-adjust:none;background-color:Highlight;color:HighlightText;}.r11uab2l:hover .fui-MenuItem__icon,.r11uab2l:hover .fui-MenuItem__checkmark,.r11uab2l:hover .fui-MenuItem__subText,.r11uab2l:hover .fui-MenuItem__secondaryContent{color:HighlightText;}.r11uab2l:focus{outline-style:none;}.r11uab2l:focus-visible{outline-style:none;}.r11uab2l[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}@media (forced-colors: active){.r11uab2l[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}.r11uab2l[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid Highlight;border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}}", "@media (forced-colors: active){.r11uab2l[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"]
|
|
20
21
|
});
|
|
21
22
|
const useContentBaseStyles = /*#__PURE__*/__resetStyles("r1ls86vo", "rpbc5dr", [".r1ls86vo{padding-left:2px;padding-right:2px;background-color:transparent;flex-grow:1;}", ".rpbc5dr{padding-right:2px;padding-left:2px;background-color:transparent;flex-grow:1;}"]);
|
|
22
23
|
const useSecondaryContentBaseStyles = /*#__PURE__*/__resetStyles("r12mwwux", "r1ewgu5j", [".r12mwwux{padding-left:2px;padding-right:2px;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground3);}", ".r12mwwux:hover{color:var(--colorNeutralForeground3Hover);}", ".r12mwwux:focus{color:var(--colorNeutralForeground3Hover);}", ".r1ewgu5j{padding-right:2px;padding-left:2px;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);color:var(--colorNeutralForeground3);}", ".r1ewgu5j:hover{color:var(--colorNeutralForeground3Hover);}", ".r1ewgu5j:focus{color:var(--colorNeutralForeground3Hover);}"]);
|
|
@@ -46,8 +47,10 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
46
47
|
t6yez3: "f15q0o9g",
|
|
47
48
|
B3y4be1: "f17gqod3",
|
|
48
49
|
B2i6fwv: "f15ms52v",
|
|
49
|
-
|
|
50
|
-
|
|
50
|
+
B8gzw0y: "f1h3a8gf",
|
|
51
|
+
By8wz76: "f1nz3ub2",
|
|
52
|
+
B7iucu3: "fqc85l4",
|
|
53
|
+
uq8m91: "fpfrpmp"
|
|
51
54
|
},
|
|
52
55
|
disabled: {
|
|
53
56
|
sj55zd: "f1s2aq7o",
|
|
@@ -63,11 +66,12 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
63
66
|
Bumww26: "fszh5vc",
|
|
64
67
|
t0hwav: "ft33916",
|
|
65
68
|
B7iucu3: "f1cyfu5x",
|
|
69
|
+
fmph8g: "fh9egdi",
|
|
66
70
|
Bahaeuw: "fa9u7a5",
|
|
67
71
|
Bbkh6qg: "f1wzezsb",
|
|
68
72
|
B3ejlan: "f1egomlm",
|
|
69
73
|
B41git9: "f1wf2001",
|
|
70
|
-
|
|
74
|
+
Iiu1i: "fhjxdyw",
|
|
71
75
|
Dcq74g: "f1efp33f",
|
|
72
76
|
rxnm8d: "f1m2zpi7",
|
|
73
77
|
wxluhh: "fei14nx",
|
|
@@ -76,12 +80,18 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
76
80
|
}
|
|
77
81
|
}, {
|
|
78
82
|
d: [".fmnzpld{margin-top:2px;}", ".fqerorx{flex-grow:1;}", ".f1ozlkrg{border-top-left-radius:0;}", ".f10ostut{border-top-right-radius:0;}", ".f1deotkl{border-bottom-left-radius:0;}", ".f1krrbdw{border-bottom-right-radius:0;}", ".f1cnd47f{padding-left:0;}", ".fhxju0i{padding-right:0;}", ".f1wl9k8s::before{content:\"\";}", ".f1yn80uh::before{width:var(--strokeWidthThin);}", ".f68mna0::before{height:24px;}", ".f1p5zmk::before{background-color:var(--colorNeutralStroke1);}", ".f5gciec{background-color:var(--colorNeutralBackground1Hover);}", ".fmh2wxz{color:var(--colorNeutralForeground2Hover);}", ".fxoiby5 .fui-Icon-filled{display:inline;}", ".f15q0o9g .fui-Icon-regular{display:none;}", ".f17gqod3 .fui-MenuItem__icon{color:var(--colorNeutralForeground2BrandSelected);}", ".f15ms52v .fui-MenuItem__subText{color:var(--colorNeutralForeground3Hover);}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}"],
|
|
79
|
-
m: [["@media (forced-colors: active){.
|
|
83
|
+
m: [["@media (forced-colors: active){.f1h3a8gf{forced-color-adjust:none;}}", {
|
|
80
84
|
m: "(forced-colors: active)"
|
|
81
|
-
}], ["@media (forced-colors: active){.
|
|
85
|
+
}], ["@media (forced-colors: active){.f1nz3ub2{background-color:Highlight;}}", {
|
|
86
|
+
m: "(forced-colors: active)"
|
|
87
|
+
}], ["@media (forced-colors: active){.fqc85l4{color:HighlightText;}}", {
|
|
88
|
+
m: "(forced-colors: active)"
|
|
89
|
+
}], ["@media (forced-colors: active){.fpfrpmp .fui-MenuItem__icon,.fpfrpmp .fui-MenuItem__checkmark,.fpfrpmp .fui-MenuItem__subText,.fpfrpmp .fui-MenuItem__secondaryContent{color:HighlightText;}}", {
|
|
82
90
|
m: "(forced-colors: active)"
|
|
83
91
|
}], ["@media (forced-colors: active){.f1cyfu5x{color:GrayText;}}", {
|
|
84
92
|
m: "(forced-colors: active)"
|
|
93
|
+
}], ["@media (forced-colors: active){.fh9egdi:hover{forced-color-adjust:auto;}}", {
|
|
94
|
+
m: "(forced-colors: active)"
|
|
85
95
|
}], ["@media (forced-colors: active){.fa9u7a5:hover{color:GrayText;}}", {
|
|
86
96
|
m: "(forced-colors: active)"
|
|
87
97
|
}], ["@media (forced-colors: active){.f1wzezsb:hover{background-color:Canvas;}}", {
|
|
@@ -90,7 +100,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
90
100
|
m: "(forced-colors: active)"
|
|
91
101
|
}], ["@media (forced-colors: active){.f1wf2001:hover .fui-MenuItem__icon{background-color:Canvas;}}", {
|
|
92
102
|
m: "(forced-colors: active)"
|
|
93
|
-
}], ["@media (forced-colors: active){.
|
|
103
|
+
}], ["@media (forced-colors: active){.fhjxdyw:hover .fui-MenuItem__icon,.fhjxdyw:hover .fui-MenuItem__checkmark,.fhjxdyw:hover .fui-MenuItem__subText,.fhjxdyw:hover .fui-MenuItem__secondaryContent{color:GrayText;}}", {
|
|
94
104
|
m: "(forced-colors: active)"
|
|
95
105
|
}], ["@media (forced-colors: active){.f1efp33f:hover:active{color:GrayText;}}", {
|
|
96
106
|
m: "(forced-colors: active)"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mergeClasses","__styles","__resetStyles","iconFilledClassName","iconRegularClassName","createFocusOutlineStyle","tokens","typographyStyles","useCheckmarkStyles_unstable","menuItemClassNames","root","icon","checkmark","submenuIndicator","content","secondaryContent","subText","useRootBaseStyles","r","s","useContentBaseStyles","useSecondaryContentBaseStyles","useIconBaseStyles","useSubmenuIndicatorBaseStyles","useSubtextBaseStyles","useStyles","B6of3ja","splitItemMain","Bh6795r","splitItemTrigger","Btl43ni","Beyfa6y","uwmqm3","Ftih45","Ccq8qp","Baz25je","cmx5o7","submenuOpen","De3pzq","sj55zd","D0sxk3","t6yez3","B3y4be1","B2i6fwv","By8wz76","B7iucu3","disabled","Bi91k9c","Jwef8y","eoavqd","Bk3fhr4","Bmfj8id","Bg7n49j","c7f7en","B2d53fq","iro3zm","Bumww26","t0hwav","Bahaeuw","Bbkh6qg","B3ejlan","B41git9","Boq1n10","Dcq74g","rxnm8d","wxluhh","idgcvv","j9xr24","d","m","h","f","useSubTextStyles","useMultilineStyles","mc9l5x","Beiy3e4","qb2dma","useMenuItemStyles_unstable","state","styles","rootBaseStyles","contentBaseStyles","secondaryContentBaseStyles","iconBaseStyles","submenuIndicatorBaseStyles","multilineStyles","subtextBaseStyles","subTextStyles","multiline","className"],"sources":["useMenuItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles, makeResetStyles } from \"@griffel/react\";\nimport { iconFilledClassName, iconRegularClassName } from \"@fluentui/react-icons\";\nimport { createFocusOutlineStyle } from \"@fluentui/react-tabster\";\nimport { tokens, typographyStyles } from \"@fluentui/react-theme\";\nimport { useCheckmarkStyles_unstable } from \"../../selectable/index.js\";\nexport const menuItemClassNames = {\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 subText: 'fui-MenuItem__subText'\n};\nconst useRootBaseStyles = makeResetStyles({\n borderRadius: tokens.borderRadiusMedium,\n position: 'relative',\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackground1,\n paddingRight: tokens.spacingVerticalSNudge,\n paddingLeft: tokens.spacingVerticalSNudge,\n paddingTop: tokens.spacingVerticalSNudge,\n paddingBottom: tokens.spacingVerticalSNudge,\n boxSizing: 'border-box',\n maxWidth: '290px',\n minHeight: '32px',\n flexShrink: 0,\n display: 'flex',\n alignItems: 'start',\n fontSize: tokens.fontSizeBase300,\n cursor: 'pointer',\n gap: '4px',\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n color: tokens.colorNeutralForeground2Hover,\n [`& .${iconFilledClassName}`]: {\n display: 'inline'\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none'\n },\n [`& .${menuItemClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2BrandSelected\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Hover\n }\n },\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n color: tokens.colorNeutralForeground2Pressed,\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Pressed\n }\n },\n // High contrast styles\n '@media (forced-colors: active)': {\n ':hover': {\n backgroundColor: 'Canvas',\n borderColor: 'Highlight',\n color: 'Highlight'\n },\n ...createFocusOutlineStyle({\n style: {\n outlineColor: 'Highlight'\n }\n })\n },\n userSelect: 'none',\n ...createFocusOutlineStyle()\n});\nconst useContentBaseStyles = makeResetStyles({\n paddingLeft: '2px',\n paddingRight: '2px',\n backgroundColor: 'transparent',\n flexGrow: 1\n});\nconst useSecondaryContentBaseStyles = makeResetStyles({\n paddingLeft: '2px',\n paddingRight: '2px',\n ...typographyStyles.caption1,\n lineHeight: tokens.lineHeightBase300,\n color: tokens.colorNeutralForeground3,\n ':hover': {\n color: tokens.colorNeutralForeground3Hover\n },\n ':focus': {\n color: tokens.colorNeutralForeground3Hover\n }\n});\nconst useIconBaseStyles = makeResetStyles({\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n flexShrink: 0\n});\nconst useSubmenuIndicatorBaseStyles = makeResetStyles({\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center'\n});\nconst useSubtextBaseStyles = makeResetStyles({\n ...typographyStyles.caption2,\n color: tokens.colorNeutralForeground3\n});\nconst useStyles = makeStyles({\n checkmark: {\n marginTop: '2px'\n },\n splitItemMain: {\n flexGrow: 1\n },\n splitItemTrigger: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n '::before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '24px',\n backgroundColor: tokens.colorNeutralStroke1\n }\n },\n submenuOpen: {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n color: tokens.colorNeutralForeground2Hover,\n [`& .${iconFilledClassName}`]: {\n display: 'inline'\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none'\n },\n [`& .${menuItemClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2BrandSelected\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Hover\n },\n '@media (forced-colors: active)': {\n backgroundColor: 'Canvas',\n color: 'Highlight'\n }\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n ':hover': {\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackground1,\n cursor: 'not-allowed',\n [`& .${iconFilledClassName}`]: {\n display: 'none'\n },\n [`& .${iconRegularClassName}`]: {\n display: 'inline'\n },\n [`& .${menuItemClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForegroundDisabled\n }\n },\n ':hover:active': {\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackground1,\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForegroundDisabled\n }\n },\n ':focus': {\n color: tokens.colorNeutralForegroundDisabled\n },\n '@media (forced-colors: active)': {\n color: 'GrayText',\n ':hover': {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n [`& .${menuItemClassNames.icon}`]: {\n color: 'GrayText',\n backgroundColor: 'Canvas'\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: 'GrayText'\n }\n },\n ':hover:active': {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n [`& .${menuItemClassNames.subText}`]: {\n color: 'GrayText'\n }\n },\n ':focus': {\n color: 'GrayText',\n backgroundColor: 'Canvas'\n }\n }\n }\n});\nconst useSubTextStyles = makeStyles({\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n '@media (forced-colors: active)': {\n color: 'GrayText'\n }\n }\n});\nconst useMultilineStyles = makeStyles({\n content: {\n display: 'flex',\n flexDirection: 'column'\n },\n secondaryContent: {\n alignSelf: 'center'\n },\n submenuIndicator: {\n alignSelf: 'center'\n }\n});\n/** Applies style classnames to slots */ export const useMenuItemStyles_unstable = (state)=>{\n const styles = useStyles();\n const rootBaseStyles = useRootBaseStyles();\n const contentBaseStyles = useContentBaseStyles();\n const secondaryContentBaseStyles = useSecondaryContentBaseStyles();\n const iconBaseStyles = useIconBaseStyles();\n const submenuIndicatorBaseStyles = useSubmenuIndicatorBaseStyles();\n const multilineStyles = useMultilineStyles();\n const subtextBaseStyles = useSubtextBaseStyles();\n const subTextStyles = useSubTextStyles();\n const multiline = !!state.subText;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemClassNames.root, rootBaseStyles, state.submenuOpen && styles.submenuOpen, state.disabled && styles.disabled, state.root.className);\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemClassNames.content, contentBaseStyles, state.content.className, multiline && multilineStyles.content);\n }\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, styles.checkmark, state.checkmark.className);\n }\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(menuItemClassNames.secondaryContent, secondaryContentBaseStyles, state.disabled && styles.disabled, state.secondaryContent.className, multiline && multilineStyles.secondaryContent);\n }\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemClassNames.icon, iconBaseStyles, state.icon.className);\n }\n if (state.submenuIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.submenuIndicator.className = mergeClasses(menuItemClassNames.submenuIndicator, submenuIndicatorBaseStyles, state.submenuIndicator.className, multiline && multilineStyles.submenuIndicator);\n }\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemClassNames.subText, state.disabled && subTextStyles.disabled, state.subText.className, subtextBaseStyles);\n }\n useCheckmarkStyles_unstable(state);\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["mergeClasses","__styles","__resetStyles","iconFilledClassName","iconRegularClassName","createFocusOutlineStyle","tokens","typographyStyles","useCheckmarkStyles_unstable","menuItemClassNames","root","icon","checkmark","submenuIndicator","content","secondaryContent","subText","slotsSelector","useRootBaseStyles","r","s","useContentBaseStyles","useSecondaryContentBaseStyles","useIconBaseStyles","useSubmenuIndicatorBaseStyles","useSubtextBaseStyles","useStyles","B6of3ja","splitItemMain","Bh6795r","splitItemTrigger","Btl43ni","Beyfa6y","uwmqm3","Ftih45","Ccq8qp","Baz25je","cmx5o7","submenuOpen","De3pzq","sj55zd","D0sxk3","t6yez3","B3y4be1","B2i6fwv","B8gzw0y","By8wz76","B7iucu3","uq8m91","disabled","Bi91k9c","Jwef8y","eoavqd","Bk3fhr4","Bmfj8id","Bg7n49j","c7f7en","B2d53fq","iro3zm","Bumww26","t0hwav","fmph8g","Bahaeuw","Bbkh6qg","B3ejlan","B41git9","Iiu1i","Dcq74g","rxnm8d","wxluhh","idgcvv","j9xr24","d","m","h","f","useSubTextStyles","useMultilineStyles","mc9l5x","Beiy3e4","qb2dma","useMenuItemStyles_unstable","state","styles","rootBaseStyles","contentBaseStyles","secondaryContentBaseStyles","iconBaseStyles","submenuIndicatorBaseStyles","multilineStyles","subtextBaseStyles","subTextStyles","multiline","className"],"sources":["useMenuItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles, makeResetStyles } from \"@griffel/react\";\nimport { iconFilledClassName, iconRegularClassName } from \"@fluentui/react-icons\";\nimport { createFocusOutlineStyle } from \"@fluentui/react-tabster\";\nimport { tokens, typographyStyles } from \"@fluentui/react-theme\";\nimport { useCheckmarkStyles_unstable } from \"../../selectable/index.js\";\nexport const menuItemClassNames = {\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 subText: 'fui-MenuItem__subText'\n};\nconst slotsSelector = `& .${menuItemClassNames.icon}, & .${menuItemClassNames.checkmark}, & .${menuItemClassNames.subText}, & .${menuItemClassNames.secondaryContent}`;\nconst useRootBaseStyles = makeResetStyles({\n borderRadius: tokens.borderRadiusMedium,\n position: 'relative',\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackground1,\n paddingRight: tokens.spacingVerticalSNudge,\n paddingLeft: tokens.spacingVerticalSNudge,\n paddingTop: tokens.spacingVerticalSNudge,\n paddingBottom: tokens.spacingVerticalSNudge,\n boxSizing: 'border-box',\n maxWidth: '290px',\n minHeight: '32px',\n flexShrink: 0,\n display: 'flex',\n alignItems: 'start',\n fontSize: tokens.fontSizeBase300,\n cursor: 'pointer',\n gap: '4px',\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n color: tokens.colorNeutralForeground2Hover,\n [`& .${iconFilledClassName}`]: {\n display: 'inline'\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none'\n },\n [`& .${menuItemClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2BrandSelected\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Hover\n }\n },\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n color: tokens.colorNeutralForeground2Pressed,\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Pressed\n }\n },\n // High contrast styles\n '@media (forced-colors: active)': {\n ':hover': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n [slotsSelector]: {\n color: 'HighlightText'\n }\n },\n ...createFocusOutlineStyle({\n style: {\n outlineColor: 'Highlight'\n }\n })\n },\n userSelect: 'none',\n ...createFocusOutlineStyle()\n});\nconst useContentBaseStyles = makeResetStyles({\n paddingLeft: '2px',\n paddingRight: '2px',\n backgroundColor: 'transparent',\n flexGrow: 1\n});\nconst useSecondaryContentBaseStyles = makeResetStyles({\n paddingLeft: '2px',\n paddingRight: '2px',\n ...typographyStyles.caption1,\n lineHeight: tokens.lineHeightBase300,\n color: tokens.colorNeutralForeground3,\n ':hover': {\n color: tokens.colorNeutralForeground3Hover\n },\n ':focus': {\n color: tokens.colorNeutralForeground3Hover\n }\n});\nconst useIconBaseStyles = makeResetStyles({\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n flexShrink: 0\n});\nconst useSubmenuIndicatorBaseStyles = makeResetStyles({\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center'\n});\nconst useSubtextBaseStyles = makeResetStyles({\n ...typographyStyles.caption2,\n color: tokens.colorNeutralForeground3\n});\nconst useStyles = makeStyles({\n checkmark: {\n marginTop: '2px'\n },\n splitItemMain: {\n flexGrow: 1\n },\n splitItemTrigger: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n '::before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '24px',\n backgroundColor: tokens.colorNeutralStroke1\n }\n },\n submenuOpen: {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n color: tokens.colorNeutralForeground2Hover,\n [`& .${iconFilledClassName}`]: {\n display: 'inline'\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none'\n },\n [`& .${menuItemClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2BrandSelected\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Hover\n },\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n [slotsSelector]: {\n color: 'HighlightText'\n }\n }\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n ':hover': {\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackground1,\n cursor: 'not-allowed',\n [`& .${iconFilledClassName}`]: {\n display: 'none'\n },\n [`& .${iconRegularClassName}`]: {\n display: 'inline'\n },\n [`& .${menuItemClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForegroundDisabled\n }\n },\n ':hover:active': {\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackground1,\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForegroundDisabled\n }\n },\n ':focus': {\n color: tokens.colorNeutralForegroundDisabled\n },\n '@media (forced-colors: active)': {\n color: 'GrayText',\n ':hover': {\n forcedColorAdjust: 'auto',\n color: 'GrayText',\n backgroundColor: 'Canvas',\n [`& .${menuItemClassNames.icon}`]: {\n color: 'GrayText',\n backgroundColor: 'Canvas'\n },\n [slotsSelector]: {\n color: 'GrayText'\n }\n },\n ':hover:active': {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n [`& .${menuItemClassNames.subText}`]: {\n color: 'GrayText'\n }\n },\n ':focus': {\n color: 'GrayText',\n backgroundColor: 'Canvas'\n }\n }\n }\n});\nconst useSubTextStyles = makeStyles({\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n '@media (forced-colors: active)': {\n color: 'GrayText'\n }\n }\n});\nconst useMultilineStyles = makeStyles({\n content: {\n display: 'flex',\n flexDirection: 'column'\n },\n secondaryContent: {\n alignSelf: 'center'\n },\n submenuIndicator: {\n alignSelf: 'center'\n }\n});\n/** Applies style classnames to slots */ export const useMenuItemStyles_unstable = (state)=>{\n const styles = useStyles();\n const rootBaseStyles = useRootBaseStyles();\n const contentBaseStyles = useContentBaseStyles();\n const secondaryContentBaseStyles = useSecondaryContentBaseStyles();\n const iconBaseStyles = useIconBaseStyles();\n const submenuIndicatorBaseStyles = useSubmenuIndicatorBaseStyles();\n const multilineStyles = useMultilineStyles();\n const subtextBaseStyles = useSubtextBaseStyles();\n const subTextStyles = useSubTextStyles();\n const multiline = !!state.subText;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemClassNames.root, rootBaseStyles, state.submenuOpen && styles.submenuOpen, state.disabled && styles.disabled, state.root.className);\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemClassNames.content, contentBaseStyles, state.content.className, multiline && multilineStyles.content);\n }\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, styles.checkmark, state.checkmark.className);\n }\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(menuItemClassNames.secondaryContent, secondaryContentBaseStyles, state.disabled && styles.disabled, state.secondaryContent.className, multiline && multilineStyles.secondaryContent);\n }\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemClassNames.icon, iconBaseStyles, state.icon.className);\n }\n if (state.submenuIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.submenuIndicator.className = mergeClasses(menuItemClassNames.submenuIndicator, submenuIndicatorBaseStyles, state.submenuIndicator.className, multiline && multilineStyles.submenuIndicator);\n }\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemClassNames.subText, state.disabled && subTextStyles.disabled, state.subText.className, subtextBaseStyles);\n }\n useCheckmarkStyles_unstable(state);\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -13,6 +13,7 @@ export const menuItemClassNames = {
|
|
|
13
13
|
secondaryContent: 'fui-MenuItem__secondaryContent',
|
|
14
14
|
subText: 'fui-MenuItem__subText'
|
|
15
15
|
};
|
|
16
|
+
const slotsSelector = `& .${menuItemClassNames.icon}, & .${menuItemClassNames.checkmark}, & .${menuItemClassNames.subText}, & .${menuItemClassNames.secondaryContent}`;
|
|
16
17
|
const useRootBaseStyles = makeResetStyles({
|
|
17
18
|
borderRadius: tokens.borderRadiusMedium,
|
|
18
19
|
position: 'relative',
|
|
@@ -57,9 +58,12 @@ const useRootBaseStyles = makeResetStyles({
|
|
|
57
58
|
// High contrast styles
|
|
58
59
|
'@media (forced-colors: active)': {
|
|
59
60
|
':hover': {
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
color: '
|
|
61
|
+
forcedColorAdjust: 'none',
|
|
62
|
+
backgroundColor: 'Highlight',
|
|
63
|
+
color: 'HighlightText',
|
|
64
|
+
[slotsSelector]: {
|
|
65
|
+
color: 'HighlightText'
|
|
66
|
+
}
|
|
63
67
|
},
|
|
64
68
|
...createFocusOutlineStyle({
|
|
65
69
|
style: {
|
|
@@ -146,8 +150,12 @@ const useStyles = makeStyles({
|
|
|
146
150
|
color: tokens.colorNeutralForeground3Hover
|
|
147
151
|
},
|
|
148
152
|
'@media (forced-colors: active)': {
|
|
149
|
-
|
|
150
|
-
|
|
153
|
+
forcedColorAdjust: 'none',
|
|
154
|
+
backgroundColor: 'Highlight',
|
|
155
|
+
color: 'HighlightText',
|
|
156
|
+
[slotsSelector]: {
|
|
157
|
+
color: 'HighlightText'
|
|
158
|
+
}
|
|
151
159
|
}
|
|
152
160
|
},
|
|
153
161
|
disabled: {
|
|
@@ -182,13 +190,14 @@ const useStyles = makeStyles({
|
|
|
182
190
|
'@media (forced-colors: active)': {
|
|
183
191
|
color: 'GrayText',
|
|
184
192
|
':hover': {
|
|
193
|
+
forcedColorAdjust: 'auto',
|
|
185
194
|
color: 'GrayText',
|
|
186
195
|
backgroundColor: 'Canvas',
|
|
187
196
|
[`& .${menuItemClassNames.icon}`]: {
|
|
188
197
|
color: 'GrayText',
|
|
189
198
|
backgroundColor: 'Canvas'
|
|
190
199
|
},
|
|
191
|
-
[
|
|
200
|
+
[slotsSelector]: {
|
|
192
201
|
color: 'GrayText'
|
|
193
202
|
}
|
|
194
203
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuItem/useMenuItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles, makeResetStyles } from '@griffel/react';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens, typographyStyles } 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 subText: 'fui-MenuItem__subText',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n borderRadius: tokens.borderRadiusMedium,\n position: 'relative',\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackground1,\n paddingRight: tokens.spacingVerticalSNudge, // 6px\n paddingLeft: tokens.spacingVerticalSNudge,\n paddingTop: tokens.spacingVerticalSNudge,\n paddingBottom: tokens.spacingVerticalSNudge,\n boxSizing: 'border-box',\n maxWidth: '290px',\n minHeight: '32px',\n flexShrink: 0,\n display: 'flex',\n alignItems: 'start',\n fontSize: tokens.fontSizeBase300,\n cursor: 'pointer',\n 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 [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Hover,\n },\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n color: tokens.colorNeutralForeground2Pressed,\n\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Pressed,\n },\n },\n\n // High contrast styles\n '@media (forced-colors: active)': {\n ':hover': {\n backgroundColor: 'Canvas',\n borderColor: 'Highlight',\n color: 'Highlight',\n },\n ...createFocusOutlineStyle({ style: { outlineColor: 'Highlight' } }),\n },\n\n userSelect: 'none',\n ...createFocusOutlineStyle(),\n});\n\nconst useContentBaseStyles = makeResetStyles({\n paddingLeft: '2px',\n paddingRight: '2px',\n backgroundColor: 'transparent',\n flexGrow: 1,\n});\n\nconst useSecondaryContentBaseStyles = makeResetStyles({\n paddingLeft: '2px',\n paddingRight: '2px',\n ...typographyStyles.caption1,\n lineHeight: tokens.lineHeightBase300,\n color: tokens.colorNeutralForeground3,\n ':hover': {\n color: tokens.colorNeutralForeground3Hover,\n },\n ':focus': {\n color: tokens.colorNeutralForeground3Hover,\n },\n});\n\nconst useIconBaseStyles = makeResetStyles({\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n flexShrink: 0,\n});\n\nconst useSubmenuIndicatorBaseStyles = makeResetStyles({\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n});\n\nconst useSubtextBaseStyles = makeResetStyles({\n ...typographyStyles.caption2,\n color: tokens.colorNeutralForeground3,\n});\n\nconst useStyles = makeStyles({\n checkmark: {\n marginTop: '2px',\n },\n\n splitItemMain: {\n flexGrow: 1,\n },\n\n splitItemTrigger: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n '::before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '24px',\n backgroundColor: tokens.colorNeutralStroke1,\n },\n },\n submenuOpen: {\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 [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Hover,\n },\n\n '@media (forced-colors: active)': {\n backgroundColor: 'Canvas',\n color: 'Highlight',\n },\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n ':hover': {\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackground1,\n cursor: 'not-allowed',\n [`& .${iconFilledClassName}`]: {\n display: 'none',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'inline',\n },\n [`& .${menuItemClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n\n ':hover:active': {\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackground1,\n\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n\n ':focus': {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n '@media (forced-colors: active)': {\n color: 'GrayText',\n ':hover': {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n [`& .${menuItemClassNames.icon}`]: {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: 'GrayText',\n },\n },\n ':hover:active': {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n [`& .${menuItemClassNames.subText}`]: {\n color: 'GrayText',\n },\n },\n ':focus': {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n },\n },\n },\n});\n\nconst useSubTextStyles = makeStyles({\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n\n '@media (forced-colors: active)': {\n color: 'GrayText',\n },\n },\n});\n\nconst useMultilineStyles = makeStyles({\n content: {\n display: 'flex',\n flexDirection: 'column',\n },\n\n secondaryContent: {\n alignSelf: 'center',\n },\n\n submenuIndicator: {\n alignSelf: 'center',\n },\n});\n\n/** Applies style classnames to slots */\nexport const useMenuItemStyles_unstable = (state: MenuItemState): MenuItemState => {\n const styles = useStyles();\n const rootBaseStyles = useRootBaseStyles();\n const contentBaseStyles = useContentBaseStyles();\n const secondaryContentBaseStyles = useSecondaryContentBaseStyles();\n const iconBaseStyles = useIconBaseStyles();\n const submenuIndicatorBaseStyles = useSubmenuIndicatorBaseStyles();\n const multilineStyles = useMultilineStyles();\n const subtextBaseStyles = useSubtextBaseStyles();\n const subTextStyles = useSubTextStyles();\n const multiline = !!state.subText;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n menuItemClassNames.root,\n rootBaseStyles,\n state.submenuOpen && styles.submenuOpen,\n state.disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(\n menuItemClassNames.content,\n contentBaseStyles,\n state.content.className,\n multiline && multilineStyles.content,\n );\n }\n\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, styles.checkmark, state.checkmark.className);\n }\n\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(\n menuItemClassNames.secondaryContent,\n secondaryContentBaseStyles,\n state.disabled && styles.disabled,\n state.secondaryContent.className,\n multiline && multilineStyles.secondaryContent,\n );\n }\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemClassNames.icon, iconBaseStyles, state.icon.className);\n }\n\n if (state.submenuIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.submenuIndicator.className = mergeClasses(\n menuItemClassNames.submenuIndicator,\n submenuIndicatorBaseStyles,\n state.submenuIndicator.className,\n multiline && multilineStyles.submenuIndicator,\n );\n }\n\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(\n menuItemClassNames.subText,\n state.disabled && subTextStyles.disabled,\n state.subText.className,\n subtextBaseStyles,\n );\n }\n\n useCheckmarkStyles_unstable(state as MenuItemCheckboxState);\n\n return state;\n};\n"],"names":["mergeClasses","makeStyles","makeResetStyles","iconFilledClassName","iconRegularClassName","createFocusOutlineStyle","tokens","typographyStyles","useCheckmarkStyles_unstable","menuItemClassNames","root","icon","checkmark","submenuIndicator","content","secondaryContent","subText","useRootBaseStyles","borderRadius","borderRadiusMedium","position","color","colorNeutralForeground2","backgroundColor","colorNeutralBackground1","paddingRight","spacingVerticalSNudge","paddingLeft","paddingTop","paddingBottom","boxSizing","maxWidth","minHeight","flexShrink","display","alignItems","fontSize","fontSizeBase300","cursor","gap","colorNeutralBackground1Hover","colorNeutralForeground2Hover","colorNeutralForeground2BrandSelected","colorNeutralForeground3Hover","colorNeutralBackground1Pressed","colorNeutralForeground2Pressed","colorNeutralForeground3Pressed","borderColor","style","outlineColor","userSelect","useContentBaseStyles","flexGrow","useSecondaryContentBaseStyles","caption1","lineHeight","lineHeightBase300","colorNeutralForeground3","useIconBaseStyles","width","height","justifyContent","useSubmenuIndicatorBaseStyles","useSubtextBaseStyles","caption2","useStyles","marginTop","splitItemMain","splitItemTrigger","borderTopLeftRadius","borderBottomLeftRadius","strokeWidthThin","colorNeutralStroke1","submenuOpen","disabled","colorNeutralForegroundDisabled","useSubTextStyles","useMultilineStyles","flexDirection","alignSelf","useMenuItemStyles_unstable","state","styles","rootBaseStyles","contentBaseStyles","secondaryContentBaseStyles","iconBaseStyles","submenuIndicatorBaseStyles","multilineStyles","subtextBaseStyles","subTextStyles","multiline","className"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItem/useMenuItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles, makeResetStyles } from '@griffel/react';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens, typographyStyles } 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 subText: 'fui-MenuItem__subText',\n};\n\nconst slotsSelector = `& .${menuItemClassNames.icon}, & .${menuItemClassNames.checkmark}, & .${menuItemClassNames.subText}, & .${menuItemClassNames.secondaryContent}`;\n\nconst useRootBaseStyles = makeResetStyles({\n borderRadius: tokens.borderRadiusMedium,\n position: 'relative',\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackground1,\n paddingRight: tokens.spacingVerticalSNudge, // 6px\n paddingLeft: tokens.spacingVerticalSNudge,\n paddingTop: tokens.spacingVerticalSNudge,\n paddingBottom: tokens.spacingVerticalSNudge,\n boxSizing: 'border-box',\n maxWidth: '290px',\n minHeight: '32px',\n flexShrink: 0,\n display: 'flex',\n alignItems: 'start',\n fontSize: tokens.fontSizeBase300,\n cursor: 'pointer',\n 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 [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Hover,\n },\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n color: tokens.colorNeutralForeground2Pressed,\n\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Pressed,\n },\n },\n\n // High contrast styles\n '@media (forced-colors: active)': {\n ':hover': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n\n [slotsSelector]: {\n color: 'HighlightText',\n },\n },\n ...createFocusOutlineStyle({ style: { outlineColor: 'Highlight' } }),\n },\n\n userSelect: 'none',\n ...createFocusOutlineStyle(),\n});\n\nconst useContentBaseStyles = makeResetStyles({\n paddingLeft: '2px',\n paddingRight: '2px',\n backgroundColor: 'transparent',\n flexGrow: 1,\n});\n\nconst useSecondaryContentBaseStyles = makeResetStyles({\n paddingLeft: '2px',\n paddingRight: '2px',\n ...typographyStyles.caption1,\n lineHeight: tokens.lineHeightBase300,\n color: tokens.colorNeutralForeground3,\n ':hover': {\n color: tokens.colorNeutralForeground3Hover,\n },\n ':focus': {\n color: tokens.colorNeutralForeground3Hover,\n },\n});\n\nconst useIconBaseStyles = makeResetStyles({\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n flexShrink: 0,\n});\n\nconst useSubmenuIndicatorBaseStyles = makeResetStyles({\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n});\n\nconst useSubtextBaseStyles = makeResetStyles({\n ...typographyStyles.caption2,\n color: tokens.colorNeutralForeground3,\n});\n\nconst useStyles = makeStyles({\n checkmark: {\n marginTop: '2px',\n },\n\n splitItemMain: {\n flexGrow: 1,\n },\n\n splitItemTrigger: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n '::before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '24px',\n backgroundColor: tokens.colorNeutralStroke1,\n },\n },\n submenuOpen: {\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 [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForeground3Hover,\n },\n\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n\n [slotsSelector]: {\n color: 'HighlightText',\n },\n },\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n ':hover': {\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackground1,\n cursor: 'not-allowed',\n [`& .${iconFilledClassName}`]: {\n display: 'none',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'inline',\n },\n [`& .${menuItemClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n\n ':hover:active': {\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackground1,\n\n [`& .${menuItemClassNames.subText}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n\n ':focus': {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n '@media (forced-colors: active)': {\n color: 'GrayText',\n ':hover': {\n forcedColorAdjust: 'auto',\n color: 'GrayText',\n backgroundColor: 'Canvas',\n [`& .${menuItemClassNames.icon}`]: {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n },\n [slotsSelector]: {\n color: 'GrayText',\n },\n },\n ':hover:active': {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n [`& .${menuItemClassNames.subText}`]: {\n color: 'GrayText',\n },\n },\n ':focus': {\n color: 'GrayText',\n backgroundColor: 'Canvas',\n },\n },\n },\n});\n\nconst useSubTextStyles = makeStyles({\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n\n '@media (forced-colors: active)': {\n color: 'GrayText',\n },\n },\n});\n\nconst useMultilineStyles = makeStyles({\n content: {\n display: 'flex',\n flexDirection: 'column',\n },\n\n secondaryContent: {\n alignSelf: 'center',\n },\n\n submenuIndicator: {\n alignSelf: 'center',\n },\n});\n\n/** Applies style classnames to slots */\nexport const useMenuItemStyles_unstable = (state: MenuItemState): MenuItemState => {\n const styles = useStyles();\n const rootBaseStyles = useRootBaseStyles();\n const contentBaseStyles = useContentBaseStyles();\n const secondaryContentBaseStyles = useSecondaryContentBaseStyles();\n const iconBaseStyles = useIconBaseStyles();\n const submenuIndicatorBaseStyles = useSubmenuIndicatorBaseStyles();\n const multilineStyles = useMultilineStyles();\n const subtextBaseStyles = useSubtextBaseStyles();\n const subTextStyles = useSubTextStyles();\n const multiline = !!state.subText;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n menuItemClassNames.root,\n rootBaseStyles,\n state.submenuOpen && styles.submenuOpen,\n state.disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(\n menuItemClassNames.content,\n contentBaseStyles,\n state.content.className,\n multiline && multilineStyles.content,\n );\n }\n\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, styles.checkmark, state.checkmark.className);\n }\n\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(\n menuItemClassNames.secondaryContent,\n secondaryContentBaseStyles,\n state.disabled && styles.disabled,\n state.secondaryContent.className,\n multiline && multilineStyles.secondaryContent,\n );\n }\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemClassNames.icon, iconBaseStyles, state.icon.className);\n }\n\n if (state.submenuIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.submenuIndicator.className = mergeClasses(\n menuItemClassNames.submenuIndicator,\n submenuIndicatorBaseStyles,\n state.submenuIndicator.className,\n multiline && multilineStyles.submenuIndicator,\n );\n }\n\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(\n menuItemClassNames.subText,\n state.disabled && subTextStyles.disabled,\n state.subText.className,\n subtextBaseStyles,\n );\n }\n\n useCheckmarkStyles_unstable(state as MenuItemCheckboxState);\n\n return state;\n};\n"],"names":["mergeClasses","makeStyles","makeResetStyles","iconFilledClassName","iconRegularClassName","createFocusOutlineStyle","tokens","typographyStyles","useCheckmarkStyles_unstable","menuItemClassNames","root","icon","checkmark","submenuIndicator","content","secondaryContent","subText","slotsSelector","useRootBaseStyles","borderRadius","borderRadiusMedium","position","color","colorNeutralForeground2","backgroundColor","colorNeutralBackground1","paddingRight","spacingVerticalSNudge","paddingLeft","paddingTop","paddingBottom","boxSizing","maxWidth","minHeight","flexShrink","display","alignItems","fontSize","fontSizeBase300","cursor","gap","colorNeutralBackground1Hover","colorNeutralForeground2Hover","colorNeutralForeground2BrandSelected","colorNeutralForeground3Hover","colorNeutralBackground1Pressed","colorNeutralForeground2Pressed","colorNeutralForeground3Pressed","forcedColorAdjust","style","outlineColor","userSelect","useContentBaseStyles","flexGrow","useSecondaryContentBaseStyles","caption1","lineHeight","lineHeightBase300","colorNeutralForeground3","useIconBaseStyles","width","height","justifyContent","useSubmenuIndicatorBaseStyles","useSubtextBaseStyles","caption2","useStyles","marginTop","splitItemMain","splitItemTrigger","borderTopLeftRadius","borderBottomLeftRadius","strokeWidthThin","colorNeutralStroke1","submenuOpen","disabled","colorNeutralForegroundDisabled","useSubTextStyles","useMultilineStyles","flexDirection","alignSelf","useMenuItemStyles_unstable","state","styles","rootBaseStyles","contentBaseStyles","secondaryContentBaseStyles","iconBaseStyles","submenuIndicatorBaseStyles","multilineStyles","subtextBaseStyles","subTextStyles","multiline","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,EAAEC,UAAU,EAAEC,eAAe,QAAQ,iBAAiB;AAC3E,SAASC,mBAAmB,EAAEC,oBAAoB,QAAQ,wBAAwB;AAClF,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AACjE,SAASC,2BAA2B,QAAQ,4BAAyB;AAKrE,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,kBAAkB;IAClBC,SAAS;IACTC,kBAAkB;IAClBC,SAAS;AACX,EAAE;AAEF,MAAMC,gBAAgB,CAAC,GAAG,EAAER,mBAAmBE,IAAI,CAAC,KAAK,EAAEF,mBAAmBG,SAAS,CAAC,KAAK,EAAEH,mBAAmBO,OAAO,CAAC,KAAK,EAAEP,mBAAmBM,gBAAgB,EAAE;AAEtK,MAAMG,oBAAoBhB,gBAAgB;IACxCiB,cAAcb,OAAOc,kBAAkB;IACvCC,UAAU;IACVC,OAAOhB,OAAOiB,uBAAuB;IACrCC,iBAAiBlB,OAAOmB,uBAAuB;IAC/CC,cAAcpB,OAAOqB,qBAAqB;IAC1CC,aAAatB,OAAOqB,qBAAqB;IACzCE,YAAYvB,OAAOqB,qBAAqB;IACxCG,eAAexB,OAAOqB,qBAAqB;IAC3CI,WAAW;IACXC,UAAU;IACVC,WAAW;IACXC,YAAY;IACZC,SAAS;IACTC,YAAY;IACZC,UAAU/B,OAAOgC,eAAe;IAChCC,QAAQ;IACRC,KAAK;IAEL,UAAU;QACRhB,iBAAiBlB,OAAOmC,4BAA4B;QACpDnB,OAAOhB,OAAOoC,4BAA4B;QAE1C,CAAC,CAAC,GAAG,EAAEvC,qBAAqB,CAAC,EAAE;YAC7BgC,SAAS;QACX;QACA,CAAC,CAAC,GAAG,EAAE/B,sBAAsB,CAAC,EAAE;YAC9B+B,SAAS;QACX;QACA,CAAC,CAAC,GAAG,EAAE1B,mBAAmBE,IAAI,EAAE,CAAC,EAAE;YACjCW,OAAOhB,OAAOqC,oCAAoC;QACpD;QAEA,CAAC,CAAC,GAAG,EAAElC,mBAAmBO,OAAO,EAAE,CAAC,EAAE;YACpCM,OAAOhB,OAAOsC,4BAA4B;QAC5C;IACF;IAEA,iBAAiB;QACfpB,iBAAiBlB,OAAOuC,8BAA8B;QACtDvB,OAAOhB,OAAOwC,8BAA8B;QAE5C,CAAC,CAAC,GAAG,EAAErC,mBAAmBO,OAAO,EAAE,CAAC,EAAE;YACpCM,OAAOhB,OAAOyC,8BAA8B;QAC9C;IACF;IAEA,uBAAuB;IACvB,kCAAkC;QAChC,UAAU;YACRC,mBAAmB;YACnBxB,iBAAiB;YACjBF,OAAO;YAEP,CAACL,cAAc,EAAE;gBACfK,OAAO;YACT;QACF;QACA,GAAGjB,wBAAwB;YAAE4C,OAAO;gBAAEC,cAAc;YAAY;QAAE,EAAE;IACtE;IAEAC,YAAY;IACZ,GAAG9C,yBAAyB;AAC9B;AAEA,MAAM+C,uBAAuBlD,gBAAgB;IAC3C0B,aAAa;IACbF,cAAc;IACdF,iBAAiB;IACjB6B,UAAU;AACZ;AAEA,MAAMC,gCAAgCpD,gBAAgB;IACpD0B,aAAa;IACbF,cAAc;IACd,GAAGnB,iBAAiBgD,QAAQ;IAC5BC,YAAYlD,OAAOmD,iBAAiB;IACpCnC,OAAOhB,OAAOoD,uBAAuB;IACrC,UAAU;QACRpC,OAAOhB,OAAOsC,4BAA4B;IAC5C;IACA,UAAU;QACRtB,OAAOhB,OAAOsC,4BAA4B;IAC5C;AACF;AAEA,MAAMe,oBAAoBzD,gBAAgB;IACxC0D,OAAO;IACPC,QAAQ;IACRxB,UAAU;IACVmB,YAAY;IACZpB,YAAY;IACZD,SAAS;IACT2B,gBAAgB;IAChB5B,YAAY;AACd;AAEA,MAAM6B,gCAAgC7D,gBAAgB;IACpD0D,OAAO;IACPC,QAAQ;IACRxB,UAAU;IACVmB,YAAY;IACZpB,YAAY;IACZD,SAAS;IACT2B,gBAAgB;AAClB;AAEA,MAAME,uBAAuB9D,gBAAgB;IAC3C,GAAGK,iBAAiB0D,QAAQ;IAC5B3C,OAAOhB,OAAOoD,uBAAuB;AACvC;AAEA,MAAMQ,YAAYjE,WAAW;IAC3BW,WAAW;QACTuD,WAAW;IACb;IAEAC,eAAe;QACbf,UAAU;IACZ;IAEAgB,kBAAkB;QAChBC,qBAAqB;QACrBC,wBAAwB;QACxB3C,aAAa;QACb,YAAY;YACVd,SAAS;YACT8C,OAAOtD,OAAOkE,eAAe;YAC7BX,QAAQ;YACRrC,iBAAiBlB,OAAOmE,mBAAmB;QAC7C;IACF;IACAC,aAAa;QACXlD,iBAAiBlB,OAAOmC,4BAA4B;QACpDnB,OAAOhB,OAAOoC,4BAA4B;QAE1C,CAAC,CAAC,GAAG,EAAEvC,qBAAqB,CAAC,EAAE;YAC7BgC,SAAS;QACX;QACA,CAAC,CAAC,GAAG,EAAE/B,sBAAsB,CAAC,EAAE;YAC9B+B,SAAS;QACX;QACA,CAAC,CAAC,GAAG,EAAE1B,mBAAmBE,IAAI,EAAE,CAAC,EAAE;YACjCW,OAAOhB,OAAOqC,oCAAoC;QACpD;QAEA,CAAC,CAAC,GAAG,EAAElC,mBAAmBO,OAAO,EAAE,CAAC,EAAE;YACpCM,OAAOhB,OAAOsC,4BAA4B;QAC5C;QAEA,kCAAkC;YAChCI,mBAAmB;YACnBxB,iBAAiB;YACjBF,OAAO;YAEP,CAACL,cAAc,EAAE;gBACfK,OAAO;YACT;QACF;IACF;IACAqD,UAAU;QACRrD,OAAOhB,OAAOsE,8BAA8B;QAC5C,UAAU;YACRtD,OAAOhB,OAAOsE,8BAA8B;YAC5CpD,iBAAiBlB,OAAOmB,uBAAuB;YAC/Cc,QAAQ;YACR,CAAC,CAAC,GAAG,EAAEpC,qBAAqB,CAAC,EAAE;gBAC7BgC,SAAS;YACX;YACA,CAAC,CAAC,GAAG,EAAE/B,sBAAsB,CAAC,EAAE;gBAC9B+B,SAAS;YACX;YACA,CAAC,CAAC,GAAG,EAAE1B,mBAAmBE,IAAI,EAAE,CAAC,EAAE;gBACjCW,OAAOhB,OAAOsE,8BAA8B;YAC9C;YACA,CAAC,CAAC,GAAG,EAAEnE,mBAAmBO,OAAO,EAAE,CAAC,EAAE;gBACpCM,OAAOhB,OAAOsE,8BAA8B;YAC9C;QACF;QAEA,iBAAiB;YACftD,OAAOhB,OAAOsE,8BAA8B;YAC5CpD,iBAAiBlB,OAAOmB,uBAAuB;YAE/C,CAAC,CAAC,GAAG,EAAEhB,mBAAmBO,OAAO,EAAE,CAAC,EAAE;gBACpCM,OAAOhB,OAAOsE,8BAA8B;YAC9C;QACF;QAEA,UAAU;YACRtD,OAAOhB,OAAOsE,8BAA8B;QAC9C;QAEA,kCAAkC;YAChCtD,OAAO;YACP,UAAU;gBACR0B,mBAAmB;gBACnB1B,OAAO;gBACPE,iBAAiB;gBACjB,CAAC,CAAC,GAAG,EAAEf,mBAAmBE,IAAI,EAAE,CAAC,EAAE;oBACjCW,OAAO;oBACPE,iBAAiB;gBACnB;gBACA,CAACP,cAAc,EAAE;oBACfK,OAAO;gBACT;YACF;YACA,iBAAiB;gBACfA,OAAO;gBACPE,iBAAiB;gBACjB,CAAC,CAAC,GAAG,EAAEf,mBAAmBO,OAAO,EAAE,CAAC,EAAE;oBACpCM,OAAO;gBACT;YACF;YACA,UAAU;gBACRA,OAAO;gBACPE,iBAAiB;YACnB;QACF;IACF;AACF;AAEA,MAAMqD,mBAAmB5E,WAAW;IAClC0E,UAAU;QACRrD,OAAOhB,OAAOsE,8BAA8B;QAE5C,kCAAkC;YAChCtD,OAAO;QACT;IACF;AACF;AAEA,MAAMwD,qBAAqB7E,WAAW;IACpCa,SAAS;QACPqB,SAAS;QACT4C,eAAe;IACjB;IAEAhE,kBAAkB;QAChBiE,WAAW;IACb;IAEAnE,kBAAkB;QAChBmE,WAAW;IACb;AACF;AAEA,sCAAsC,GACtC,OAAO,MAAMC,6BAA6B,CAACC;IACzC,MAAMC,SAASjB;IACf,MAAMkB,iBAAiBlE;IACvB,MAAMmE,oBAAoBjC;IAC1B,MAAMkC,6BAA6BhC;IACnC,MAAMiC,iBAAiB5B;IACvB,MAAM6B,6BAA6BzB;IACnC,MAAM0B,kBAAkBX;IACxB,MAAMY,oBAAoB1B;IAC1B,MAAM2B,gBAAgBd;IACtB,MAAMe,YAAY,CAAC,CAACV,MAAMlE,OAAO;IACjC,oDAAoD;IACpDkE,MAAMxE,IAAI,CAACmF,SAAS,GAAG7F,aACrBS,mBAAmBC,IAAI,EACvB0E,gBACAF,MAAMR,WAAW,IAAIS,OAAOT,WAAW,EACvCQ,MAAMP,QAAQ,IAAIQ,OAAOR,QAAQ,EACjCO,MAAMxE,IAAI,CAACmF,SAAS;IAGtB,IAAIX,MAAMpE,OAAO,EAAE;QACjB,oDAAoD;QACpDoE,MAAMpE,OAAO,CAAC+E,SAAS,GAAG7F,aACxBS,mBAAmBK,OAAO,EAC1BuE,mBACAH,MAAMpE,OAAO,CAAC+E,SAAS,EACvBD,aAAaH,gBAAgB3E,OAAO;IAExC;IAEA,IAAIoE,MAAMtE,SAAS,EAAE;QACnB,oDAAoD;QACpDsE,MAAMtE,SAAS,CAACiF,SAAS,GAAG7F,aAAaS,mBAAmBG,SAAS,EAAEuE,OAAOvE,SAAS,EAAEsE,MAAMtE,SAAS,CAACiF,SAAS;IACpH;IAEA,IAAIX,MAAMnE,gBAAgB,EAAE;QAC1B,oDAAoD;QACpDmE,MAAMnE,gBAAgB,CAAC8E,SAAS,GAAG7F,aACjCS,mBAAmBM,gBAAgB,EACnCuE,4BACAJ,MAAMP,QAAQ,IAAIQ,OAAOR,QAAQ,EACjCO,MAAMnE,gBAAgB,CAAC8E,SAAS,EAChCD,aAAaH,gBAAgB1E,gBAAgB;IAEjD;IAEA,IAAImE,MAAMvE,IAAI,EAAE;QACd,oDAAoD;QACpDuE,MAAMvE,IAAI,CAACkF,SAAS,GAAG7F,aAAaS,mBAAmBE,IAAI,EAAE4E,gBAAgBL,MAAMvE,IAAI,CAACkF,SAAS;IACnG;IAEA,IAAIX,MAAMrE,gBAAgB,EAAE;QAC1B,oDAAoD;QACpDqE,MAAMrE,gBAAgB,CAACgF,SAAS,GAAG7F,aACjCS,mBAAmBI,gBAAgB,EACnC2E,4BACAN,MAAMrE,gBAAgB,CAACgF,SAAS,EAChCD,aAAaH,gBAAgB5E,gBAAgB;IAEjD;IAEA,IAAIqE,MAAMlE,OAAO,EAAE;QACjB,oDAAoD;QACpDkE,MAAMlE,OAAO,CAAC6E,SAAS,GAAG7F,aACxBS,mBAAmBO,OAAO,EAC1BkE,MAAMP,QAAQ,IAAIgB,cAAchB,QAAQ,EACxCO,MAAMlE,OAAO,CAAC6E,SAAS,EACvBH;IAEJ;IAEAlF,4BAA4B0E;IAE5B,OAAOA;AACT,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItemCheckbox/MenuItemCheckbox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuItemCheckbox_unstable } from './useMenuItemCheckbox';\nimport { renderMenuItemCheckbox_unstable } from './renderMenuItemCheckbox';\nimport { useMenuItemCheckboxStyles_unstable } from './useMenuItemCheckboxStyles.styles';\nimport type { MenuItemCheckboxProps } from './MenuItemCheckbox.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_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 useCustomStyleHook_unstable('useMenuItemCheckboxStyles_unstable')(state);\n\n return renderMenuItemCheckbox_unstable(state);\n});\n\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n"],"names":["React","useMenuItemCheckbox_unstable","renderMenuItemCheckbox_unstable","useMenuItemCheckboxStyles_unstable","useCustomStyleHook_unstable","MenuItemCheckbox","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,4BAA4B,QAAQ,2BAAwB;AACrE,SAASC,+BAA+B,QAAQ,8BAA2B;AAC3E,SAASC,kCAAkC,QAAQ,wCAAqC;AAGxF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,iCAA+DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACnG,MAAMC,QAAQR,6BAA6BM,OAAOC;IAElDL,mCAAmCM;IAEnCL,4BAA4B,sCAAsCK;IAElE,OAAOP,gCAAgCO;AACzC,GAAG;AAEHJ,iBAAiBK,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../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"],"names":[],"mappings":"AAKA,WAA4E"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItemCheckbox/index.ts"],"sourcesContent":["export type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox.types';\nexport { MenuItemCheckbox } from './MenuItemCheckbox';\nexport { renderMenuItemCheckbox_unstable } from './renderMenuItemCheckbox';\nexport { useMenuItemCheckbox_unstable, useMenuItemCheckboxBase_unstable } from './useMenuItemCheckbox';\nexport { menuItemCheckboxClassNames, useMenuItemCheckboxStyles_unstable } from './useMenuItemCheckboxStyles.styles';\n"],"names":["MenuItemCheckbox","renderMenuItemCheckbox_unstable","useMenuItemCheckbox_unstable","useMenuItemCheckboxBase_unstable","menuItemCheckboxClassNames","useMenuItemCheckboxStyles_unstable"],"mappings":"AACA,SAASA,gBAAgB,QAAQ,wBAAqB;AACtD,SAASC,+BAA+B,QAAQ,8BAA2B;AAC3E,SAASC,4BAA4B,EAAEC,gCAAgC,QAAQ,2BAAwB;AACvG,SAASC,0BAA0B,EAAEC,kCAAkC,QAAQ,wCAAqC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
import { assertSlots } from "@fluentui/react-utilities";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
2
|
+
import { assertSlots } from "@fluentui/react-utilities";
|
|
3
3
|
/** Function that renders the final JSX of the component */ export const renderMenuItemCheckbox_unstable = (state)=>{
|
|
4
4
|
assertSlots(state);
|
|
5
5
|
return /*#__PURE__*/ _jsxs(state.root, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItemCheckbox/renderMenuItemCheckbox.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { 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): JSXElement => {\n assertSlots<MenuItemSlots>(state);\n\n return (\n <state.root>\n {state.checkmark && <state.checkmark />}\n {state.icon && <state.icon />}\n {state.content && (\n <state.content>\n {state.content.children}\n {state.subText && <state.subText />}\n </state.content>\n )}\n {state.secondaryContent && <state.secondaryContent />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderMenuItemCheckbox_unstable","state","root","checkmark","icon","content","children","subText","secondaryContent"],"mappings":";AAAA,0BAA0B,GAC1B,iDAAiD,GACjD,SAASA,WAAW,QAAQ,4BAA4B;AAKxD,0DAA0D,GAC1D,OAAO,MAAMC,kCAAkC,CAACC;IAC9CF,YAA2BE;IAE3B,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAME,SAAS,kBAAI,KAACF,MAAME,SAAS;YACnCF,MAAMG,IAAI,kBAAI,KAACH,MAAMG,IAAI;YACzBH,MAAMI,OAAO,kBACZ,MAACJ,MAAMI,OAAO;;oBACXJ,MAAMI,OAAO,CAACC,QAAQ;oBACtBL,MAAMM,OAAO,kBAAI,KAACN,MAAMM,OAAO;;;YAGnCN,MAAMO,gBAAgB,kBAAI,KAACP,MAAMO,gBAAgB;;;AAGxD,EAAE"}
|
|
@@ -8,8 +8,7 @@ import { useMenuItemBase_unstable } from "../MenuItem/useMenuItemBase.js";
|
|
|
8
8
|
const state = useMenuItemCheckboxBase_unstable(props, ref);
|
|
9
9
|
// Set default checkmark icon
|
|
10
10
|
if (state.checkmark) {
|
|
11
|
-
var _state_checkmark;
|
|
12
|
-
var _children;
|
|
11
|
+
var _state_checkmark, _children;
|
|
13
12
|
(_children = (_state_checkmark = state.checkmark).children) !== null && _children !== void 0 ? _children : _state_checkmark.children = /*#__PURE__*/ React.createElement(Checkmark16Filled, null);
|
|
14
13
|
}
|
|
15
14
|
return state;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItemCheckbox/useMenuItemCheckbox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\nimport { Checkmark16Filled } from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuItemBase_unstable } from '../MenuItem/useMenuItemBase';\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 state = useMenuItemCheckboxBase_unstable(props, ref);\n\n // Set default checkmark icon\n if (state.checkmark) {\n state.checkmark.children ??= <Checkmark16Filled />;\n }\n\n return state;\n};\n\n/**\n * Base hook for MenuItemCheckbox component, produces state required to render the component\n */\nexport const useMenuItemCheckboxBase_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 ...useMenuItemBase_unstable(\n {\n role: 'menuitemcheckbox',\n persistOnClick: true,\n ...props,\n 'aria-checked': checked,\n checkmark: slot.optional(props.checkmark, {\n renderByDefault: true,\n elementType: 'span',\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"],"names":["React","slot","Checkmark16Filled","useMenuListContext_unstable","useMenuItemBase_unstable","useMenuItemCheckbox_unstable","props","ref","state","useMenuItemCheckboxBase_unstable","checkmark","children","toggleCheckbox","context","name","value","checked","checkedItems","checkedValues","indexOf","role","persistOnClick","optional","renderByDefault","elementType","onClick","e"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,4BAA4B;AACjD,SAASC,iBAAiB,QAAQ,wBAAwB;AAC1D,SAASC,2BAA2B,QAAQ,oCAAiC;AAC7E,SAASC,wBAAwB,QAAQ,iCAA8B;AAIvE,iEAAiE,GACjE,OAAO,MAAMC,+BAA+B,CAC1CC,OACAC;IAEA,MAAMC,QAAQC,iCAAiCH,OAAOC;IAEtD,6BAA6B;IAC7B,IAAIC,MAAME,SAAS,EAAE;YACnBF,kBAAAA;SAAAA,YAAAA,CAAAA,mBAAAA,MAAME,SAAS,EAACC,QAAQ,cAAxBH,uBAAAA,YAAAA,iBAAgBG,QAAQ,iBAAK,oBAACT;IAChC;IAEA,OAAOM;AACT,EAAE;AAEF;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAC9CH,OACAC;IAEA,MAAMK,iBAAiBT,4BAA4BU,CAAAA,UAAWA,QAAQD,cAAc;IACpF,MAAM,EAAEE,IAAI,EAAEC,KAAK,EAAE,GAAGT;IAExB,MAAMU,UAAUb,4BAA4BU,CAAAA;YACrBA;QAArB,MAAMI,eAAeJ,EAAAA,yBAAAA,QAAQK,aAAa,cAArBL,6CAAAA,sBAAuB,CAACC,KAAK,KAAI,EAAE;QACxD,OAAOG,aAAaE,OAAO,CAACJ,WAAW,CAAC;IAC1C;IAEA,MAAMP,QAA+B;QACnC,GAAGJ,yBACD;YACEgB,MAAM;YACNC,gBAAgB;YAChB,GAAGf,KAAK;YACR,gBAAgBU;YAChBN,WAAWT,KAAKqB,QAAQ,CAAChB,MAAMI,SAAS,EAAE;gBACxCa,iBAAiB;gBACjBC,aAAa;YACf;YACAC,SAAS,CAACC;oBAERpB;gBADAM,2BAAAA,qCAAAA,eAAiBc,GAAGZ,MAAMC,OAAOC;iBACjCV,iBAAAA,MAAMmB,OAAO,cAAbnB,qCAAAA,oBAAAA,OAAgBoB;YAClB;QACF,GACAnB,IACD;QACDO;QACAC;QACAC;IACF;IAEA,OAAOR;AACT,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItemCheckbox/useMenuItemCheckboxStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\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 subText: 'fui-MenuItemCheckbox__subText',\n};\n\nexport const useMenuItemCheckboxStyles_unstable = (state: MenuItemCheckboxState): MenuItemCheckboxState => {\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(menuItemCheckboxClassNames.root, state.root.className);\n\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(menuItemCheckboxClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n // eslint-disable-next-line react-hooks/immutability\n state.secondaryContent.className = mergeClasses(\n menuItemCheckboxClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(menuItemCheckboxClassNames.icon, state.icon.className);\n }\n\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(menuItemCheckboxClassNames.checkmark, state.checkmark.className);\n }\n\n if (state.subText) {\n // eslint-disable-next-line react-hooks/immutability\n state.subText.className = mergeClasses(menuItemCheckboxClassNames.subText, state.subText.className);\n }\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n\n return state;\n};\n"],"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemCheckboxClassNames","root","icon","checkmark","content","secondaryContent","subText","useMenuItemCheckboxStyles_unstable","state","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,2BAA2B,QAAQ,4BAAyB;AACrE,SAASC,0BAA0B,QAAQ,0CAAuC;AAKlF,OAAO,MAAMC,6BAAsF;IACjGC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,SAAS;IACTC,kBAAkB;IAClBC,SAAS;AACX,EAAE;AAEF,OAAO,MAAMC,qCAAqC,CAACC;IACjD,oDAAoD;IACpDA,MAAMP,IAAI,CAACQ,SAAS,GAAGZ,aAAaG,2BAA2BC,IAAI,EAAEO,MAAMP,IAAI,CAACQ,SAAS;IAEzF,IAAID,MAAMJ,OAAO,EAAE;QACjB,oDAAoD;QACpDI,MAAMJ,OAAO,CAACK,SAAS,GAAGZ,aAAaG,2BAA2BI,OAAO,EAAEI,MAAMJ,OAAO,CAACK,SAAS;IACpG;IAEA,IAAID,MAAMH,gBAAgB,EAAE;QAC1B,oDAAoD;QACpDG,MAAMH,gBAAgB,CAACI,SAAS,GAAGZ,aACjCG,2BAA2BK,gBAAgB,EAC3CG,MAAMH,gBAAgB,CAACI,SAAS;IAEpC;IAEA,IAAID,MAAMN,IAAI,EAAE;QACd,oDAAoD;QACpDM,MAAMN,IAAI,CAACO,SAAS,GAAGZ,aAAaG,2BAA2BE,IAAI,EAAEM,MAAMN,IAAI,CAACO,SAAS;IAC3F;IAEA,IAAID,MAAML,SAAS,EAAE;QACnB,oDAAoD;QACpDK,MAAML,SAAS,CAACM,SAAS,GAAGZ,aAAaG,2BAA2BG,SAAS,EAAEK,MAAML,SAAS,CAACM,SAAS;IAC1G;IAEA,IAAID,MAAMF,OAAO,EAAE;QACjB,oDAAoD;QACpDE,MAAMF,OAAO,CAACG,SAAS,GAAGZ,aAAaG,2BAA2BM,OAAO,EAAEE,MAAMF,OAAO,CAACG,SAAS;IACpG;IAEAV,2BAA2BS;IAC3BV,4BAA4BU;IAE5B,OAAOA;AACT,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItemLink/MenuItemLink.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuItemLink_unstable } from './useMenuItemLink';\nimport { renderMenuItemLink_unstable } from './renderMenuItemLink';\nimport { useMenuItemLinkStyles_unstable } from './useMenuItemLinkStyles.styles';\nimport type { MenuItemLinkProps } from './MenuItemLink.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * MenuItemLink component\n */\nexport const MenuItemLink: ForwardRefComponent<MenuItemLinkProps> = React.forwardRef((props, ref) => {\n const state = useMenuItemLink_unstable(props, ref);\n\n useMenuItemLinkStyles_unstable(state);\n\n useCustomStyleHook_unstable('useMenuItemLinkStyles_unstable')(state);\n\n return renderMenuItemLink_unstable(state);\n});\n\nMenuItemLink.displayName = 'MenuItemLink';\n"],"names":["React","useMenuItemLink_unstable","renderMenuItemLink_unstable","useMenuItemLinkStyles_unstable","useCustomStyleHook_unstable","MenuItemLink","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,uBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,0BAAuB;AACnE,SAASC,8BAA8B,QAAQ,oCAAiC;AAGhF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CL,+BAA+BM;IAE/BL,4BAA4B,kCAAkCK;IAE9D,OAAOP,4BAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItemLink/MenuItemLink.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { MenuItemProps, MenuItemSlots } from '../MenuItem/MenuItem.types';\n\nexport type MenuItemLinkSlots = {\n root: Slot<'a'>;\n} & Pick<MenuItemSlots, 'icon' | 'content' | 'secondaryContent' | 'checkmark'>;\n\n/**\n * MenuItemLink Props\n */\nexport type MenuItemLinkProps = ComponentProps<MenuItemLinkSlots> & Pick<MenuItemProps, 'disabled'> & { href: string };\n\n/**\n * State used in rendering MenuItemLink\n */\nexport type MenuItemLinkState = ComponentState<MenuItemLinkSlots>;\n"],"names":[],"mappings":"AAYA;;CAEC,GACD,WAAkE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuItemLink/index.ts"],"sourcesContent":["export { MenuItemLink } from './MenuItemLink';\nexport type { MenuItemLinkProps, MenuItemLinkSlots, MenuItemLinkState } from './MenuItemLink.types';\nexport { renderMenuItemLink_unstable } from './renderMenuItemLink';\nexport { useMenuItemLinkBase_unstable, useMenuItemLink_unstable } from './useMenuItemLink';\nexport { menuItemLinkClassNames, useMenuItemLinkStyles_unstable } from './useMenuItemLinkStyles.styles';\n"],"names":["MenuItemLink","renderMenuItemLink_unstable","useMenuItemLinkBase_unstable","useMenuItemLink_unstable","menuItemLinkClassNames","useMenuItemLinkStyles_unstable"],"mappings":"AAAA,SAASA,YAAY,QAAQ,oBAAiB;AAE9C,SAASC,2BAA2B,QAAQ,0BAAuB;AACnE,SAASC,4BAA4B,EAAEC,wBAAwB,QAAQ,uBAAoB;AAC3F,SAASC,sBAAsB,EAAEC,8BAA8B,QAAQ,oCAAiC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
import { assertSlots } from "@fluentui/react-utilities";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
2
|
+
import { assertSlots } from "@fluentui/react-utilities";
|
|
3
3
|
/**
|
|
4
4
|
* Render the final JSX of MenuItemLink
|
|
5
5
|
*/ export const renderMenuItemLink_unstable = (state)=>{
|