@fluentui/react-menu 9.0.0-beta.1 → 9.0.0-beta.5
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +307 -1
- package/CHANGELOG.md +74 -2
- package/dist/react-menu.d.ts +34 -7
- package/lib/components/Menu/Menu.js +3 -3
- package/lib/components/Menu/Menu.js.map +1 -1
- package/lib/components/Menu/Menu.types.d.ts +2 -1
- package/lib/components/Menu/renderMenu.js +1 -1
- package/lib/components/Menu/renderMenu.js.map +1 -1
- package/lib/components/Menu/useMenu.js +95 -112
- package/lib/components/Menu/useMenu.js.map +1 -1
- package/lib/components/Menu/useMenuContextValues.js +34 -32
- package/lib/components/Menu/useMenuContextValues.js.map +1 -1
- package/lib/components/MenuDivider/MenuDivider.js +2 -2
- package/lib/components/MenuDivider/MenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/renderMenuDivider.js +6 -7
- package/lib/components/MenuDivider/renderMenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/useMenuDivider.js +6 -7
- package/lib/components/MenuDivider/useMenuDivider.js.map +1 -1
- package/lib/components/MenuDivider/useMenuDividerStyles.d.ts +1 -0
- package/lib/components/MenuDivider/useMenuDividerStyles.js +5 -4
- package/lib/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
- package/lib/components/MenuGroup/MenuGroup.js +5 -3
- package/lib/components/MenuGroup/MenuGroup.js.map +1 -1
- package/lib/components/MenuGroup/index.d.ts +1 -0
- package/lib/components/MenuGroup/index.js +1 -0
- package/lib/components/MenuGroup/index.js.map +1 -1
- package/lib/components/MenuGroup/renderMenuGroup.js +6 -7
- package/lib/components/MenuGroup/renderMenuGroup.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroup.js +6 -6
- package/lib/components/MenuGroup/useMenuGroup.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroupContextValues.js +7 -7
- package/lib/components/MenuGroup/useMenuGroupContextValues.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroupStyles.d.ts +3 -0
- package/lib/components/MenuGroup/useMenuGroupStyles.js +7 -0
- package/lib/components/MenuGroup/useMenuGroupStyles.js.map +1 -0
- package/lib/components/MenuGroupHeader/MenuGroupHeader.js +2 -2
- package/lib/components/MenuGroupHeader/MenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js +6 -7
- package/lib/components/MenuGroupHeader/renderMenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeader.js +8 -6
- package/lib/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.d.ts +1 -0
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +5 -4
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
- package/lib/components/MenuItem/MenuItem.js +2 -2
- package/lib/components/MenuItem/MenuItem.js.map +1 -1
- package/lib/components/MenuItem/renderMenuItem.js +6 -7
- package/lib/components/MenuItem/renderMenuItem.js.map +1 -1
- package/lib/components/MenuItem/useCharacterSearch.js +6 -6
- package/lib/components/MenuItem/useCharacterSearch.js.map +1 -1
- package/lib/components/MenuItem/useMenuItem.js +31 -36
- package/lib/components/MenuItem/useMenuItem.js.map +1 -1
- package/lib/components/MenuItem/useMenuItemStyles.d.ts +1 -0
- package/lib/components/MenuItem/useMenuItemStyles.js +5 -4
- package/lib/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib/components/MenuItemCheckbox/MenuItemCheckbox.js +4 -4
- package/lib/components/MenuItemCheckbox/MenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/index.d.ts +1 -0
- package/lib/components/MenuItemCheckbox/index.js +1 -0
- package/lib/components/MenuItemCheckbox/index.js.map +1 -1
- package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js +6 -7
- package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.js +12 -13
- package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.d.ts +2 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js +4 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
- package/lib/components/MenuItemRadio/MenuItemRadio.js +2 -2
- package/lib/components/MenuItemRadio/MenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/index.d.ts +1 -0
- package/lib/components/MenuItemRadio/index.js +1 -0
- package/lib/components/MenuItemRadio/index.js.map +1 -1
- package/lib/components/MenuItemRadio/renderMenuItemRadio.js +6 -7
- package/lib/components/MenuItemRadio/renderMenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadio.js +12 -12
- package/lib/components/MenuItemRadio/useMenuItemRadio.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.d.ts +1 -0
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js +4 -1
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib/components/MenuList/MenuList.js +3 -3
- package/lib/components/MenuList/MenuList.js.map +1 -1
- package/lib/components/MenuList/MenuList.types.d.ts +8 -6
- package/lib/components/MenuList/renderMenuList.js +6 -7
- package/lib/components/MenuList/renderMenuList.js.map +1 -1
- package/lib/components/MenuList/useMenuList.js +66 -86
- package/lib/components/MenuList/useMenuList.js.map +1 -1
- package/lib/components/MenuList/useMenuListContextValues.js +18 -16
- package/lib/components/MenuList/useMenuListContextValues.js.map +1 -1
- package/lib/components/MenuList/useMenuListStyles.d.ts +1 -0
- package/lib/components/MenuList/useMenuListStyles.js +5 -4
- package/lib/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib/components/MenuPopover/MenuPopover.js +2 -2
- package/lib/components/MenuPopover/MenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/renderMenuPopover.js +7 -7
- package/lib/components/MenuPopover/renderMenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopover.js +29 -38
- package/lib/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopoverStyles.d.ts +1 -0
- package/lib/components/MenuPopover/useMenuPopoverStyles.js +7 -6
- package/lib/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
- package/lib/components/MenuTrigger/MenuTrigger.js +2 -2
- package/lib/components/MenuTrigger/MenuTrigger.js.map +1 -1
- package/lib/components/MenuTrigger/renderMenuTrigger.js +1 -1
- package/lib/components/MenuTrigger/renderMenuTrigger.js.map +1 -1
- package/lib/components/MenuTrigger/useMenuTrigger.js +3 -4
- package/lib/components/MenuTrigger/useMenuTrigger.js.map +1 -1
- package/lib/components/MenuTrigger/useTriggerElement.js +51 -65
- package/lib/components/MenuTrigger/useTriggerElement.js.map +1 -1
- package/lib/contexts/menuContext.js +5 -11
- package/lib/contexts/menuContext.js.map +1 -1
- package/lib/contexts/menuGroupContext.js +3 -5
- package/lib/contexts/menuGroupContext.js.map +1 -1
- package/lib/contexts/menuListContext.js +7 -17
- package/lib/contexts/menuListContext.js.map +1 -1
- package/lib/contexts/menuTriggerContext.js +3 -5
- package/lib/contexts/menuTriggerContext.js.map +1 -1
- package/lib/selectable/useCheckmarkStyles.js +3 -3
- package/lib/selectable/useCheckmarkStyles.js.map +1 -1
- package/lib/utils/useIsSubmenu.js +2 -4
- package/lib/utils/useIsSubmenu.js.map +1 -1
- package/lib/utils/useOnMenuEnter.js +16 -14
- package/lib/utils/useOnMenuEnter.js.map +1 -1
- package/lib-commonjs/Menu.js +1 -1
- package/lib-commonjs/MenuDivider.js +1 -1
- package/lib-commonjs/MenuGroup.js +1 -1
- package/lib-commonjs/MenuGroupHeader.js +1 -1
- package/lib-commonjs/MenuItem.js +1 -1
- package/lib-commonjs/MenuItemCheckbox.js +1 -1
- package/lib-commonjs/MenuItemRadio.js +1 -1
- package/lib-commonjs/MenuList.js +1 -1
- package/lib-commonjs/MenuPopover.js +1 -1
- package/lib-commonjs/MenuTrigger.js +1 -1
- package/lib-commonjs/components/Menu/Menu.js +6 -6
- package/lib-commonjs/components/Menu/Menu.js.map +1 -1
- package/lib-commonjs/components/Menu/Menu.types.d.ts +2 -1
- package/lib-commonjs/components/Menu/index.js +1 -1
- package/lib-commonjs/components/Menu/renderMenu.js +3 -3
- package/lib-commonjs/components/Menu/renderMenu.js.map +1 -1
- package/lib-commonjs/components/Menu/useMenu.js +104 -122
- package/lib-commonjs/components/Menu/useMenu.js.map +1 -1
- package/lib-commonjs/components/Menu/useMenuContextValues.js +34 -32
- package/lib-commonjs/components/Menu/useMenuContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/MenuDivider.js +6 -6
- package/lib-commonjs/components/MenuDivider/MenuDivider.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/index.js +1 -1
- package/lib-commonjs/components/MenuDivider/renderMenuDivider.js +8 -10
- package/lib-commonjs/components/MenuDivider/renderMenuDivider.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDivider.js +7 -9
- package/lib-commonjs/components/MenuDivider/useMenuDivider.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.d.ts +1 -0
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js +8 -6
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/MenuGroup.js +10 -7
- package/lib-commonjs/components/MenuGroup/MenuGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/index.d.ts +1 -0
- package/lib-commonjs/components/MenuGroup/index.js +3 -1
- package/lib-commonjs/components/MenuGroup/index.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/renderMenuGroup.js +9 -11
- package/lib-commonjs/components/MenuGroup/renderMenuGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroup.js +7 -8
- package/lib-commonjs/components/MenuGroup/useMenuGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupContextValues.js +8 -8
- package/lib-commonjs/components/MenuGroup/useMenuGroupContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.d.ts +3 -0
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js +18 -0
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js.map +1 -0
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.js +6 -6
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/index.js +1 -1
- package/lib-commonjs/components/MenuGroupHeader/renderMenuGroupHeader.js +8 -10
- package/lib-commonjs/components/MenuGroupHeader/renderMenuGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.js +10 -9
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.d.ts +1 -0
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +8 -6
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItem/MenuItem.js +7 -7
- package/lib-commonjs/components/MenuItem/MenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/index.js +1 -1
- package/lib-commonjs/components/MenuItem/renderMenuItem.js +9 -11
- package/lib-commonjs/components/MenuItem/renderMenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useCharacterSearch.js +7 -7
- package/lib-commonjs/components/MenuItem/useCharacterSearch.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItem.js +38 -44
- package/lib-commonjs/components/MenuItem/useMenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.d.ts +1 -0
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js +9 -7
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.js +7 -7
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/index.d.ts +1 -0
- package/lib-commonjs/components/MenuItemCheckbox/index.js +3 -1
- package/lib-commonjs/components/MenuItemCheckbox/index.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/renderMenuItemCheckbox.js +9 -11
- package/lib-commonjs/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckbox.js +17 -19
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.d.ts +2 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js +10 -5
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.js +6 -6
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/index.d.ts +1 -0
- package/lib-commonjs/components/MenuItemRadio/index.js +3 -1
- package/lib-commonjs/components/MenuItemRadio/index.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/renderMenuItemRadio.js +9 -11
- package/lib-commonjs/components/MenuItemRadio/renderMenuItemRadio.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadio.js +17 -18
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadio.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.d.ts +1 -0
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js +9 -4
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib-commonjs/components/MenuList/MenuList.js +8 -8
- package/lib-commonjs/components/MenuList/MenuList.js.map +1 -1
- package/lib-commonjs/components/MenuList/MenuList.types.d.ts +8 -6
- package/lib-commonjs/components/MenuList/index.js +1 -1
- package/lib-commonjs/components/MenuList/renderMenuList.js +9 -11
- package/lib-commonjs/components/MenuList/renderMenuList.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuList.js +72 -93
- package/lib-commonjs/components/MenuList/useMenuList.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListContextValues.js +18 -16
- package/lib-commonjs/components/MenuList/useMenuListContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListStyles.d.ts +1 -0
- package/lib-commonjs/components/MenuList/useMenuListStyles.js +8 -6
- package/lib-commonjs/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/MenuPopover.js +6 -6
- package/lib-commonjs/components/MenuPopover/MenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/index.js +1 -1
- package/lib-commonjs/components/MenuPopover/renderMenuPopover.js +10 -11
- package/lib-commonjs/components/MenuPopover/renderMenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopover.js +36 -46
- package/lib-commonjs/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.d.ts +1 -0
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js +10 -8
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.js +4 -4
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/index.js +1 -1
- package/lib-commonjs/components/MenuTrigger/renderMenuTrigger.js +3 -3
- package/lib-commonjs/components/MenuTrigger/renderMenuTrigger.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.js +4 -6
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/useTriggerElement.js +58 -73
- package/lib-commonjs/components/MenuTrigger/useTriggerElement.js.map +1 -1
- package/lib-commonjs/components/index.js +1 -1
- package/lib-commonjs/contexts/menuContext.js +4 -10
- package/lib-commonjs/contexts/menuContext.js.map +1 -1
- package/lib-commonjs/contexts/menuGroupContext.js +3 -5
- package/lib-commonjs/contexts/menuGroupContext.js.map +1 -1
- package/lib-commonjs/contexts/menuListContext.js +6 -16
- package/lib-commonjs/contexts/menuListContext.js.map +1 -1
- package/lib-commonjs/contexts/menuTriggerContext.js +3 -5
- package/lib-commonjs/contexts/menuTriggerContext.js.map +1 -1
- package/lib-commonjs/index.js +1 -1
- package/lib-commonjs/selectable/index.js +1 -1
- package/lib-commonjs/selectable/useCheckmarkStyles.js +4 -4
- package/lib-commonjs/selectable/useCheckmarkStyles.js.map +1 -1
- package/lib-commonjs/utils/index.js +1 -1
- package/lib-commonjs/utils/useIsSubmenu.js +5 -7
- package/lib-commonjs/utils/useIsSubmenu.js.map +1 -1
- package/lib-commonjs/utils/useOnMenuEnter.js +18 -16
- package/lib-commonjs/utils/useOnMenuEnter.js.map +1 -1
- package/package.json +15 -15
- package/lib/common/isConformant.d.ts +0 -4
- package/lib/common/isConformant.js +0 -12
- package/lib/common/isConformant.js.map +0 -1
- package/lib/common/mockUseMenuContext.d.ts +0 -7
- package/lib/common/mockUseMenuContext.js +0 -36
- package/lib/common/mockUseMenuContext.js.map +0 -1
- package/lib/utils/DefaultIcons.d.ts +0 -7
- package/lib/utils/DefaultIcons.js +0 -88
- package/lib/utils/DefaultIcons.js.map +0 -1
- package/lib-commonjs/common/isConformant.d.ts +0 -4
- package/lib-commonjs/common/isConformant.js +0 -23
- package/lib-commonjs/common/isConformant.js.map +0 -1
- package/lib-commonjs/common/mockUseMenuContext.d.ts +0 -7
- package/lib-commonjs/common/mockUseMenuContext.js +0 -47
- package/lib-commonjs/common/mockUseMenuContext.js.map +0 -1
- package/lib-commonjs/utils/DefaultIcons.d.ts +0 -7
- package/lib-commonjs/utils/DefaultIcons.js +0 -100
- package/lib-commonjs/utils/DefaultIcons.js.map +0 -1
@@ -5,20 +5,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.MenuPopover = void 0;
|
7
7
|
|
8
|
-
|
8
|
+
const React = /*#__PURE__*/require("react");
|
9
9
|
|
10
|
-
|
10
|
+
const useMenuPopover_1 = /*#__PURE__*/require("./useMenuPopover");
|
11
11
|
|
12
|
-
|
12
|
+
const useMenuPopoverStyles_1 = /*#__PURE__*/require("./useMenuPopoverStyles");
|
13
13
|
|
14
|
-
|
14
|
+
const renderMenuPopover_1 = /*#__PURE__*/require("./renderMenuPopover");
|
15
15
|
/**
|
16
16
|
* Popover intended to wrap `MenuList` and adds styling and interaction support specific to menus
|
17
17
|
*/
|
18
18
|
|
19
19
|
|
20
|
-
exports.MenuPopover = /*#__PURE__*/React.forwardRef(
|
21
|
-
|
20
|
+
exports.MenuPopover = /*#__PURE__*/React.forwardRef((props, ref) => {
|
21
|
+
const state = useMenuPopover_1.useMenuPopover(props, ref);
|
22
22
|
useMenuPopoverStyles_1.useMenuPopoverStyles(state);
|
23
23
|
return renderMenuPopover_1.renderMenuPopover(state);
|
24
24
|
});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":";;;;;;;AAAA,
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,WAAA,gBAAqD,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAChG,QAAM,KAAK,GAAG,gBAAA,CAAA,cAAA,CAAe,KAAf,EAAsB,GAAtB,CAAd;AAEA,EAAA,sBAAA,CAAA,oBAAA,CAAqB,KAArB;AACA,SAAO,mBAAA,CAAA,iBAAA,CAAkB,KAAlB,CAAP;AACD,CALiE,CAArD;AAOb,OAAA,CAAA,WAAA,CAAY,WAAZ,GAA0B,aAA1B","sourceRoot":""}
|
@@ -5,28 +5,27 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.renderMenuPopover = void 0;
|
7
7
|
|
8
|
-
|
8
|
+
const React = /*#__PURE__*/require("react");
|
9
9
|
|
10
|
-
|
10
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
11
11
|
|
12
|
-
|
13
|
-
|
14
|
-
var react_portal_1 = /*#__PURE__*/require("@fluentui/react-portal");
|
12
|
+
const react_portal_1 = /*#__PURE__*/require("@fluentui/react-portal");
|
15
13
|
/**
|
16
14
|
* Render the final JSX of MenuPopover
|
17
15
|
*/
|
18
16
|
|
19
17
|
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
18
|
+
const renderMenuPopover = state => {
|
19
|
+
const {
|
20
|
+
slots,
|
21
|
+
slotProps
|
22
|
+
} = react_utilities_1.getSlots(state);
|
24
23
|
|
25
24
|
if (state.inline) {
|
26
|
-
return React.createElement(slots.root,
|
25
|
+
return React.createElement(slots.root, Object.assign({}, slotProps.root));
|
27
26
|
}
|
28
27
|
|
29
|
-
return React.createElement(react_portal_1.Portal, null, React.createElement(slots.root,
|
28
|
+
return React.createElement(react_portal_1.Portal, null, React.createElement(slots.root, Object.assign({}, slotProps.root)));
|
30
29
|
};
|
31
30
|
|
32
31
|
exports.renderMenuPopover = renderMenuPopover;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuPopover/renderMenuPopover.tsx"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuPopover/renderMenuPopover.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,cAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;AAEA;;AAEG;;;AACI,MAAM,iBAAiB,GAAI,KAAD,IAA4B;AAC3D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA2B,KAA3B,CAA7B;;AAEA,MAAI,KAAK,CAAC,MAAV,EAAkB;AAChB,WAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CAAP;AACD;;AAED,SACE,KAAA,CAAA,aAAA,CAAC,cAAA,CAAA,MAAD,EAAO,IAAP,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CADF,CADF;AAKD,CAZM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB","sourceRoot":""}
|
@@ -5,21 +5,19 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.useMenuPopover = void 0;
|
7
7
|
|
8
|
-
|
8
|
+
const React = /*#__PURE__*/require("react");
|
9
9
|
|
10
|
-
|
10
|
+
const keyboard_keys_1 = /*#__PURE__*/require("@fluentui/keyboard-keys");
|
11
11
|
|
12
|
-
|
12
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
13
13
|
|
14
|
-
|
14
|
+
const menuContext_1 = /*#__PURE__*/require("../../contexts/menuContext");
|
15
15
|
|
16
|
-
|
16
|
+
const index_1 = /*#__PURE__*/require("../../utils/index");
|
17
17
|
|
18
|
-
|
18
|
+
const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
|
19
19
|
|
20
|
-
|
21
|
-
|
22
|
-
var useIsSubmenu_1 = /*#__PURE__*/require("../../utils/useIsSubmenu");
|
20
|
+
const useIsSubmenu_1 = /*#__PURE__*/require("../../utils/useIsSubmenu");
|
23
21
|
/**
|
24
22
|
* Create the state required to render MenuPopover.
|
25
23
|
*
|
@@ -31,59 +29,51 @@ var useIsSubmenu_1 = /*#__PURE__*/require("../../utils/useIsSubmenu");
|
|
31
29
|
*/
|
32
30
|
|
33
31
|
|
34
|
-
|
32
|
+
const useMenuPopover = (props, ref) => {
|
35
33
|
var _a;
|
36
34
|
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
});
|
46
|
-
|
47
|
-
var canDispatchCustomEventRef = React.useRef(true);
|
48
|
-
var throttleDispatchTimerRef = React.useRef(0);
|
49
|
-
var dir = react_shared_contexts_1.useFluent().dir;
|
50
|
-
var CloseArrowKey = dir === 'ltr' ? keyboard_keys_1.ArrowLeft : keyboard_keys_1.ArrowRight; // use DOM listener since react events propagate up the react tree
|
35
|
+
const popoverRef = menuContext_1.useMenuContext(context => context.menuPopoverRef);
|
36
|
+
const setOpen = menuContext_1.useMenuContext(context => context.setOpen);
|
37
|
+
const openOnHover = menuContext_1.useMenuContext(context => context.openOnHover);
|
38
|
+
const isSubmenu = useIsSubmenu_1.useIsSubmenu();
|
39
|
+
const canDispatchCustomEventRef = React.useRef(true);
|
40
|
+
const throttleDispatchTimerRef = React.useRef(0);
|
41
|
+
const {
|
42
|
+
dir
|
43
|
+
} = react_shared_contexts_1.useFluent();
|
44
|
+
const CloseArrowKey = dir === 'ltr' ? keyboard_keys_1.ArrowLeft : keyboard_keys_1.ArrowRight; // use DOM listener since react events propagate up the react tree
|
51
45
|
// no need to do `contains` logic as menus are all positioned in different portals
|
52
46
|
|
53
|
-
|
47
|
+
const mouseOverListenerCallbackRef = React.useCallback(node => {
|
54
48
|
if (node) {
|
55
49
|
// Dispatches the custom menu mouse enter event with throttling
|
56
50
|
// Needs to trigger on mouseover to support keyboard + mouse together
|
57
51
|
// i.e. keyboard opens submenus while cursor is still on the parent
|
58
|
-
node.addEventListener('mouseover',
|
52
|
+
node.addEventListener('mouseover', e => {
|
59
53
|
if (canDispatchCustomEventRef.current) {
|
60
54
|
canDispatchCustomEventRef.current = false;
|
61
55
|
index_1.dispatchMenuEnterEvent(popoverRef.current, e); // eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
62
56
|
// @ts-ignore #16889 Node setTimeout type leaking
|
63
57
|
|
64
|
-
throttleDispatchTimerRef.current = setTimeout(
|
65
|
-
return canDispatchCustomEventRef.current = true;
|
66
|
-
}, 250);
|
58
|
+
throttleDispatchTimerRef.current = setTimeout(() => canDispatchCustomEventRef.current = true, 250);
|
67
59
|
}
|
68
60
|
});
|
69
61
|
}
|
70
62
|
}, [popoverRef, throttleDispatchTimerRef]);
|
71
|
-
React.useEffect(
|
72
|
-
(
|
73
|
-
return clearTimeout(throttleDispatchTimerRef.current);
|
74
|
-
});
|
63
|
+
React.useEffect(() => {
|
64
|
+
() => clearTimeout(throttleDispatchTimerRef.current);
|
75
65
|
}, []);
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
role: 'presentation'
|
81
|
-
}, props), {
|
66
|
+
const inline = (_a = menuContext_1.useMenuContext(context => context.inline)) !== null && _a !== void 0 ? _a : false;
|
67
|
+
const rootProps = react_utilities_1.getNativeElementProps('div', {
|
68
|
+
role: 'presentation',
|
69
|
+
...props,
|
82
70
|
ref: react_utilities_1.useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef)
|
83
|
-
})
|
84
|
-
|
85
|
-
|
86
|
-
|
71
|
+
});
|
72
|
+
const {
|
73
|
+
onMouseEnter: onMouseEnterOriginal,
|
74
|
+
onKeyDown: onKeyDownOriginal
|
75
|
+
} = rootProps;
|
76
|
+
rootProps.onMouseEnter = react_utilities_1.useEventCallback(e => {
|
87
77
|
if (openOnHover) {
|
88
78
|
setOpen(e, {
|
89
79
|
open: true,
|
@@ -93,10 +83,10 @@ var useMenuPopover = function (props, ref) {
|
|
93
83
|
|
94
84
|
onMouseEnterOriginal === null || onMouseEnterOriginal === void 0 ? void 0 : onMouseEnterOriginal(e);
|
95
85
|
});
|
96
|
-
rootProps.onKeyDown = react_utilities_1.useEventCallback(
|
86
|
+
rootProps.onKeyDown = react_utilities_1.useEventCallback(e => {
|
97
87
|
var _a;
|
98
88
|
|
99
|
-
|
89
|
+
const key = e.key;
|
100
90
|
|
101
91
|
if (key === keyboard_keys_1.Escape || isSubmenu && key === CloseArrowKey) {
|
102
92
|
if ((_a = popoverRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target)) {
|
@@ -118,7 +108,7 @@ var useMenuPopover = function (props, ref) {
|
|
118
108
|
onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(e);
|
119
109
|
});
|
120
110
|
return {
|
121
|
-
inline
|
111
|
+
inline,
|
122
112
|
root: rootProps
|
123
113
|
};
|
124
114
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"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","sourceRoot":""}
|
@@ -3,18 +3,20 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useMenuPopoverStyles = void 0;
|
6
|
+
exports.useMenuPopoverStyles = exports.menuPopoverClassName = void 0;
|
7
7
|
|
8
|
-
|
8
|
+
const react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
|
9
9
|
|
10
|
-
|
10
|
+
exports.menuPopoverClassName = 'fui-MenuPopover';
|
11
|
+
|
12
|
+
const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
|
11
13
|
"root": {
|
12
14
|
"Dimara": "ft85np5",
|
13
15
|
"De3pzq": "fxugw4r",
|
14
16
|
"Bf4jedk": "fkqu4gx",
|
15
17
|
"B2u0y6b": "f1kaai3v",
|
16
18
|
"a9b677": "f1ahpp82",
|
17
|
-
"E5pizo":
|
19
|
+
"E5pizo": "f1hg901r",
|
18
20
|
"z8tnut": "f10ra9hq",
|
19
21
|
"z189sj": ["f8wuabp", "fycuoez"],
|
20
22
|
"Byoj8tv": "f1y2xyjm",
|
@@ -33,16 +35,16 @@ var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
|
|
33
35
|
"zhjwy3": ["fjscplz", "f1gn591s"]
|
34
36
|
}
|
35
37
|
}, {
|
36
|
-
"d": [".ft85np5{border-radius:var(--borderRadiusMedium);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".fkqu4gx{min-width:128px;}", ".f1kaai3v{max-width:300px;}", ".f1ahpp82{width:-webkit-max-content;width:-moz-max-content;width:max-content;}", ".f1hg901r{box-shadow:var(--shadow16);}", ".
|
38
|
+
"d": [".ft85np5{border-radius:var(--borderRadiusMedium);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".fkqu4gx{min-width:128px;}", ".f1kaai3v{max-width:300px;}", ".f1ahpp82{width:-webkit-max-content;width:-moz-max-content;width:max-content;}", ".f1hg901r{box-shadow:var(--shadow16);}", ".f10ra9hq{padding-top:4px;}", ".f8wuabp{padding-right:4px;}", ".fycuoez{padding-left:4px;}", ".f1y2xyjm{padding-bottom:4px;}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}"]
|
37
39
|
});
|
38
40
|
/**
|
39
41
|
* Apply styling to the Menu slots based on the state
|
40
42
|
*/
|
41
43
|
|
42
44
|
|
43
|
-
|
44
|
-
|
45
|
-
state.root.className = react_make_styles_1.mergeClasses(styles.root, state.root.className);
|
45
|
+
const useMenuPopoverStyles = state => {
|
46
|
+
const styles = useStyles();
|
47
|
+
state.root.className = react_make_styles_1.mergeClasses(exports.menuPopoverClassName, styles.root, state.root.className);
|
46
48
|
return state;
|
47
49
|
};
|
48
50
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AAGa,OAAA,CAAA,oBAAA,GAAuB,iBAAvB;;AAEb,MAAM,SAAS,gBAAG,mBAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAaA;;AAEG;;;AACI,MAAM,oBAAoB,GAAI,KAAD,IAA8C;AAChF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,mBAAA,CAAA,YAAA,CAAa,OAAA,CAAA,oBAAb,EAAmC,MAAM,CAAC,IAA1C,EAAgD,KAAK,CAAC,IAAN,CAAW,SAA3D,CAAvB;AACA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourceRoot":""}
|
@@ -5,17 +5,17 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.MenuTrigger = void 0;
|
7
7
|
|
8
|
-
|
8
|
+
const useMenuTrigger_1 = /*#__PURE__*/require("./useMenuTrigger");
|
9
9
|
|
10
|
-
|
10
|
+
const renderMenuTrigger_1 = /*#__PURE__*/require("./renderMenuTrigger");
|
11
11
|
/**
|
12
12
|
* Wraps a trigger element as an only child
|
13
13
|
* and adds the necessary event handling to open a popup menu
|
14
14
|
*/
|
15
15
|
|
16
16
|
|
17
|
-
|
18
|
-
|
17
|
+
const MenuTrigger = props => {
|
18
|
+
const state = useMenuTrigger_1.useMenuTrigger(props);
|
19
19
|
return renderMenuTrigger_1.renderMenuTrigger(state);
|
20
20
|
};
|
21
21
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuTrigger/MenuTrigger.tsx"],"names":[],"mappings":";;;;;;;AACA,
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuTrigger/MenuTrigger.tsx"],"names":[],"mappings":";;;;;;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;AAGA;;;AAGG;;;AACI,MAAM,WAAW,GAA+B,KAAK,IAAG;AAC7D,QAAM,KAAK,GAAG,gBAAA,CAAA,cAAA,CAAe,KAAf,CAAd;AAEA,SAAO,mBAAA,CAAA,iBAAA,CAAkB,KAAlB,CAAP;AACD,CAJM;;AAAM,OAAA,CAAA,WAAA,GAAW,WAAX;AAMb,OAAA,CAAA,WAAA,CAAY,WAAZ,GAA0B,aAA1B","sourceRoot":""}
|
@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.renderMenuTrigger = void 0;
|
7
7
|
|
8
|
-
|
8
|
+
const React = /*#__PURE__*/require("react");
|
9
9
|
|
10
|
-
|
10
|
+
const menuTriggerContext_1 = /*#__PURE__*/require("../../contexts/menuTriggerContext");
|
11
11
|
/**
|
12
12
|
* Render the final JSX of MenuTrigger
|
13
13
|
*
|
@@ -15,7 +15,7 @@ var menuTriggerContext_1 = /*#__PURE__*/require("../../contexts/menuTriggerConte
|
|
15
15
|
*/
|
16
16
|
|
17
17
|
|
18
|
-
|
18
|
+
const renderMenuTrigger = state => {
|
19
19
|
return React.createElement(menuTriggerContext_1.MenuTriggerContextProvider, {
|
20
20
|
value: true
|
21
21
|
}, state.children);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuTrigger/renderMenuTrigger.tsx"],"names":[],"mappings":";;;;;;;AAAA,
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuTrigger/renderMenuTrigger.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,oBAAA,gBAAA,OAAA,CAAA,mCAAA,CAAA;AAGA;;;;AAIG;;;AACI,MAAM,iBAAiB,GAAI,KAAD,IAA4B;AAC3D,SAAO,KAAA,CAAA,aAAA,CAAC,oBAAA,CAAA,0BAAD,EAA2B;AAAC,IAAA,KAAK,EAAE;AAAR,GAA3B,EAA0C,KAAK,CAAC,QAAhD,CAAP;AACD,CAFM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB","sourceRoot":""}
|
@@ -5,9 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.useMenuTrigger = void 0;
|
7
7
|
|
8
|
-
|
9
|
-
|
10
|
-
var useTriggerElement_1 = /*#__PURE__*/require("./useTriggerElement");
|
8
|
+
const useTriggerElement_1 = /*#__PURE__*/require("./useTriggerElement");
|
11
9
|
/**
|
12
10
|
* Create the state required to render MenuTrigger.
|
13
11
|
* Clones the only child component and adds necessary event handling behaviours to open a popup menu
|
@@ -16,9 +14,9 @@ var useTriggerElement_1 = /*#__PURE__*/require("./useTriggerElement");
|
|
16
14
|
*/
|
17
15
|
|
18
16
|
|
19
|
-
|
20
|
-
|
21
|
-
|
17
|
+
const useMenuTrigger = props => {
|
18
|
+
const state = { ...props
|
19
|
+
}; // TODO just move the contents of this hook here
|
22
20
|
|
23
21
|
return useTriggerElement_1.useTriggerElement(state);
|
24
22
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;AAGA;;;;;AAKG;;;AACI,MAAM,cAAc,GAAI,KAAD,IAA8C;AAC1E,QAAM,KAAK,GAAG,EAAE,GAAG;AAAL,GAAd,CAD0E,CAG1E;;AACA,SAAO,mBAAA,CAAA,iBAAA,CAAkB,KAAlB,CAAP;AACD,CALM;;AAAM,OAAA,CAAA,cAAA,GAAc,cAAd","sourceRoot":""}
|
@@ -5,66 +5,52 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.useTriggerElement = void 0;
|
7
7
|
|
8
|
-
|
8
|
+
const React = /*#__PURE__*/require("react");
|
9
9
|
|
10
|
-
|
10
|
+
const keyboard_keys_1 = /*#__PURE__*/require("@fluentui/keyboard-keys");
|
11
11
|
|
12
|
-
|
12
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
13
13
|
|
14
|
-
|
14
|
+
const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
|
15
15
|
|
16
|
-
|
16
|
+
const menuContext_1 = /*#__PURE__*/require("../../contexts/menuContext");
|
17
17
|
|
18
|
-
|
18
|
+
const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
|
19
19
|
|
20
|
-
|
20
|
+
const useIsSubmenu_1 = /*#__PURE__*/require("../../utils/useIsSubmenu");
|
21
21
|
|
22
|
-
|
23
|
-
|
24
|
-
var noop = function () {
|
25
|
-
return null;
|
26
|
-
};
|
22
|
+
const noop = () => null;
|
27
23
|
/**
|
28
24
|
* Adds the necessary props to the trigger element
|
29
25
|
*/
|
30
26
|
|
31
27
|
|
32
|
-
|
28
|
+
const useTriggerElement = state => {
|
33
29
|
var _a, _b;
|
34
30
|
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
return context.triggerId;
|
49
|
-
});
|
50
|
-
var openOnHover = menuContext_1.useMenuContext(function (context) {
|
51
|
-
return context.openOnHover;
|
52
|
-
});
|
53
|
-
var openOnContext = menuContext_1.useMenuContext(function (context) {
|
54
|
-
return context.openOnContext;
|
55
|
-
});
|
56
|
-
var isSubmenu = useIsSubmenu_1.useIsSubmenu();
|
57
|
-
var findFirstFocusable = react_tabster_1.useFocusFinders().findFirstFocusable;
|
58
|
-
var focusFirst = React.useCallback(function () {
|
59
|
-
var firstFocusable = findFirstFocusable(menuPopoverRef.current);
|
31
|
+
const triggerRef = menuContext_1.useMenuContext(context => context.triggerRef);
|
32
|
+
const menuPopoverRef = menuContext_1.useMenuContext(context => context.menuPopoverRef);
|
33
|
+
const setOpen = menuContext_1.useMenuContext(context => context.setOpen);
|
34
|
+
const open = menuContext_1.useMenuContext(context => context.open);
|
35
|
+
const triggerId = menuContext_1.useMenuContext(context => context.triggerId);
|
36
|
+
const openOnHover = menuContext_1.useMenuContext(context => context.openOnHover);
|
37
|
+
const openOnContext = menuContext_1.useMenuContext(context => context.openOnContext);
|
38
|
+
const isSubmenu = useIsSubmenu_1.useIsSubmenu();
|
39
|
+
const {
|
40
|
+
findFirstFocusable
|
41
|
+
} = react_tabster_1.useFocusFinders();
|
42
|
+
const focusFirst = React.useCallback(() => {
|
43
|
+
const firstFocusable = findFirstFocusable(menuPopoverRef.current);
|
60
44
|
firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
|
61
45
|
}, [findFirstFocusable, menuPopoverRef]);
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
46
|
+
const openedWithKeyboardRef = React.useRef(false);
|
47
|
+
const hasMouseMoved = React.useRef(false);
|
48
|
+
const {
|
49
|
+
dir
|
50
|
+
} = react_shared_contexts_1.useFluent();
|
51
|
+
const OpenArrowKey = dir === 'ltr' ? keyboard_keys_1.ArrowRight : keyboard_keys_1.ArrowLeft;
|
52
|
+
const child = React.isValidElement(state.children) ? react_utilities_1.onlyChild(state.children) : undefined;
|
53
|
+
const onContextMenu = react_utilities_1.useEventCallback(e => {
|
68
54
|
var _a, _b;
|
69
55
|
|
70
56
|
if (openOnContext) {
|
@@ -77,7 +63,7 @@ var useTriggerElement = function (state) {
|
|
77
63
|
|
78
64
|
(_b = (_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.onContextMenu) === null || _b === void 0 ? void 0 : _b.call(_a, e);
|
79
65
|
});
|
80
|
-
|
66
|
+
const onClick = react_utilities_1.useEventCallback(e => {
|
81
67
|
var _a, _b;
|
82
68
|
|
83
69
|
if (!openOnContext) {
|
@@ -90,7 +76,7 @@ var useTriggerElement = function (state) {
|
|
90
76
|
|
91
77
|
(_b = (_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
|
92
78
|
});
|
93
|
-
|
79
|
+
const onKeyDown = react_utilities_1.useEventCallback(e => {
|
94
80
|
var _a, _b, _c;
|
95
81
|
|
96
82
|
if (react_utilities_1.shouldPreventDefaultOnKeyDown(e)) {
|
@@ -99,7 +85,7 @@ var useTriggerElement = function (state) {
|
|
99
85
|
(_a = e.target) === null || _a === void 0 ? void 0 : _a.click();
|
100
86
|
}
|
101
87
|
|
102
|
-
|
88
|
+
const key = e.key;
|
103
89
|
|
104
90
|
if (!openOnContext && (isSubmenu && key === OpenArrowKey || !isSubmenu && key === keyboard_keys_1.ArrowDown)) {
|
105
91
|
setOpen(e, {
|
@@ -126,7 +112,7 @@ var useTriggerElement = function (state) {
|
|
126
112
|
|
127
113
|
(_c = (_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.onKeyDown) === null || _c === void 0 ? void 0 : _c.call(_b, e);
|
128
114
|
});
|
129
|
-
|
115
|
+
const onMouseEnter = react_utilities_1.useEventCallback(e => {
|
130
116
|
var _a, _b;
|
131
117
|
|
132
118
|
if (openOnHover && hasMouseMoved.current) {
|
@@ -141,7 +127,7 @@ var useTriggerElement = function (state) {
|
|
141
127
|
// First time open the mouse using mousemove and then continue with mouseenter
|
142
128
|
// Only use once to determine that the user is using the mouse since it is an expensive event to handle
|
143
129
|
|
144
|
-
|
130
|
+
const onMouseMove = react_utilities_1.useEventCallback(e => {
|
145
131
|
if (openOnHover && !hasMouseMoved.current) {
|
146
132
|
setOpen(e, {
|
147
133
|
open: true,
|
@@ -150,7 +136,7 @@ var useTriggerElement = function (state) {
|
|
150
136
|
hasMouseMoved.current = true;
|
151
137
|
}
|
152
138
|
});
|
153
|
-
|
139
|
+
const onMouseLeave = react_utilities_1.useEventCallback(e => {
|
154
140
|
var _a, _b;
|
155
141
|
|
156
142
|
if (openOnHover) {
|
@@ -162,32 +148,31 @@ var useTriggerElement = function (state) {
|
|
162
148
|
|
163
149
|
(_b = (_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.onMouseLeave) === null || _b === void 0 ? void 0 : _b.call(_a, e);
|
164
150
|
});
|
165
|
-
|
166
|
-
|
167
|
-
var triggerProps = tslib_1.__assign({
|
151
|
+
const disabled = (_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.disabled;
|
152
|
+
const triggerProps = {
|
168
153
|
'aria-haspopup': true,
|
169
154
|
'aria-expanded': open,
|
170
|
-
id: ((_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.id) || triggerId
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
state.children = react_utilities_1.applyTriggerPropsToChildren(state.children,
|
155
|
+
id: ((_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.id) || triggerId,
|
156
|
+
...(!disabled ? {
|
157
|
+
onClick,
|
158
|
+
onMouseEnter,
|
159
|
+
onMouseLeave,
|
160
|
+
onContextMenu,
|
161
|
+
onKeyDown,
|
162
|
+
onMouseMove
|
163
|
+
} : // Spread disabled event handlers to implement contract and avoid specific disabled logic in handlers
|
164
|
+
{
|
165
|
+
onClick: noop,
|
166
|
+
onMouseEnter: noop,
|
167
|
+
onMouseLeave: noop,
|
168
|
+
onContextMenu: noop,
|
169
|
+
onKeyDown: noop,
|
170
|
+
onMouseMove: noop
|
171
|
+
})
|
172
|
+
};
|
173
|
+
state.children = react_utilities_1.applyTriggerPropsToChildren(state.children, { ...triggerProps,
|
189
174
|
ref: react_utilities_1.useMergedRefs(typeof state.children !== 'function' && state.children.ref || null, triggerRef)
|
190
|
-
})
|
175
|
+
});
|
191
176
|
return state;
|
192
177
|
};
|
193
178
|
|