@fluentui/react-menu 0.0.0-nightly-20230321-0440.1 → 0.0.0-nightly-20230324-0422.1
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/.swcrc +30 -0
- package/CHANGELOG.json +116 -23
- package/CHANGELOG.md +36 -14
- package/lib/Menu.js.map +1 -1
- package/lib/MenuDivider.js.map +1 -1
- package/lib/MenuGroup.js.map +1 -1
- package/lib/MenuGroupHeader.js.map +1 -1
- package/lib/MenuItem.js.map +1 -1
- package/lib/MenuItemCheckbox.js.map +1 -1
- package/lib/MenuItemRadio.js.map +1 -1
- package/lib/MenuList.js.map +1 -1
- package/lib/MenuPopover.js.map +1 -1
- package/lib/MenuSplitGroup.js.map +1 -1
- package/lib/MenuTrigger.js.map +1 -1
- package/lib/components/Menu/Menu.js +1 -0
- package/lib/components/Menu/Menu.js.map +1 -1
- package/lib/components/Menu/Menu.types.js +1 -1
- package/lib/components/Menu/Menu.types.js.map +1 -1
- package/lib/components/Menu/index.js.map +1 -1
- package/lib/components/Menu/renderMenu.js.map +1 -1
- package/lib/components/Menu/useMenu.js +9 -8
- 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 +1 -3
- package/lib/components/MenuDivider/renderMenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/useMenuDivider.js +1 -0
- package/lib/components/MenuDivider/useMenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/useMenuDividerStyles.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 +1 -3
- package/lib/components/MenuGroup/renderMenuGroup.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroup.js +1 -0
- package/lib/components/MenuGroup/useMenuGroup.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroupContextValues.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
- package/lib/components/MenuGroupHeader/MenuGroupHeader.js.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 +1 -3
- package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeader.js +1 -0
- package/lib/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.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 +1 -13
- package/lib/components/MenuItem/renderMenuItem.js.map +1 -1
- package/lib/components/MenuItem/useCharacterSearch.js +3 -2
- package/lib/components/MenuItem/useCharacterSearch.js.map +1 -1
- package/lib/components/MenuItem/useMenuItem.js +7 -7
- package/lib/components/MenuItem/useMenuItem.js.map +1 -1
- package/lib/components/MenuItem/useMenuItemStyles.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 +1 -11
- package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.js +4 -4
- package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.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 +1 -11
- package/lib/components/MenuItemRadio/renderMenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadio.js +4 -4
- package/lib/components/MenuItemRadio/useMenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib/components/MenuList/MenuList.js.map +1 -1
- package/lib/components/MenuList/MenuList.types.js +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 +1 -3
- package/lib/components/MenuList/renderMenuList.js.map +1 -1
- package/lib/components/MenuList/useMenuList.js +6 -5
- package/lib/components/MenuList/useMenuList.js.map +1 -1
- package/lib/components/MenuList/useMenuListContextValues.js.map +1 -1
- package/lib/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib/components/MenuPopover/MenuPopover.js.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 -6
- package/lib/components/MenuPopover/renderMenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopover.js +4 -4
- package/lib/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopoverStyles.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 +1 -3
- package/lib/components/MenuSplitGroup/renderMenuSplitGroup.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroup.js +2 -2
- package/lib/components/MenuSplitGroup/useMenuSplitGroup.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
- package/lib/components/MenuTrigger/MenuTrigger.js +1 -0
- package/lib/components/MenuTrigger/MenuTrigger.js.map +1 -1
- package/lib/components/MenuTrigger/MenuTrigger.types.js +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.map +1 -1
- package/lib/components/index.js.map +1 -1
- package/lib/contexts/menuContext.js +1 -0
- package/lib/contexts/menuContext.js.map +1 -1
- package/lib/contexts/menuGroupContext.js +2 -4
- package/lib/contexts/menuGroupContext.js.map +1 -1
- package/lib/contexts/menuListContext.js +1 -0
- package/lib/contexts/menuListContext.js.map +1 -1
- package/lib/contexts/menuTriggerContext.js +2 -4
- package/lib/contexts/menuTriggerContext.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/selectable/index.js.map +1 -1
- package/lib/selectable/types.js +1 -1
- package/lib/selectable/types.js.map +1 -1
- package/lib/selectable/useCheckmarkStyles.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 +2 -2
- package/lib/utils/useOnMenuEnter.js.map +1 -1
- package/lib-commonjs/Menu.js +5 -4
- package/lib-commonjs/Menu.js.map +1 -1
- package/lib-commonjs/MenuDivider.js +5 -4
- package/lib-commonjs/MenuDivider.js.map +1 -1
- package/lib-commonjs/MenuGroup.js +5 -4
- package/lib-commonjs/MenuGroup.js.map +1 -1
- package/lib-commonjs/MenuGroupHeader.js +5 -4
- package/lib-commonjs/MenuGroupHeader.js.map +1 -1
- package/lib-commonjs/MenuItem.js +5 -4
- package/lib-commonjs/MenuItem.js.map +1 -1
- package/lib-commonjs/MenuItemCheckbox.js +5 -4
- package/lib-commonjs/MenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/MenuItemRadio.js +5 -4
- package/lib-commonjs/MenuItemRadio.js.map +1 -1
- package/lib-commonjs/MenuList.js +5 -4
- package/lib-commonjs/MenuList.js.map +1 -1
- package/lib-commonjs/MenuPopover.js +5 -4
- package/lib-commonjs/MenuPopover.js.map +1 -1
- package/lib-commonjs/MenuSplitGroup.js +5 -4
- package/lib-commonjs/MenuSplitGroup.js.map +1 -1
- package/lib-commonjs/MenuTrigger.js +5 -4
- package/lib-commonjs/MenuTrigger.js.map +1 -1
- package/lib-commonjs/components/Menu/Menu.js +16 -15
- package/lib-commonjs/components/Menu/Menu.js.map +1 -1
- package/lib-commonjs/components/Menu/Menu.types.js +5 -2
- package/lib-commonjs/components/Menu/Menu.types.js.map +1 -1
- package/lib-commonjs/components/Menu/index.js +9 -8
- package/lib-commonjs/components/Menu/index.js.map +1 -1
- package/lib-commonjs/components/Menu/renderMenu.js +14 -14
- package/lib-commonjs/components/Menu/renderMenu.js.map +1 -1
- package/lib-commonjs/components/Menu/useMenu.js +258 -256
- package/lib-commonjs/components/Menu/useMenu.js.map +1 -1
- package/lib-commonjs/components/Menu/useMenuContextValues.js +29 -43
- package/lib-commonjs/components/Menu/useMenuContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/MenuDivider.js +19 -20
- package/lib-commonjs/components/MenuDivider/MenuDivider.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/MenuDivider.types.js +3 -2
- package/lib-commonjs/components/MenuDivider/MenuDivider.types.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/index.js +9 -8
- package/lib-commonjs/components/MenuDivider/index.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/renderMenuDivider.js +13 -19
- package/lib-commonjs/components/MenuDivider/renderMenuDivider.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDivider.js +22 -21
- package/lib-commonjs/components/MenuDivider/useMenuDivider.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js +47 -25
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/MenuGroup.js +21 -22
- package/lib-commonjs/components/MenuGroup/MenuGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/MenuGroup.types.js +3 -2
- package/lib-commonjs/components/MenuGroup/MenuGroup.types.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/index.js +10 -9
- package/lib-commonjs/components/MenuGroup/index.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/renderMenuGroup.js +16 -22
- package/lib-commonjs/components/MenuGroup/renderMenuGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroup.js +23 -22
- package/lib-commonjs/components/MenuGroup/useMenuGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupContextValues.js +18 -15
- package/lib-commonjs/components/MenuGroup/useMenuGroupContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js +19 -11
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.js +19 -20
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.types.js +3 -2
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.types.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/index.js +9 -8
- package/lib-commonjs/components/MenuGroupHeader/index.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/renderMenuGroupHeader.js +13 -19
- package/lib-commonjs/components/MenuGroupHeader/renderMenuGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.js +22 -23
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +47 -25
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItem/MenuItem.js +19 -20
- package/lib-commonjs/components/MenuItem/MenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/MenuItem.types.js +3 -2
- package/lib-commonjs/components/MenuItem/MenuItem.types.js.map +1 -1
- package/lib-commonjs/components/MenuItem/index.js +9 -8
- package/lib-commonjs/components/MenuItem/index.js.map +1 -1
- package/lib-commonjs/components/MenuItem/renderMenuItem.js +13 -28
- package/lib-commonjs/components/MenuItem/renderMenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useCharacterSearch.js +24 -22
- package/lib-commonjs/components/MenuItem/useCharacterSearch.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItem.js +97 -104
- package/lib-commonjs/components/MenuItem/useMenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js +318 -150
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.js +19 -20
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.types.js +3 -2
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.types.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/index.js +9 -8
- package/lib-commonjs/components/MenuItemCheckbox/index.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/renderMenuItemCheckbox.js +13 -24
- package/lib-commonjs/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckbox.js +44 -45
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js +38 -30
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.js +19 -20
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.types.js +3 -2
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.types.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/index.js +9 -8
- package/lib-commonjs/components/MenuItemRadio/index.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/renderMenuItemRadio.js +13 -27
- package/lib-commonjs/components/MenuItemRadio/renderMenuItemRadio.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadio.js +42 -45
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadio.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js +38 -30
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib-commonjs/components/MenuList/MenuList.js +21 -22
- package/lib-commonjs/components/MenuList/MenuList.js.map +1 -1
- package/lib-commonjs/components/MenuList/MenuList.types.js +5 -2
- package/lib-commonjs/components/MenuList/MenuList.types.js.map +1 -1
- package/lib-commonjs/components/MenuList/index.js +10 -9
- package/lib-commonjs/components/MenuList/index.js.map +1 -1
- package/lib-commonjs/components/MenuList/renderMenuList.js +16 -21
- package/lib-commonjs/components/MenuList/renderMenuList.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuList.js +143 -137
- package/lib-commonjs/components/MenuList/useMenuList.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListContextValues.js +20 -25
- package/lib-commonjs/components/MenuList/useMenuListContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListStyles.js +33 -23
- package/lib-commonjs/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/MenuPopover.js +19 -20
- package/lib-commonjs/components/MenuPopover/MenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/MenuPopover.types.js +3 -2
- package/lib-commonjs/components/MenuPopover/MenuPopover.types.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/index.js +9 -8
- package/lib-commonjs/components/MenuPopover/index.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/renderMenuPopover.js +19 -26
- package/lib-commonjs/components/MenuPopover/renderMenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopover.js +102 -110
- package/lib-commonjs/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js +121 -50
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.js +19 -20
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.js +3 -2
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/index.js +9 -8
- package/lib-commonjs/components/MenuSplitGroup/index.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.js +13 -18
- package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.js +58 -64
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js +61 -32
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.js +15 -15
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.types.js +5 -2
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.types.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/index.js +8 -7
- package/lib-commonjs/components/MenuTrigger/index.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/renderMenuTrigger.js +14 -16
- package/lib-commonjs/components/MenuTrigger/renderMenuTrigger.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.js +163 -170
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.js.map +1 -1
- package/lib-commonjs/components/index.js +6 -5
- package/lib-commonjs/components/index.js.map +1 -1
- package/lib-commonjs/contexts/menuContext.js +38 -27
- package/lib-commonjs/contexts/menuContext.js.map +1 -1
- package/lib-commonjs/contexts/menuGroupContext.js +19 -12
- package/lib-commonjs/contexts/menuGroupContext.js.map +1 -1
- package/lib-commonjs/contexts/menuListContext.js +25 -14
- package/lib-commonjs/contexts/menuListContext.js.map +1 -1
- package/lib-commonjs/contexts/menuTriggerContext.js +18 -12
- package/lib-commonjs/contexts/menuTriggerContext.js.map +1 -1
- package/lib-commonjs/index.js +91 -399
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/selectable/index.js +6 -5
- package/lib-commonjs/selectable/index.js.map +1 -1
- package/lib-commonjs/selectable/types.js +5 -2
- package/lib-commonjs/selectable/types.js.map +1 -1
- package/lib-commonjs/selectable/useCheckmarkStyles.js +28 -26
- package/lib-commonjs/selectable/useCheckmarkStyles.js.map +1 -1
- package/lib-commonjs/utils/index.js +5 -4
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/useIsSubmenu.js +13 -19
- package/lib-commonjs/utils/useIsSubmenu.js.map +1 -1
- package/lib-commonjs/utils/useOnMenuEnter.js +57 -68
- package/lib-commonjs/utils/useOnMenuEnter.js.map +1 -1
- package/package.json +13 -13
|
@@ -6,16 +6,6 @@ export const renderMenuItemCheckbox_unstable = state => {
|
|
|
6
6
|
slots,
|
|
7
7
|
slotProps
|
|
8
8
|
} = getSlots(state);
|
|
9
|
-
return /*#__PURE__*/React.createElement(slots.root,
|
|
10
|
-
...slotProps.root
|
|
11
|
-
}, slots.checkmark && /*#__PURE__*/React.createElement(slots.checkmark, {
|
|
12
|
-
...slotProps.checkmark
|
|
13
|
-
}), slots.icon && /*#__PURE__*/React.createElement(slots.icon, {
|
|
14
|
-
...slotProps.icon
|
|
15
|
-
}), slots.content && /*#__PURE__*/React.createElement(slots.content, {
|
|
16
|
-
...slotProps.content
|
|
17
|
-
}), slots.secondaryContent && /*#__PURE__*/React.createElement(slots.secondaryContent, {
|
|
18
|
-
...slotProps.secondaryContent
|
|
19
|
-
}));
|
|
9
|
+
return /*#__PURE__*/React.createElement(slots.root, slotProps.root, slots.checkmark && /*#__PURE__*/React.createElement(slots.checkmark, slotProps.checkmark), slots.icon && /*#__PURE__*/React.createElement(slots.icon, slotProps.icon), slots.content && /*#__PURE__*/React.createElement(slots.content, slotProps.content), slots.secondaryContent && /*#__PURE__*/React.createElement(slots.secondaryContent, slotProps.secondaryContent));
|
|
20
10
|
};
|
|
21
11
|
//# sourceMappingURL=renderMenuItemCheckbox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","getSlots","renderMenuItemCheckbox_unstable","state","slots","slotProps","createElement","root","checkmark","icon","content","secondaryContent"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","getSlots","renderMenuItemCheckbox_unstable","state","slots","slotProps","createElement","root","checkmark","icon","content","secondaryContent"],"sources":["../../../src/components/MenuItemCheckbox/renderMenuItemCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { MenuItemSlots } from '../MenuItem/MenuItem.types';\n\n/** Function that renders the final JSX of the component */\nexport const renderMenuItemCheckbox_unstable = (state: MenuItemCheckboxState) => {\n const { slots, slotProps } = getSlots<MenuItemSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.checkmark && <slots.checkmark {...slotProps.checkmark} />}\n {slots.icon && <slots.icon {...slotProps.icon} />}\n {slots.content && <slots.content {...slotProps.content} />}\n {slots.secondaryContent && <slots.secondaryContent {...slotProps.secondaryContent} />}\n </slots.root>\n );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAIzB;AACA,OAAO,MAAMC,+BAAA,GAAmCC,KAAA,IAAiC;EAC/E,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,QAAA,CAAwBE,KAAA;EAErD,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,EAC3BH,KAAA,CAAMI,SAAS,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMI,SAAS,EAAKH,SAAA,CAAUG,SAAS,GAC3DJ,KAAA,CAAMK,IAAI,iBAAIT,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI,GAC5CL,KAAA,CAAMM,OAAO,iBAAIV,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMM,OAAO,EAAKL,SAAA,CAAUK,OAAO,GACrDN,KAAA,CAAMO,gBAAgB,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMO,gBAAgB,EAAKN,SAAA,CAAUM,gBAAgB;AAGvF"}
|
|
@@ -11,8 +11,8 @@ export const useMenuItemCheckbox_unstable = (props, ref) => {
|
|
|
11
11
|
value
|
|
12
12
|
} = props;
|
|
13
13
|
const checked = useMenuListContext_unstable(context => {
|
|
14
|
-
var
|
|
15
|
-
const checkedItems = ((
|
|
14
|
+
var _context_checkedValues;
|
|
15
|
+
const checkedItems = ((_context_checkedValues = context.checkedValues) === null || _context_checkedValues === void 0 ? void 0 : _context_checkedValues[name]) || [];
|
|
16
16
|
return checkedItems.indexOf(value) !== -1;
|
|
17
17
|
});
|
|
18
18
|
const state = {
|
|
@@ -28,9 +28,9 @@ export const useMenuItemCheckbox_unstable = (props, ref) => {
|
|
|
28
28
|
required: true
|
|
29
29
|
}),
|
|
30
30
|
onClick: e => {
|
|
31
|
-
var
|
|
31
|
+
var _props_onClick;
|
|
32
32
|
toggleCheckbox === null || toggleCheckbox === void 0 ? void 0 : toggleCheckbox(e, name, value, checked);
|
|
33
|
-
(
|
|
33
|
+
(_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);
|
|
34
34
|
}
|
|
35
35
|
}, ref),
|
|
36
36
|
name,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","resolveShorthand","Checkmark16Filled","useMenuListContext_unstable","useMenuItem_unstable","useMenuItemCheckbox_unstable","props","ref","toggleCheckbox","context","name","value","checked","
|
|
1
|
+
{"version":3,"names":["React","resolveShorthand","Checkmark16Filled","useMenuListContext_unstable","useMenuItem_unstable","useMenuItemCheckbox_unstable","props","ref","toggleCheckbox","context","name","value","checked","_context_checkedValues","checkedItems","checkedValues","indexOf","state","role","persistOnClick","checkmark","defaultProps","children","createElement","required","onClick","e","_props_onClick","call"],"sources":["../../../src/components/MenuItemCheckbox/useMenuItemCheckbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { Checkmark16Filled } from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuItem_unstable } from '../MenuItem/useMenuItem';\nimport type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\n/** Returns the props and state required to render the component */\nexport const useMenuItemCheckbox_unstable = (\n props: MenuItemCheckboxProps,\n ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemCheckboxState => {\n const toggleCheckbox = useMenuListContext_unstable(context => context.toggleCheckbox);\n const { name, value } = props;\n\n const checked = useMenuListContext_unstable(context => {\n const checkedItems = context.checkedValues?.[name] || [];\n return checkedItems.indexOf(value) !== -1;\n });\n\n const state: MenuItemCheckboxState = {\n ...useMenuItem_unstable(\n {\n role: 'menuitemcheckbox',\n persistOnClick: true,\n ...props,\n 'aria-checked': checked,\n checkmark: resolveShorthand(props.checkmark, {\n defaultProps: { children: <Checkmark16Filled /> },\n required: true,\n }),\n onClick: (e: React.MouseEvent<ARIAButtonElementIntersection<'div'>>) => {\n toggleCheckbox?.(e, name, value, checked);\n props.onClick?.(e);\n },\n },\n ref,\n ),\n name,\n value,\n checked,\n };\n\n return state;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,gBAAgB,QAAQ;AACjC,SAASC,iBAAiB,QAAQ;AAClC,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,oBAAoB,QAAQ;AAIrC;AACA,OAAO,MAAMC,4BAAA,GAA+BA,CAC1CC,KAAA,EACAC,GAAA,KAC0B;EAC1B,MAAMC,cAAA,GAAiBL,2BAAA,CAA4BM,OAAA,IAAWA,OAAA,CAAQD,cAAc;EACpF,MAAM;IAAEE,IAAA;IAAMC;EAAK,CAAE,GAAGL,KAAA;EAExB,MAAMM,OAAA,GAAUT,2BAAA,CAA4BM,OAAA,IAAW;QAChCI,sBAAA;IAArB,MAAMC,YAAA,GAAe,EAAAD,sBAAA,GAAAJ,OAAA,CAAQM,aAAa,cAArBF,sBAAA,uBAAAA,sBAAuB,CAACH,IAAA,CAAK,KAAI,EAAE;IACxD,OAAOI,YAAA,CAAaE,OAAO,CAACL,KAAA,MAAW,CAAC;EAC1C;EAEA,MAAMM,KAAA,GAA+B;IACnC,GAAGb,oBAAA,CACD;MACEc,IAAA,EAAM;MACNC,cAAA,EAAgB,IAAI;MACpB,GAAGb,KAAK;MACR,gBAAgBM,OAAA;MAChBQ,SAAA,EAAWnB,gBAAA,CAAiBK,KAAA,CAAMc,SAAS,EAAE;QAC3CC,YAAA,EAAc;UAAEC,QAAA,eAAUtB,KAAA,CAAAuB,aAAA,CAACrB,iBAAA;QAAqB;QAChDsB,QAAA,EAAU;MACZ;MACAC,OAAA,EAAUC,CAAA,IAA8D;YAEtEC,cAAA;QADAnB,cAAA,aAAAA,cAAA,uBAAAA,cAAA,CAAiBkB,CAAA,EAAGhB,IAAA,EAAMC,KAAA,EAAOC,OAAA;QACjC,CAAAe,cAAA,GAAArB,KAAA,CAAMmB,OAAO,cAAbE,cAAA,uBAAAA,cAAA,CAAAC,IAAA,CAAAtB,KAAA,EAAgBoB,CAAA;MAClB;IACF,GACAnB,GAAA,CACD;IACDG,IAAA;IACAC,KAAA;IACAC;EACF;EAEA,OAAOK,KAAA;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemCheckboxClassNames","root","icon","checkmark","content","secondaryContent","useMenuItemCheckboxStyles_unstable","state","className"],"sources":["
|
|
1
|
+
{"version":3,"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemCheckboxClassNames","root","icon","checkmark","content","secondaryContent","useMenuItemCheckboxStyles_unstable","state","className"],"sources":["../../../src/components/MenuItemCheckbox/useMenuItemCheckboxStyles.ts"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSlots } from '../index';\nimport type { MenuItemCheckboxState } from './MenuItemCheckbox.types';\n\nexport const menuItemCheckboxClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n root: 'fui-MenuItemCheckbox',\n icon: 'fui-MenuItemCheckbox__icon',\n checkmark: 'fui-MenuItemCheckbox__checkmark',\n content: 'fui-MenuItemCheckbox__content',\n secondaryContent: 'fui-MenuItemCheckbox__secondaryContent',\n};\n\nexport const useMenuItemCheckboxStyles_unstable = (state: MenuItemCheckboxState) => {\n state.root.className = mergeClasses(menuItemCheckboxClassNames.root, state.root.className);\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemCheckboxClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemCheckboxClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemCheckboxClassNames.icon, state.icon.className);\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemCheckboxClassNames.checkmark, state.checkmark.className);\n }\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"mappings":"AAAA,SAASA,YAAY,QAAQ;AAC7B,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,0BAA0B,QAAQ;AAK3C,OAAO,MAAMC,0BAAA,GAAsF;EACjGC,IAAA,EAAM;EACNC,IAAA,EAAM;EACNC,SAAA,EAAW;EACXC,OAAA,EAAS;EACTC,gBAAA,EAAkB;AACpB;AAEA,OAAO,MAAMC,kCAAA,GAAsCC,KAAA,IAAiC;EAClFA,KAAA,CAAMN,IAAI,CAACO,SAAS,GAAGX,YAAA,CAAaG,0BAAA,CAA2BC,IAAI,EAAEM,KAAA,CAAMN,IAAI,CAACO,SAAS;EAEzF,IAAID,KAAA,CAAMH,OAAO,EAAE;IACjBG,KAAA,CAAMH,OAAO,CAACI,SAAS,GAAGX,YAAA,CAAaG,0BAAA,CAA2BI,OAAO,EAAEG,KAAA,CAAMH,OAAO,CAACI,SAAS;EACpG;EAEA,IAAID,KAAA,CAAMF,gBAAgB,EAAE;IAC1BE,KAAA,CAAMF,gBAAgB,CAACG,SAAS,GAAGX,YAAA,CACjCG,0BAAA,CAA2BK,gBAAgB,EAC3CE,KAAA,CAAMF,gBAAgB,CAACG,SAAS;EAEpC;EAEA,IAAID,KAAA,CAAML,IAAI,EAAE;IACdK,KAAA,CAAML,IAAI,CAACM,SAAS,GAAGX,YAAA,CAAaG,0BAAA,CAA2BE,IAAI,EAAEK,KAAA,CAAML,IAAI,CAACM,SAAS;EAC3F;EAEA,IAAID,KAAA,CAAMJ,SAAS,EAAE;IACnBI,KAAA,CAAMJ,SAAS,CAACK,SAAS,GAAGX,YAAA,CAAaG,0BAAA,CAA2BG,SAAS,EAAEI,KAAA,CAAMJ,SAAS,CAACK,SAAS;EAC1G;EAEAT,0BAAA,CAA2BQ,KAAA;EAC3BT,2BAAA,CAA4BS,KAAA;AAC9B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useMenuItemRadio_unstable","renderMenuItemRadio_unstable","useMenuItemRadioStyles_unstable","useCustomStyleHooks_unstable","MenuItemRadio","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","useMenuItemRadio_unstable","renderMenuItemRadio_unstable","useMenuItemRadioStyles_unstable","useCustomStyleHooks_unstable","MenuItemRadio","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../src/components/MenuItemRadio/MenuItemRadio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuItemRadio_unstable } from './useMenuItemRadio';\nimport { renderMenuItemRadio_unstable } from './renderMenuItemRadio';\nimport { useMenuItemRadioStyles_unstable } from './useMenuItemRadioStyles';\nimport type { MenuItemRadioProps } from './MenuItemRadio.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuItemRadio, using the `useMenuItemRadio_unstable` hook.\n */\nexport const MenuItemRadio: ForwardRefComponent<MenuItemRadioProps> = React.forwardRef((props, ref) => {\n const state = useMenuItemRadio_unstable(props, ref);\n\n useMenuItemRadioStyles_unstable(state);\n\n const { useMenuItemRadioStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderMenuItemRadio_unstable(state);\n});\n\nMenuItemRadio.displayName = 'MenuItemRadio';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,+BAA+B,QAAQ;AAGhD,SAASC,4BAA4B,QAAQ;AAE7C;;;AAGA,OAAO,MAAMC,aAAA,gBAAyDL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACrG,MAAMC,KAAA,GAAQR,yBAAA,CAA0BM,KAAA,EAAOC,GAAA;EAE/CL,+BAAA,CAAgCM,KAAA;EAEhC,MAAM;IAAEN,+BAAA,EAAiCO;EAAe,CAAE,GAAGN,4BAAA;EAC7DM,eAAA,CAAgBD,KAAA;EAEhB,OAAOP,4BAAA,CAA6BO,KAAA;AACtC;AAEAJ,aAAA,CAAcM,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["../../../src/components/MenuItemRadio/MenuItemRadio.types.ts"],"sourcesContent":["import type { MenuItemSelectableProps, MenuItemSelectableState } from '../../selectable/index';\nimport type { MenuItemProps, MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport type MenuItemRadioProps = MenuItemProps & MenuItemSelectableProps;\n\nexport type MenuItemRadioState = MenuItemState & MenuItemSelectableState;\n"],"mappings":"AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["../../../src/components/MenuItemRadio/index.ts"],"sourcesContent":["export * from './MenuItemRadio.types';\nexport * from './MenuItemRadio';\nexport * from './renderMenuItemRadio';\nexport * from './useMenuItemRadio';\nexport * from './useMenuItemRadioStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
|
|
@@ -9,16 +9,6 @@ export const renderMenuItemRadio_unstable = state => {
|
|
|
9
9
|
slots,
|
|
10
10
|
slotProps
|
|
11
11
|
} = getSlots(state);
|
|
12
|
-
return /*#__PURE__*/React.createElement(slots.root,
|
|
13
|
-
...slotProps.root
|
|
14
|
-
}, slots.checkmark && /*#__PURE__*/React.createElement(slots.checkmark, {
|
|
15
|
-
...slotProps.checkmark
|
|
16
|
-
}), slots.icon && /*#__PURE__*/React.createElement(slots.icon, {
|
|
17
|
-
...slotProps.icon
|
|
18
|
-
}), slots.content && /*#__PURE__*/React.createElement(slots.content, {
|
|
19
|
-
...slotProps.content
|
|
20
|
-
}), slots.secondaryContent && /*#__PURE__*/React.createElement(slots.secondaryContent, {
|
|
21
|
-
...slotProps.secondaryContent
|
|
22
|
-
}));
|
|
12
|
+
return /*#__PURE__*/React.createElement(slots.root, slotProps.root, slots.checkmark && /*#__PURE__*/React.createElement(slots.checkmark, slotProps.checkmark), slots.icon && /*#__PURE__*/React.createElement(slots.icon, slotProps.icon), slots.content && /*#__PURE__*/React.createElement(slots.content, slotProps.content), slots.secondaryContent && /*#__PURE__*/React.createElement(slots.secondaryContent, slotProps.secondaryContent));
|
|
23
13
|
};
|
|
24
14
|
//# sourceMappingURL=renderMenuItemRadio.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","getSlots","renderMenuItemRadio_unstable","state","slots","slotProps","createElement","root","checkmark","icon","content","secondaryContent"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","getSlots","renderMenuItemRadio_unstable","state","slots","slotProps","createElement","root","checkmark","icon","content","secondaryContent"],"sources":["../../../src/components/MenuItemRadio/renderMenuItemRadio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\nimport type { MenuItemSlots } from '../MenuItem/MenuItem.types';\n\n/**\n * Redefine the render function to add slots. Reuse the menuitemradio structure but add\n * slots to children.\n */\nexport const renderMenuItemRadio_unstable = (state: MenuItemRadioState) => {\n const { slots, slotProps } = getSlots<MenuItemSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.checkmark && <slots.checkmark {...slotProps.checkmark} />}\n {slots.icon && <slots.icon {...slotProps.icon} />}\n {slots.content && <slots.content {...slotProps.content} />}\n {slots.secondaryContent && <slots.secondaryContent {...slotProps.secondaryContent} />}\n </slots.root>\n );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAIzB;;;;AAIA,OAAO,MAAMC,4BAAA,GAAgCC,KAAA,IAA8B;EACzE,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,QAAA,CAAwBE,KAAA;EAErD,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,EAC3BH,KAAA,CAAMI,SAAS,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMI,SAAS,EAAKH,SAAA,CAAUG,SAAS,GAC3DJ,KAAA,CAAMK,IAAI,iBAAIT,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI,GAC5CL,KAAA,CAAMM,OAAO,iBAAIV,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMM,OAAO,EAAKL,SAAA,CAAUK,OAAO,GACrDN,KAAA,CAAMO,gBAAgB,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMO,gBAAgB,EAAKN,SAAA,CAAUM,gBAAgB;AAGvF"}
|
|
@@ -12,8 +12,8 @@ export const useMenuItemRadio_unstable = (props, ref) => {
|
|
|
12
12
|
value
|
|
13
13
|
} = props;
|
|
14
14
|
const checked = useMenuListContext_unstable(context => {
|
|
15
|
-
var
|
|
16
|
-
const checkedItems = ((
|
|
15
|
+
var _context_checkedValues;
|
|
16
|
+
const checkedItems = ((_context_checkedValues = context.checkedValues) === null || _context_checkedValues === void 0 ? void 0 : _context_checkedValues[name]) || [];
|
|
17
17
|
return checkedItems.indexOf(value) !== -1;
|
|
18
18
|
});
|
|
19
19
|
const selectRadio = useMenuListContext_unstable(context => context.selectRadio);
|
|
@@ -29,9 +29,9 @@ export const useMenuItemRadio_unstable = (props, ref) => {
|
|
|
29
29
|
required: true
|
|
30
30
|
}),
|
|
31
31
|
onClick: e => {
|
|
32
|
-
var
|
|
32
|
+
var _props_onClick;
|
|
33
33
|
selectRadio === null || selectRadio === void 0 ? void 0 : selectRadio(e, name, value, checked);
|
|
34
|
-
(
|
|
34
|
+
(_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);
|
|
35
35
|
}
|
|
36
36
|
}, ref),
|
|
37
37
|
checked,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","resolveShorthand","Checkmark16Filled","useMenuListContext_unstable","useMenuItem_unstable","useMenuItemRadio_unstable","props","ref","name","value","checked","context","
|
|
1
|
+
{"version":3,"names":["React","resolveShorthand","Checkmark16Filled","useMenuListContext_unstable","useMenuItem_unstable","useMenuItemRadio_unstable","props","ref","name","value","checked","context","_context_checkedValues","checkedItems","checkedValues","indexOf","selectRadio","role","checkmark","defaultProps","children","createElement","required","onClick","e","_props_onClick","call"],"sources":["../../../src/components/MenuItemRadio/useMenuItemRadio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { Checkmark16Filled } from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuItem_unstable } from '../MenuItem/useMenuItem';\nimport type { MenuItemRadioProps, MenuItemRadioState } from './MenuItemRadio.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\n/**\n * Given user props, returns state and render function for a MenuItemRadio.\n */\nexport const useMenuItemRadio_unstable = (\n props: MenuItemRadioProps,\n ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemRadioState => {\n const { name, value } = props;\n\n const checked = useMenuListContext_unstable(context => {\n const checkedItems = context.checkedValues?.[name] || [];\n return checkedItems.indexOf(value) !== -1;\n });\n\n const selectRadio = useMenuListContext_unstable(context => context.selectRadio);\n\n return {\n ...useMenuItem_unstable(\n {\n ...props,\n role: 'menuitemradio',\n 'aria-checked': checked,\n checkmark: resolveShorthand(props.checkmark, {\n defaultProps: { children: <Checkmark16Filled /> },\n required: true,\n }),\n onClick: (e: React.MouseEvent<ARIAButtonElementIntersection<'div'>>) => {\n selectRadio?.(e, name, value, checked);\n props.onClick?.(e);\n },\n },\n ref,\n ),\n checked,\n name,\n value,\n };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,gBAAgB,QAAQ;AACjC,SAASC,iBAAiB,QAAQ;AAClC,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,oBAAoB,QAAQ;AAIrC;;;AAGA,OAAO,MAAMC,yBAAA,GAA4BA,CACvCC,KAAA,EACAC,GAAA,KACuB;EACvB,MAAM;IAAEC,IAAA;IAAMC;EAAK,CAAE,GAAGH,KAAA;EAExB,MAAMI,OAAA,GAAUP,2BAAA,CAA4BQ,OAAA,IAAW;QAChCC,sBAAA;IAArB,MAAMC,YAAA,GAAe,EAAAD,sBAAA,GAAAD,OAAA,CAAQG,aAAa,cAArBF,sBAAA,uBAAAA,sBAAuB,CAACJ,IAAA,CAAK,KAAI,EAAE;IACxD,OAAOK,YAAA,CAAaE,OAAO,CAACN,KAAA,MAAW,CAAC;EAC1C;EAEA,MAAMO,WAAA,GAAcb,2BAAA,CAA4BQ,OAAA,IAAWA,OAAA,CAAQK,WAAW;EAE9E,OAAO;IACL,GAAGZ,oBAAA,CACD;MACE,GAAGE,KAAK;MACRW,IAAA,EAAM;MACN,gBAAgBP,OAAA;MAChBQ,SAAA,EAAWjB,gBAAA,CAAiBK,KAAA,CAAMY,SAAS,EAAE;QAC3CC,YAAA,EAAc;UAAEC,QAAA,eAAUpB,KAAA,CAAAqB,aAAA,CAACnB,iBAAA;QAAqB;QAChDoB,QAAA,EAAU;MACZ;MACAC,OAAA,EAAUC,CAAA,IAA8D;YAEtEC,cAAA;QADAT,WAAA,aAAAA,WAAA,uBAAAA,WAAA,CAAcQ,CAAA,EAAGhB,IAAA,EAAMC,KAAA,EAAOC,OAAA;QAC9B,CAAAe,cAAA,GAAAnB,KAAA,CAAMiB,OAAO,cAAbE,cAAA,uBAAAA,cAAA,CAAAC,IAAA,CAAApB,KAAA,EAAgBkB,CAAA;MAClB;IACF,GACAjB,GAAA,CACD;IACDG,OAAA;IACAF,IAAA;IACAC;EACF;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemRadioClassNames","root","icon","checkmark","content","secondaryContent","useMenuItemRadioStyles_unstable","state","className"],"sources":["
|
|
1
|
+
{"version":3,"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemRadioClassNames","root","icon","checkmark","content","secondaryContent","useMenuItemRadioStyles_unstable","state","className"],"sources":["../../../src/components/MenuItemRadio/useMenuItemRadioStyles.ts"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSlots } from '../index';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\n\nexport const menuItemRadioClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n root: 'fui-MenuItemRadio',\n icon: 'fui-MenuItemRadio__icon',\n checkmark: 'fui-MenuItemRadio__checkmark',\n content: 'fui-MenuItemRadio__content',\n secondaryContent: 'fui-MenuItemRadio__secondaryContent',\n};\n\nexport const useMenuItemRadioStyles_unstable = (state: MenuItemRadioState) => {\n state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemRadioClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemRadioClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemRadioClassNames.icon, state.icon.className);\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemRadioClassNames.checkmark, state.checkmark.className);\n }\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"mappings":"AAAA,SAASA,YAAY,QAAQ;AAC7B,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,0BAA0B,QAAQ;AAK3C,OAAO,MAAMC,uBAAA,GAAmF;EAC9FC,IAAA,EAAM;EACNC,IAAA,EAAM;EACNC,SAAA,EAAW;EACXC,OAAA,EAAS;EACTC,gBAAA,EAAkB;AACpB;AAEA,OAAO,MAAMC,+BAAA,GAAmCC,KAAA,IAA8B;EAC5EA,KAAA,CAAMN,IAAI,CAACO,SAAS,GAAGX,YAAA,CAAaG,uBAAA,CAAwBC,IAAI,EAAEM,KAAA,CAAMN,IAAI,CAACO,SAAS;EAEtF,IAAID,KAAA,CAAMH,OAAO,EAAE;IACjBG,KAAA,CAAMH,OAAO,CAACI,SAAS,GAAGX,YAAA,CAAaG,uBAAA,CAAwBI,OAAO,EAAEG,KAAA,CAAMH,OAAO,CAACI,SAAS;EACjG;EAEA,IAAID,KAAA,CAAMF,gBAAgB,EAAE;IAC1BE,KAAA,CAAMF,gBAAgB,CAACG,SAAS,GAAGX,YAAA,CACjCG,uBAAA,CAAwBK,gBAAgB,EACxCE,KAAA,CAAMF,gBAAgB,CAACG,SAAS;EAEpC;EAEA,IAAID,KAAA,CAAML,IAAI,EAAE;IACdK,KAAA,CAAML,IAAI,CAACM,SAAS,GAAGX,YAAA,CAAaG,uBAAA,CAAwBE,IAAI,EAAEK,KAAA,CAAML,IAAI,CAACM,SAAS;EACxF;EAEA,IAAID,KAAA,CAAMJ,SAAS,EAAE;IACnBI,KAAA,CAAMJ,SAAS,CAACK,SAAS,GAAGX,YAAA,CAAaG,uBAAA,CAAwBG,SAAS,EAAEI,KAAA,CAAMJ,SAAS,CAACK,SAAS;EACvG;EAEAT,0BAAA,CAA2BQ,KAAA;EAC3BT,2BAAA,CAA4BS,KAAA;AAC9B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useMenuList_unstable","renderMenuList_unstable","useMenuListContextValues_unstable","useMenuListStyles_unstable","useCustomStyleHooks_unstable","MenuList","forwardRef","props","ref","state","contextValues","useCustomStyles","displayName"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","useMenuList_unstable","renderMenuList_unstable","useMenuListContextValues_unstable","useMenuListStyles_unstable","useCustomStyleHooks_unstable","MenuList","forwardRef","props","ref","state","contextValues","useCustomStyles","displayName"],"sources":["../../../src/components/MenuList/MenuList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuList_unstable } from './useMenuList';\nimport { renderMenuList_unstable } from './renderMenuList';\nimport { useMenuListContextValues_unstable } from './useMenuListContextValues';\nimport { useMenuListStyles_unstable } from './useMenuListStyles';\nimport type { MenuListProps } from './MenuList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuList, using the `useMenuList_unstable` hook.\n */\nexport const MenuList: ForwardRefComponent<MenuListProps> = React.forwardRef((props, ref) => {\n const state = useMenuList_unstable(props, ref);\n const contextValues = useMenuListContextValues_unstable(state);\n\n useMenuListStyles_unstable(state);\n\n const { useMenuListStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderMenuList_unstable(state, contextValues);\n});\n\nMenuList.displayName = 'MenuList';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,oBAAoB,QAAQ;AACrC,SAASC,uBAAuB,QAAQ;AACxC,SAASC,iCAAiC,QAAQ;AAClD,SAASC,0BAA0B,QAAQ;AAG3C,SAASC,4BAA4B,QAAQ;AAE7C;;;AAGA,OAAO,MAAMC,QAAA,gBAA+CN,KAAA,CAAMO,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EAC3F,MAAMC,KAAA,GAAQT,oBAAA,CAAqBO,KAAA,EAAOC,GAAA;EAC1C,MAAME,aAAA,GAAgBR,iCAAA,CAAkCO,KAAA;EAExDN,0BAAA,CAA2BM,KAAA;EAE3B,MAAM;IAAEN,0BAAA,EAA4BQ;EAAe,CAAE,GAAGP,4BAAA;EACxDO,eAAA,CAAgBF,KAAA;EAEhB,OAAOR,uBAAA,CAAwBQ,KAAA,EAAOC,aAAA;AACxC;AAEAL,QAAA,CAASO,WAAW,GAAG"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
import * as React from 'react';
|
|
2
2
|
//# sourceMappingURL=MenuList.types.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["React"],"sources":["../../../src/components/MenuList/MenuList.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { MenuListContextValue } from '../../contexts/menuListContext';\nimport type { SelectableHandler } from '../../selectable/index';\n\nexport type MenuCheckedValueChangeEvent = React.MouseEvent | React.KeyboardEvent;\n\nexport type MenuCheckedValueChangeData = {\n /** The items for this value that are checked */\n checkedItems: string[];\n /** The name of the value */\n name: string;\n};\n\nexport type MenuListSlots = {\n root: Slot<'div'>;\n};\n\nexport type MenuListProps = ComponentProps<MenuListSlots> & {\n /**\n * Map of all checked values\n */\n checkedValues?: Record<string, string[]>;\n\n /**\n * Default values to be checked on mount\n */\n defaultCheckedValues?: Record<string, string[]>;\n\n /**\n * States that menu items can contain selectable items and reserve slots for item alignment\n */\n hasCheckmarks?: boolean;\n\n /**\n * States that menu items can contain icons and reserve slots for item alignment\n */\n hasIcons?: boolean;\n\n /**\n * Callback when checked items change for value with a name\n *\n * @param event - React's original SyntheticEvent\n * @param data - A data object with relevant information\n */\n onCheckedValueChange?: (e: MenuCheckedValueChangeEvent, data: MenuCheckedValueChangeData) => void;\n};\n\nexport type MenuListState = ComponentState<MenuListSlots> &\n Required<Pick<MenuListProps, 'checkedValues' | 'hasCheckmarks' | 'hasIcons'>> &\n Pick<MenuListProps, 'defaultCheckedValues' | 'onCheckedValueChange'> & {\n /**\n * Selects a radio item, will de-select the currently selected ratio item\n */\n selectRadio: SelectableHandler;\n\n /**\n * Callback to set focus on the next menu item by first character\n */\n setFocusByFirstCharacter: NonNullable<MenuListContextValue['setFocusByFirstCharacter']>;\n\n /*\n * Toggles the state of a checkbox item\n */\n toggleCheckbox: SelectableHandler;\n };\n\nexport type MenuListContextValues = {\n menuList: MenuListContextValue;\n};\n\n/**\n * @deprecated this type is not being used internally anymore\n */\nexport type UninitializedMenuListState = Omit<\n MenuListState,\n 'checkedValues' | 'selectRadio' | 'setFocusByFirstCharacter' | 'toggleCheckbox'\n> &\n Partial<Pick<MenuListState, 'checkedValues'>>;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["../../../src/components/MenuList/index.ts"],"sourcesContent":["export * from './MenuList';\nexport * from './MenuList.types';\nexport * from './renderMenuList';\nexport * from './useMenuList';\nexport * from './useMenuListStyles';\nexport * from './useMenuListContextValues';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
|
|
@@ -11,8 +11,6 @@ export const renderMenuList_unstable = (state, contextValues) => {
|
|
|
11
11
|
} = getSlots(state);
|
|
12
12
|
return /*#__PURE__*/React.createElement(MenuListProvider, {
|
|
13
13
|
value: contextValues.menuList
|
|
14
|
-
}, /*#__PURE__*/React.createElement(slots.root,
|
|
15
|
-
...slotProps.root
|
|
16
|
-
}));
|
|
14
|
+
}, /*#__PURE__*/React.createElement(slots.root, slotProps.root));
|
|
17
15
|
};
|
|
18
16
|
//# sourceMappingURL=renderMenuList.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","getSlots","MenuListProvider","renderMenuList_unstable","state","contextValues","slots","slotProps","createElement","value","menuList","root"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","getSlots","MenuListProvider","renderMenuList_unstable","state","contextValues","slots","slotProps","createElement","value","menuList","root"],"sources":["../../../src/components/MenuList/renderMenuList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { MenuListContextValues, MenuListSlots, MenuListState } from './MenuList.types';\nimport { MenuListProvider } from '../../contexts/menuListContext';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderMenuList_unstable = (state: MenuListState, contextValues: MenuListContextValues) => {\n const { slots, slotProps } = getSlots<MenuListSlots>(state);\n\n return (\n <MenuListProvider value={contextValues.menuList}>\n <slots.root {...slotProps.root} />\n </MenuListProvider>\n );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAEzB,SAASC,gBAAgB,QAAQ;AAEjC;;;AAGA,OAAO,MAAMC,uBAAA,GAA0BA,CAACC,KAAA,EAAsBC,aAAA,KAAyC;EACrG,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,QAAA,CAAwBG,KAAA;EAErD,oBACEJ,KAAA,CAAAQ,aAAA,CAACN,gBAAA;IAAiBO,KAAA,EAAOJ,aAAA,CAAcK;kBACrCV,KAAA,CAAAQ,aAAA,CAACF,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI;AAGpC"}
|
|
@@ -8,7 +8,6 @@ import { MenuContext } from '../../contexts/menuContext';
|
|
|
8
8
|
* Returns the props and state required to render the component
|
|
9
9
|
*/
|
|
10
10
|
export const useMenuList_unstable = (props, ref) => {
|
|
11
|
-
var _a, _b;
|
|
12
11
|
const {
|
|
13
12
|
findAllFocusable
|
|
14
13
|
} = useFocusFinders();
|
|
@@ -38,8 +37,8 @@ export const useMenuList_unstable = (props, ref) => {
|
|
|
38
37
|
startIndex = 0;
|
|
39
38
|
}
|
|
40
39
|
const firstChars = menuItems.map(menuItem => {
|
|
41
|
-
var
|
|
42
|
-
return (
|
|
40
|
+
var _menuItem_textContent;
|
|
41
|
+
return (_menuItem_textContent = menuItem.textContent) === null || _menuItem_textContent === void 0 ? void 0 : _menuItem_textContent.charAt(0).toLowerCase();
|
|
43
42
|
});
|
|
44
43
|
const char = e.key.toLowerCase();
|
|
45
44
|
const getIndexFirstChars = (start, firstChar) => {
|
|
@@ -61,12 +60,14 @@ export const useMenuList_unstable = (props, ref) => {
|
|
|
61
60
|
menuItems[index].focus();
|
|
62
61
|
}
|
|
63
62
|
}, [findAllFocusable]);
|
|
63
|
+
var _props_checkedValues;
|
|
64
64
|
const [checkedValues, setCheckedValues] = useControllableState({
|
|
65
|
-
state: (
|
|
65
|
+
state: (_props_checkedValues = props.checkedValues) !== null && _props_checkedValues !== void 0 ? _props_checkedValues : hasMenuContext ? menuContext.checkedValues : undefined,
|
|
66
66
|
defaultState: props.defaultCheckedValues,
|
|
67
67
|
initialState: {}
|
|
68
68
|
});
|
|
69
|
-
|
|
69
|
+
var _props_onCheckedValueChange;
|
|
70
|
+
const handleCheckedValueChange = (_props_onCheckedValueChange = props.onCheckedValueChange) !== null && _props_onCheckedValueChange !== void 0 ? _props_onCheckedValueChange : hasMenuContext ? menuContext.onCheckedValueChange : undefined;
|
|
70
71
|
const toggleCheckbox = useEventCallback((e, name, value, checked) => {
|
|
71
72
|
const checkedItems = (checkedValues === null || checkedValues === void 0 ? void 0 : checkedValues[name]) || [];
|
|
72
73
|
const newCheckedItems = [...checkedItems];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useMergedRefs","useEventCallback","useControllableState","getNativeElementProps","useArrowNavigationGroup","useFocusFinders","useHasParentContext","useMenuContext_unstable","MenuContext","useMenuList_unstable","props","ref","findAllFocusable","menuContext","useMenuContextSelectors","hasMenuContext","focusAttributes","circular","ignoreDefaultKeydown","Tab","usingPropsAndMenuContext","console","warn","innerRef","useRef","setFocusByFirstCharacter","useCallback","e","itemEl","acceptedRoles","current","menuItems","el","hasAttribute","indexOf","getAttribute","startIndex","length","firstChars","map","menuItem","_a","textContent","charAt","toLowerCase","char","key","getIndexFirstChars","start","firstChar","i","index","focus","checkedValues","setCheckedValues","state","undefined","defaultState","defaultCheckedValues","initialState","handleCheckedValueChange","_b","onCheckedValueChange","toggleCheckbox","name","value","checked","checkedItems","newCheckedItems","splice","push","s","selectRadio","components","root","role","triggerId","hasIcons","hasCheckmarks","context","contextValue","isUsingPropsAndContext","val"],"sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuList/useMenuList.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n useMergedRefs,\n useEventCallback,\n useControllableState,\n getNativeElementProps,\n} from '@fluentui/react-utilities';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MenuContext } from '../../contexts/menuContext';\nimport type { MenuListProps, MenuListState } from './MenuList.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuList_unstable = (props: MenuListProps, ref: React.Ref<HTMLElement>): MenuListState => {\n const { findAllFocusable } = useFocusFinders();\n const menuContext = useMenuContextSelectors();\n const hasMenuContext = useHasParentContext(MenuContext);\n const focusAttributes = useArrowNavigationGroup({ circular: true, ignoreDefaultKeydown: { Tab: hasMenuContext } });\n\n if (usingPropsAndMenuContext(props, menuContext, hasMenuContext)) {\n // TODO throw warnings in development safely\n // eslint-disable-next-line no-console\n console.warn('You are using both MenuList and Menu props, we recommend you to use Menu props when available');\n }\n\n const innerRef = React.useRef<HTMLElement>(null);\n\n const setFocusByFirstCharacter = React.useCallback(\n (e: React.KeyboardEvent<HTMLElement>, itemEl: HTMLElement) => {\n // TODO use some kind of children registration to reduce dependency on DOM roles\n const acceptedRoles = ['menuitem', 'menuitemcheckbox', 'menuitemradio'];\n if (!innerRef.current) {\n return;\n }\n\n const menuItems = findAllFocusable(\n innerRef.current,\n (el: HTMLElement) => el.hasAttribute('role') && acceptedRoles.indexOf(el.getAttribute('role')!) !== -1,\n );\n\n let startIndex = menuItems.indexOf(itemEl) + 1;\n if (startIndex === menuItems.length) {\n startIndex = 0;\n }\n\n const firstChars = menuItems.map(menuItem => menuItem.textContent?.charAt(0).toLowerCase());\n const char = e.key.toLowerCase();\n\n const getIndexFirstChars = (start: number, firstChar: string) => {\n for (let i = start; i < firstChars.length; i++) {\n if (char === firstChars[i]) {\n return i;\n }\n }\n return -1;\n };\n\n // Check remaining slots in the menu\n let index = getIndexFirstChars(startIndex, char);\n\n // If not found in remaining slots, check from beginning\n if (index === -1) {\n index = getIndexFirstChars(0, char);\n }\n\n // If match was found...\n if (index > -1) {\n menuItems[index].focus();\n }\n },\n [findAllFocusable],\n );\n\n const [checkedValues, setCheckedValues] = useControllableState({\n state: props.checkedValues ?? (hasMenuContext ? menuContext.checkedValues : undefined),\n defaultState: props.defaultCheckedValues,\n initialState: {},\n });\n\n const handleCheckedValueChange =\n props.onCheckedValueChange ?? (hasMenuContext ? menuContext.onCheckedValueChange : undefined);\n\n const toggleCheckbox = useEventCallback(\n (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked: boolean) => {\n const checkedItems = checkedValues?.[name] || [];\n const newCheckedItems = [...checkedItems];\n if (checked) {\n newCheckedItems.splice(newCheckedItems.indexOf(value), 1);\n } else {\n newCheckedItems.push(value);\n }\n\n handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n },\n );\n\n const selectRadio = useEventCallback((e: React.MouseEvent | React.KeyboardEvent, name: string, value: string) => {\n const newCheckedItems = [value];\n setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n });\n\n return {\n components: {\n root: 'div',\n },\n root: getNativeElementProps('div', {\n ref: useMergedRefs(ref, innerRef),\n role: 'menu',\n 'aria-labelledby': menuContext.triggerId,\n ...focusAttributes,\n ...props,\n }),\n hasIcons: menuContext.hasIcons || false,\n hasCheckmarks: menuContext.hasCheckmarks || false,\n checkedValues,\n setFocusByFirstCharacter,\n selectRadio,\n toggleCheckbox,\n };\n};\n\n/**\n * Adds some sugar to fetching multiple context selector values\n */\nconst useMenuContextSelectors = () => {\n const checkedValues = useMenuContext_unstable(context => context.checkedValues);\n const onCheckedValueChange = useMenuContext_unstable(context => context.onCheckedValueChange);\n const triggerId = useMenuContext_unstable(context => context.triggerId);\n const hasIcons = useMenuContext_unstable(context => context.hasIcons);\n const hasCheckmarks = useMenuContext_unstable(context => context.hasCheckmarks);\n\n return {\n checkedValues,\n onCheckedValueChange,\n triggerId,\n hasIcons,\n hasCheckmarks,\n };\n};\n\n/**\n * Helper function to detect if props and MenuContext values are both used\n */\nconst usingPropsAndMenuContext = (\n props: MenuListProps,\n contextValue: ReturnType<typeof useMenuContextSelectors>,\n hasMenuContext: boolean,\n) => {\n let isUsingPropsAndContext = false;\n for (const val in contextValue) {\n if (props[val as keyof Omit<typeof contextValue, 'hasMenuContext' | 'onCheckedValueChange' | 'triggerId'>]) {\n isUsingPropsAndContext = true;\n }\n }\n\n return hasMenuContext && isUsingPropsAndContext;\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["React","useMergedRefs","useEventCallback","useControllableState","getNativeElementProps","useArrowNavigationGroup","useFocusFinders","useHasParentContext","useMenuContext_unstable","MenuContext","useMenuList_unstable","props","ref","findAllFocusable","menuContext","useMenuContextSelectors","hasMenuContext","focusAttributes","circular","ignoreDefaultKeydown","Tab","usingPropsAndMenuContext","console","warn","innerRef","useRef","setFocusByFirstCharacter","useCallback","e","itemEl","acceptedRoles","current","menuItems","el","hasAttribute","indexOf","getAttribute","startIndex","length","firstChars","map","menuItem","_menuItem_textContent","textContent","charAt","toLowerCase","char","key","getIndexFirstChars","start","firstChar","i","index","focus","_props_checkedValues","checkedValues","setCheckedValues","state","undefined","defaultState","defaultCheckedValues","initialState","_props_onCheckedValueChange","handleCheckedValueChange","onCheckedValueChange","toggleCheckbox","name","value","checked","checkedItems","newCheckedItems","splice","push","s","selectRadio","components","root","role","triggerId","hasIcons","hasCheckmarks","context","contextValue","isUsingPropsAndContext","val"],"sources":["../../../src/components/MenuList/useMenuList.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n useMergedRefs,\n useEventCallback,\n useControllableState,\n getNativeElementProps,\n} from '@fluentui/react-utilities';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MenuContext } from '../../contexts/menuContext';\nimport type { MenuListProps, MenuListState } from './MenuList.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuList_unstable = (props: MenuListProps, ref: React.Ref<HTMLElement>): MenuListState => {\n const { findAllFocusable } = useFocusFinders();\n const menuContext = useMenuContextSelectors();\n const hasMenuContext = useHasParentContext(MenuContext);\n const focusAttributes = useArrowNavigationGroup({ circular: true, ignoreDefaultKeydown: { Tab: hasMenuContext } });\n\n if (usingPropsAndMenuContext(props, menuContext, hasMenuContext)) {\n // TODO throw warnings in development safely\n // eslint-disable-next-line no-console\n console.warn('You are using both MenuList and Menu props, we recommend you to use Menu props when available');\n }\n\n const innerRef = React.useRef<HTMLElement>(null);\n\n const setFocusByFirstCharacter = React.useCallback(\n (e: React.KeyboardEvent<HTMLElement>, itemEl: HTMLElement) => {\n // TODO use some kind of children registration to reduce dependency on DOM roles\n const acceptedRoles = ['menuitem', 'menuitemcheckbox', 'menuitemradio'];\n if (!innerRef.current) {\n return;\n }\n\n const menuItems = findAllFocusable(\n innerRef.current,\n (el: HTMLElement) => el.hasAttribute('role') && acceptedRoles.indexOf(el.getAttribute('role')!) !== -1,\n );\n\n let startIndex = menuItems.indexOf(itemEl) + 1;\n if (startIndex === menuItems.length) {\n startIndex = 0;\n }\n\n const firstChars = menuItems.map(menuItem => menuItem.textContent?.charAt(0).toLowerCase());\n const char = e.key.toLowerCase();\n\n const getIndexFirstChars = (start: number, firstChar: string) => {\n for (let i = start; i < firstChars.length; i++) {\n if (char === firstChars[i]) {\n return i;\n }\n }\n return -1;\n };\n\n // Check remaining slots in the menu\n let index = getIndexFirstChars(startIndex, char);\n\n // If not found in remaining slots, check from beginning\n if (index === -1) {\n index = getIndexFirstChars(0, char);\n }\n\n // If match was found...\n if (index > -1) {\n menuItems[index].focus();\n }\n },\n [findAllFocusable],\n );\n\n const [checkedValues, setCheckedValues] = useControllableState({\n state: props.checkedValues ?? (hasMenuContext ? menuContext.checkedValues : undefined),\n defaultState: props.defaultCheckedValues,\n initialState: {},\n });\n\n const handleCheckedValueChange =\n props.onCheckedValueChange ?? (hasMenuContext ? menuContext.onCheckedValueChange : undefined);\n\n const toggleCheckbox = useEventCallback(\n (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked: boolean) => {\n const checkedItems = checkedValues?.[name] || [];\n const newCheckedItems = [...checkedItems];\n if (checked) {\n newCheckedItems.splice(newCheckedItems.indexOf(value), 1);\n } else {\n newCheckedItems.push(value);\n }\n\n handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n },\n );\n\n const selectRadio = useEventCallback((e: React.MouseEvent | React.KeyboardEvent, name: string, value: string) => {\n const newCheckedItems = [value];\n setCheckedValues(s => ({ ...s, [name]: newCheckedItems }));\n handleCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n });\n\n return {\n components: {\n root: 'div',\n },\n root: getNativeElementProps('div', {\n ref: useMergedRefs(ref, innerRef),\n role: 'menu',\n 'aria-labelledby': menuContext.triggerId,\n ...focusAttributes,\n ...props,\n }),\n hasIcons: menuContext.hasIcons || false,\n hasCheckmarks: menuContext.hasCheckmarks || false,\n checkedValues,\n setFocusByFirstCharacter,\n selectRadio,\n toggleCheckbox,\n };\n};\n\n/**\n * Adds some sugar to fetching multiple context selector values\n */\nconst useMenuContextSelectors = () => {\n const checkedValues = useMenuContext_unstable(context => context.checkedValues);\n const onCheckedValueChange = useMenuContext_unstable(context => context.onCheckedValueChange);\n const triggerId = useMenuContext_unstable(context => context.triggerId);\n const hasIcons = useMenuContext_unstable(context => context.hasIcons);\n const hasCheckmarks = useMenuContext_unstable(context => context.hasCheckmarks);\n\n return {\n checkedValues,\n onCheckedValueChange,\n triggerId,\n hasIcons,\n hasCheckmarks,\n };\n};\n\n/**\n * Helper function to detect if props and MenuContext values are both used\n */\nconst usingPropsAndMenuContext = (\n props: MenuListProps,\n contextValue: ReturnType<typeof useMenuContextSelectors>,\n hasMenuContext: boolean,\n) => {\n let isUsingPropsAndContext = false;\n for (const val in contextValue) {\n if (props[val as keyof Omit<typeof contextValue, 'hasMenuContext' | 'onCheckedValueChange' | 'triggerId'>]) {\n isUsingPropsAndContext = true;\n }\n }\n\n return hasMenuContext && isUsingPropsAndContext;\n};\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMenuListContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","selectRadio","setFocusByFirstCharacter","toggleCheckbox","menuList"],"sources":["
|
|
1
|
+
{"version":3,"names":["useMenuListContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","selectRadio","setFocusByFirstCharacter","toggleCheckbox","menuList"],"sources":["../../../src/components/MenuList/useMenuListContextValues.ts"],"sourcesContent":["import type { MenuListContextValues, MenuListState } from './MenuList.types';\n\nexport function useMenuListContextValues_unstable(state: MenuListState): MenuListContextValues {\n const { checkedValues, hasCheckmarks, hasIcons, selectRadio, setFocusByFirstCharacter, toggleCheckbox } = state;\n\n // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n const menuList = {\n checkedValues,\n hasCheckmarks,\n hasIcons,\n selectRadio,\n setFocusByFirstCharacter,\n toggleCheckbox,\n };\n\n return { menuList };\n}\n"],"mappings":"AAEA,OAAO,SAASA,kCAAkCC,KAAoB,EAAyB;EAC7F,MAAM;IAAEC,aAAA;IAAeC,aAAA;IAAeC,QAAA;IAAUC,WAAA;IAAaC,wBAAA;IAA0BC;EAAc,CAAE,GAAGN,KAAA;EAE1G;EACA,MAAMO,QAAA,GAAW;IACfN,aAAA;IACAC,aAAA;IACAC,QAAA;IACAC,WAAA;IACAC,wBAAA;IACAC;EACF;EAEA,OAAO;IAAEC;EAAS;AACpB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mergeClasses","__styles","shorthands","menuListClassNames","root","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","d","useMenuListStyles_unstable","state","styles","className"],"sources":["
|
|
1
|
+
{"version":3,"names":["mergeClasses","__styles","shorthands","menuListClassNames","root","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","d","useMenuListStyles_unstable","state","styles","className"],"sources":["../../../src/components/MenuList/useMenuListStyles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport type { MenuListSlots, MenuListState } from './MenuList.types';\n\nexport const menuListClassNames: SlotClassNames<MenuListSlots> = {\n root: 'fui-MenuList',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.gap('2px'),\n },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuListStyles_unstable = (state: MenuListState): MenuListState => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AACA,SAASA,YAAY,EAAAC,QAAA,EAAcC,UAAU,QAAQ;AAGrD,OAAO,MAAMC,kBAAA,GAAoD;EAC/DC,IAAA,EAAM;AACR;AAEA,MAAMC,SAAA,gBAAYJ,QAAA;EAAAG,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAMlB;AAEA;;;AAGA,OAAO,MAAMC,0BAAA,GAA8BC,KAAA,IAAwC;EACjF,MAAMC,MAAA,GAASR,SAAA;EACfO,KAAA,CAAMR,IAAI,CAACU,SAAS,GAAGd,YAAA,CAAaG,kBAAA,CAAmBC,IAAI,EAAES,MAAA,CAAOT,IAAI,EAAEQ,KAAA,CAAMR,IAAI,CAACU,SAAS;EAC9F,OAAOF,KAAA;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useMenuPopover_unstable","useMenuPopoverStyles_unstable","renderMenuPopover_unstable","useCustomStyleHooks_unstable","MenuPopover","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","useMenuPopover_unstable","useMenuPopoverStyles_unstable","renderMenuPopover_unstable","useCustomStyleHooks_unstable","MenuPopover","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../src/components/MenuPopover/MenuPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useMenuPopover_unstable } from './useMenuPopover';\nimport { useMenuPopoverStyles_unstable } from './useMenuPopoverStyles';\nimport { renderMenuPopover_unstable } from './renderMenuPopover';\nimport type { MenuPopoverProps } from './MenuPopover.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Popover intended to wrap `MenuList` and adds styling and interaction support specific to menus\n */\nexport const MenuPopover: ForwardRefComponent<MenuPopoverProps> = React.forwardRef((props, ref) => {\n const state = useMenuPopover_unstable(props, ref);\n\n useMenuPopoverStyles_unstable(state);\n\n const { useMenuPopoverStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderMenuPopover_unstable(state);\n});\n\nMenuPopover.displayName = 'MenuPopover';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,uBAAuB,QAAQ;AACxC,SAASC,6BAA6B,QAAQ;AAC9C,SAASC,0BAA0B,QAAQ;AAG3C,SAASC,4BAA4B,QAAQ;AAE7C;;;AAGA,OAAO,MAAMC,WAAA,gBAAqDL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACjG,MAAMC,KAAA,GAAQR,uBAAA,CAAwBM,KAAA,EAAOC,GAAA;EAE7CN,6BAAA,CAA8BO,KAAA;EAE9B,MAAM;IAAEP,6BAAA,EAA+BQ;EAAe,CAAE,GAAGN,4BAAA;EAC3DM,eAAA,CAAgBD,KAAA;EAEhB,OAAON,0BAAA,CAA2BM,KAAA;AACpC;AAEAJ,WAAA,CAAYM,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["../../../src/components/MenuPopover/MenuPopover.types.ts"],"sourcesContent":["import type { PortalProps } from '@fluentui/react-portal';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type MenuPopoverSlots = {\n root: Slot<'div'>;\n};\n\n/**\n * MenuPopover Props\n */\nexport type MenuPopoverProps = ComponentProps<MenuPopoverSlots>;\n\n/**\n * State used in rendering MenuPopover\n */\nexport type MenuPopoverState = ComponentState<MenuPopoverSlots> &\n Pick<PortalProps, 'mountNode'> & {\n /**\n * Root menus are rendered out of DOM order on `document.body`, use this to render the menu in DOM order\n * This option is disregarded for submenus\n */\n inline: boolean;\n };\n"],"mappings":"AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["../../../src/components/MenuPopover/index.ts"],"sourcesContent":["export * from './MenuPopover';\nexport * from './MenuPopover.types';\nexport * from './renderMenuPopover';\nexport * from './useMenuPopover';\nexport * from './useMenuPopoverStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
|
|
@@ -10,14 +10,10 @@ export const renderMenuPopover_unstable = state => {
|
|
|
10
10
|
slotProps
|
|
11
11
|
} = getSlots(state);
|
|
12
12
|
if (state.inline) {
|
|
13
|
-
return /*#__PURE__*/React.createElement(slots.root,
|
|
14
|
-
...slotProps.root
|
|
15
|
-
});
|
|
13
|
+
return /*#__PURE__*/React.createElement(slots.root, slotProps.root);
|
|
16
14
|
}
|
|
17
15
|
return /*#__PURE__*/React.createElement(Portal, {
|
|
18
16
|
mountNode: state.mountNode
|
|
19
|
-
}, /*#__PURE__*/React.createElement(slots.root,
|
|
20
|
-
...slotProps.root
|
|
21
|
-
}));
|
|
17
|
+
}, /*#__PURE__*/React.createElement(slots.root, slotProps.root));
|
|
22
18
|
};
|
|
23
19
|
//# sourceMappingURL=renderMenuPopover.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","getSlots","Portal","renderMenuPopover_unstable","state","slots","slotProps","inline","createElement","root","mountNode"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","getSlots","Portal","renderMenuPopover_unstable","state","slots","slotProps","inline","createElement","root","mountNode"],"sources":["../../../src/components/MenuPopover/renderMenuPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport { Portal } from '@fluentui/react-portal';\n\n/**\n * Render the final JSX of MenuPopover\n */\nexport const renderMenuPopover_unstable = (state: MenuPopoverState) => {\n const { slots, slotProps } = getSlots<MenuPopoverSlots>(state);\n\n if (state.inline) {\n return <slots.root {...slotProps.root} />;\n }\n\n return (\n <Portal mountNode={state.mountNode}>\n <slots.root {...slotProps.root} />\n </Portal>\n );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAEzB,SAASC,MAAM,QAAQ;AAEvB;;;AAGA,OAAO,MAAMC,0BAAA,GAA8BC,KAAA,IAA4B;EACrE,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGL,QAAA,CAA2BG,KAAA;EAExD,IAAIA,KAAA,CAAMG,MAAM,EAAE;IAChB,oBAAOP,KAAA,CAAAQ,aAAA,CAACH,KAAA,CAAMI,IAAI,EAAKH,SAAA,CAAUG,IAAI;EACvC;EAEA,oBACET,KAAA,CAAAQ,aAAA,CAACN,MAAA;IAAOQ,SAAA,EAAWN,KAAA,CAAMM;kBACvBV,KAAA,CAAAQ,aAAA,CAACH,KAAA,CAAMI,IAAI,EAAKH,SAAA,CAAUG,IAAI;AAGpC"}
|
|
@@ -15,7 +15,6 @@ import { useIsSubmenu } from '../../utils/useIsSubmenu';
|
|
|
15
15
|
* @param ref - reference to root HTMLElement of MenuPopover
|
|
16
16
|
*/
|
|
17
17
|
export const useMenuPopover_unstable = (props, ref) => {
|
|
18
|
-
var _a;
|
|
19
18
|
const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);
|
|
20
19
|
const setOpen = useMenuContext_unstable(context => context.setOpen);
|
|
21
20
|
const open = useMenuContext_unstable(context => context.open);
|
|
@@ -48,7 +47,8 @@ export const useMenuPopover_unstable = (props, ref) => {
|
|
|
48
47
|
React.useEffect(() => {
|
|
49
48
|
() => clearTimeout(throttleDispatchTimerRef.current);
|
|
50
49
|
}, []);
|
|
51
|
-
|
|
50
|
+
var _useMenuContext_unstable;
|
|
51
|
+
const inline = (_useMenuContext_unstable = useMenuContext_unstable(context => context.inline)) !== null && _useMenuContext_unstable !== void 0 ? _useMenuContext_unstable : false;
|
|
52
52
|
const mountNode = useMenuContext_unstable(context => context.mountNode);
|
|
53
53
|
const rootProps = getNativeElementProps('div', {
|
|
54
54
|
role: 'presentation',
|
|
@@ -71,10 +71,10 @@ export const useMenuPopover_unstable = (props, ref) => {
|
|
|
71
71
|
onMouseEnterOriginal === null || onMouseEnterOriginal === void 0 ? void 0 : onMouseEnterOriginal(event);
|
|
72
72
|
});
|
|
73
73
|
rootProps.onKeyDown = useEventCallback(event => {
|
|
74
|
-
var _a;
|
|
75
74
|
const key = event.key;
|
|
76
75
|
if (key === Escape || isSubmenu && key === CloseArrowKey) {
|
|
77
|
-
|
|
76
|
+
var _popoverRef_current;
|
|
77
|
+
if (open && ((_popoverRef_current = popoverRef.current) === null || _popoverRef_current === void 0 ? void 0 : _popoverRef_current.contains(event.target))) {
|
|
78
78
|
setOpen(event, {
|
|
79
79
|
open: false,
|
|
80
80
|
keyboard: true,
|