@fluentui/react-menu 0.0.0-nightly58c310891320211216.1 → 0.0.0-nightly5ab766c40f20220114.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.
Files changed (113) hide show
  1. package/CHANGELOG.json +86 -26
  2. package/CHANGELOG.md +25 -16
  3. package/Spec.md +21 -16
  4. package/dist/react-menu.d.ts +45 -6
  5. package/lib/MenuSplitGroup.d.ts +1 -0
  6. package/lib/MenuSplitGroup.js +2 -0
  7. package/lib/MenuSplitGroup.js.map +1 -0
  8. package/lib/components/Menu/useMenu.js +21 -16
  9. package/lib/components/Menu/useMenu.js.map +1 -1
  10. package/lib/components/MenuDivider/useMenuDivider.js +3 -0
  11. package/lib/components/MenuDivider/useMenuDivider.js.map +1 -1
  12. package/lib/components/MenuDivider/useMenuDividerStyles.js +1 -0
  13. package/lib/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
  14. package/lib/components/MenuGroup/useMenuGroup.js +3 -0
  15. package/lib/components/MenuGroup/useMenuGroup.js.map +1 -1
  16. package/lib/components/MenuGroupHeader/useMenuGroupHeader.js +3 -0
  17. package/lib/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
  18. package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +1 -0
  19. package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
  20. package/lib/components/MenuItem/MenuItem.types.d.ts +1 -1
  21. package/lib/components/MenuItem/renderMenuItem.js +1 -2
  22. package/lib/components/MenuItem/renderMenuItem.js.map +1 -1
  23. package/lib/components/MenuItem/useMenuItem.d.ts +1 -5
  24. package/lib/components/MenuItem/useMenuItem.js +3 -8
  25. package/lib/components/MenuItem/useMenuItem.js.map +1 -1
  26. package/lib/components/MenuItem/useMenuItemStyles.js +16 -20
  27. package/lib/components/MenuItem/useMenuItemStyles.js.map +1 -1
  28. package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js +1 -2
  29. package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map +1 -1
  30. package/lib/components/MenuItemRadio/renderMenuItemRadio.js +1 -2
  31. package/lib/components/MenuItemRadio/renderMenuItemRadio.js.map +1 -1
  32. package/lib/components/MenuList/useMenuList.js +3 -0
  33. package/lib/components/MenuList/useMenuList.js.map +1 -1
  34. package/lib/components/MenuPopover/useMenuPopover.js +3 -0
  35. package/lib/components/MenuPopover/useMenuPopover.js.map +1 -1
  36. package/lib/components/MenuPopover/useMenuPopoverStyles.js +1 -0
  37. package/lib/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
  38. package/lib/components/MenuSplitGroup/MenuSplitGroup.d.ts +6 -0
  39. package/lib/components/MenuSplitGroup/MenuSplitGroup.js +15 -0
  40. package/lib/components/MenuSplitGroup/MenuSplitGroup.js.map +1 -0
  41. package/lib/components/MenuSplitGroup/MenuSplitGroup.types.d.ts +13 -0
  42. package/lib/components/MenuSplitGroup/MenuSplitGroup.types.js +2 -0
  43. package/lib/components/MenuSplitGroup/MenuSplitGroup.types.js.map +1 -0
  44. package/lib/components/MenuSplitGroup/index.d.ts +5 -0
  45. package/lib/components/MenuSplitGroup/index.js +6 -0
  46. package/lib/components/MenuSplitGroup/index.js.map +1 -0
  47. package/lib/components/MenuSplitGroup/renderMenuSplitGroup.d.ts +5 -0
  48. package/lib/components/MenuSplitGroup/renderMenuSplitGroup.js +15 -0
  49. package/lib/components/MenuSplitGroup/renderMenuSplitGroup.js.map +1 -0
  50. package/lib/components/MenuSplitGroup/useMenuSplitGroup.d.ts +12 -0
  51. package/lib/components/MenuSplitGroup/useMenuSplitGroup.js +67 -0
  52. package/lib/components/MenuSplitGroup/useMenuSplitGroup.js.map +1 -0
  53. package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.d.ts +6 -0
  54. package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js +35 -0
  55. package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -0
  56. package/lib/index.d.ts +11 -10
  57. package/lib/index.js +11 -10
  58. package/lib/index.js.map +1 -1
  59. package/lib-commonjs/MenuSplitGroup.d.ts +1 -0
  60. package/lib-commonjs/MenuSplitGroup.js +10 -0
  61. package/lib-commonjs/MenuSplitGroup.js.map +1 -0
  62. package/lib-commonjs/components/Menu/useMenu.js +25 -21
  63. package/lib-commonjs/components/Menu/useMenu.js.map +1 -1
  64. package/lib-commonjs/components/MenuDivider/useMenuDivider.js +3 -0
  65. package/lib-commonjs/components/MenuDivider/useMenuDivider.js.map +1 -1
  66. package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js +2 -0
  67. package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
  68. package/lib-commonjs/components/MenuGroup/useMenuGroup.js +3 -0
  69. package/lib-commonjs/components/MenuGroup/useMenuGroup.js.map +1 -1
  70. package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.js +3 -0
  71. package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.js.map +1 -1
  72. package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +2 -0
  73. package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
  74. package/lib-commonjs/components/MenuItem/MenuItem.types.d.ts +1 -1
  75. package/lib-commonjs/components/MenuItem/renderMenuItem.js +1 -3
  76. package/lib-commonjs/components/MenuItem/renderMenuItem.js.map +1 -1
  77. package/lib-commonjs/components/MenuItem/useMenuItem.d.ts +1 -5
  78. package/lib-commonjs/components/MenuItem/useMenuItem.js +5 -10
  79. package/lib-commonjs/components/MenuItem/useMenuItem.js.map +1 -1
  80. package/lib-commonjs/components/MenuItem/useMenuItemStyles.js +17 -20
  81. package/lib-commonjs/components/MenuItem/useMenuItemStyles.js.map +1 -1
  82. package/lib-commonjs/components/MenuItemCheckbox/renderMenuItemCheckbox.js +1 -3
  83. package/lib-commonjs/components/MenuItemCheckbox/renderMenuItemCheckbox.js.map +1 -1
  84. package/lib-commonjs/components/MenuItemRadio/renderMenuItemRadio.js +1 -3
  85. package/lib-commonjs/components/MenuItemRadio/renderMenuItemRadio.js.map +1 -1
  86. package/lib-commonjs/components/MenuList/useMenuList.js +3 -0
  87. package/lib-commonjs/components/MenuList/useMenuList.js.map +1 -1
  88. package/lib-commonjs/components/MenuPopover/useMenuPopover.js +3 -0
  89. package/lib-commonjs/components/MenuPopover/useMenuPopover.js.map +1 -1
  90. package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js +2 -0
  91. package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
  92. package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.d.ts +6 -0
  93. package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.js +26 -0
  94. package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.js.map +1 -0
  95. package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.d.ts +13 -0
  96. package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.js +6 -0
  97. package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.js.map +1 -0
  98. package/lib-commonjs/components/MenuSplitGroup/index.d.ts +5 -0
  99. package/lib-commonjs/components/MenuSplitGroup/index.js +18 -0
  100. package/lib-commonjs/components/MenuSplitGroup/index.js.map +1 -0
  101. package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.d.ts +5 -0
  102. package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.js +26 -0
  103. package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.js.map +1 -0
  104. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.d.ts +12 -0
  105. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.js +81 -0
  106. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.js.map +1 -0
  107. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.d.ts +6 -0
  108. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js +47 -0
  109. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -0
  110. package/lib-commonjs/index.d.ts +11 -10
  111. package/lib-commonjs/index.js +16 -14
  112. package/lib-commonjs/index.js.map +1 -1
  113. package/package.json +12 -12
@@ -7,6 +7,8 @@ exports.useMenuPopoverStyles = exports.menuPopoverClassName = void 0;
7
7
 
8
8
  const react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
9
9
 
10
+ const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
+
10
12
  exports.menuPopoverClassName = 'fui-MenuPopover';
11
13
 
12
14
  const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
@@ -1 +1 @@
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;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":""}
1
+ {"version":3,"sources":["../../../src/components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,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;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":""}
@@ -0,0 +1,6 @@
1
+ import type { MenuSplitGroupProps } from './MenuSplitGroup.types';
2
+ import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
+ /**
4
+ * Layout wrapper that provides extra keyboard navigation behavior for two `MenuItem` components.
5
+ */
6
+ export declare const MenuSplitGroup: ForwardRefComponent<MenuSplitGroupProps>;
@@ -0,0 +1,26 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.MenuSplitGroup = void 0;
7
+
8
+ const React = /*#__PURE__*/require("react");
9
+
10
+ const useMenuSplitGroup_1 = /*#__PURE__*/require("./useMenuSplitGroup");
11
+
12
+ const renderMenuSplitGroup_1 = /*#__PURE__*/require("./renderMenuSplitGroup");
13
+
14
+ const useMenuSplitGroupStyles_1 = /*#__PURE__*/require("./useMenuSplitGroupStyles");
15
+ /**
16
+ * Layout wrapper that provides extra keyboard navigation behavior for two `MenuItem` components.
17
+ */
18
+
19
+
20
+ exports.MenuSplitGroup = /*#__PURE__*/React.forwardRef((props, ref) => {
21
+ const state = useMenuSplitGroup_1.useMenuSplitGroup(props, ref);
22
+ useMenuSplitGroupStyles_1.useMenuSplitGroupStyles(state);
23
+ return renderMenuSplitGroup_1.renderMenuSplitGroup(state);
24
+ });
25
+ exports.MenuSplitGroup.displayName = 'MenuSplitGroup';
26
+ //# sourceMappingURL=MenuSplitGroup.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/MenuSplitGroup/MenuSplitGroup.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,yBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,cAAA,gBAA2D,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtG,QAAM,KAAK,GAAG,mBAAA,CAAA,iBAAA,CAAkB,KAAlB,EAAyB,GAAzB,CAAd;AAEA,EAAA,yBAAA,CAAA,uBAAA,CAAwB,KAAxB;AACA,SAAO,sBAAA,CAAA,oBAAA,CAAqB,KAArB,CAAP;AACD,CALuE,CAA3D;AAOb,OAAA,CAAA,cAAA,CAAe,WAAf,GAA6B,gBAA7B","sourceRoot":""}
@@ -0,0 +1,13 @@
1
+ import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
2
+ export declare type MenuSplitGroupSlots = {
3
+ root: IntrinsicShorthandProps<'div'>;
4
+ };
5
+ export declare type MenuSplitGroupCommons = {};
6
+ /**
7
+ * MenuSplitGroup Props
8
+ */
9
+ export declare type MenuSplitGroupProps = ComponentProps<MenuSplitGroupSlots> & MenuSplitGroupCommons;
10
+ /**
11
+ * State used in rendering MenuSplitGroup
12
+ */
13
+ export declare type MenuSplitGroupState = ComponentState<MenuSplitGroupSlots> & MenuSplitGroupCommons;
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ //# sourceMappingURL=MenuSplitGroup.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
@@ -0,0 +1,5 @@
1
+ export * from './MenuSplitGroup';
2
+ export * from './MenuSplitGroup.types';
3
+ export * from './renderMenuSplitGroup';
4
+ export * from './useMenuSplitGroup';
5
+ export * from './useMenuSplitGroupStyles';
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+
7
+ const tslib_1 = /*#__PURE__*/require("tslib");
8
+
9
+ tslib_1.__exportStar(require("./MenuSplitGroup"), exports);
10
+
11
+ tslib_1.__exportStar(require("./MenuSplitGroup.types"), exports);
12
+
13
+ tslib_1.__exportStar(require("./renderMenuSplitGroup"), exports);
14
+
15
+ tslib_1.__exportStar(require("./useMenuSplitGroup"), exports);
16
+
17
+ tslib_1.__exportStar(require("./useMenuSplitGroupStyles"), exports);
18
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/MenuSplitGroup/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,2BAAA,CAAA,EAAA,OAAA","sourceRoot":""}
@@ -0,0 +1,5 @@
1
+ import type { MenuSplitGroupState } from './MenuSplitGroup.types';
2
+ /**
3
+ * Render the final JSX of MenuSplitGroup
4
+ */
5
+ export declare const renderMenuSplitGroup: (state: MenuSplitGroupState) => JSX.Element;
@@ -0,0 +1,26 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.renderMenuSplitGroup = void 0;
7
+
8
+ const React = /*#__PURE__*/require("react");
9
+
10
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
11
+ /**
12
+ * Render the final JSX of MenuSplitGroup
13
+ */
14
+
15
+
16
+ const renderMenuSplitGroup = state => {
17
+ const {
18
+ slots,
19
+ slotProps
20
+ } = react_utilities_1.getSlots(state);
21
+ return React.createElement(slots.root, { ...slotProps.root
22
+ });
23
+ };
24
+
25
+ exports.renderMenuSplitGroup = renderMenuSplitGroup;
26
+ //# sourceMappingURL=renderMenuSplitGroup.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/MenuSplitGroup/renderMenuSplitGroup.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,oBAAoB,GAAI,KAAD,IAA+B;AACjE,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA8B,KAA9B,CAA7B;AAEA,SAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAAP;AACD,CAJM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourceRoot":""}
@@ -0,0 +1,12 @@
1
+ import * as React from 'react';
2
+ import type { MenuSplitGroupProps, MenuSplitGroupState } from './MenuSplitGroup.types';
3
+ /**
4
+ * Create the state required to render MenuSplitGroup.
5
+ *
6
+ * The returned state can be modified with hooks such as useMenuSplitGroupStyles,
7
+ * before being passed to renderMenuSplitGroup.
8
+ *
9
+ * @param props - props from this instance of MenuSplitGroup
10
+ * @param ref - reference to root HTMLElement of MenuSplitGroup
11
+ */
12
+ export declare const useMenuSplitGroup: (props: MenuSplitGroupProps, ref: React.Ref<HTMLElement>) => MenuSplitGroupState;
@@ -0,0 +1,81 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useMenuSplitGroup = void 0;
7
+
8
+ const React = /*#__PURE__*/require("react");
9
+
10
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
11
+
12
+ const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
13
+
14
+ const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
15
+
16
+ const keyboard_keys_1 = /*#__PURE__*/require("@fluentui/keyboard-keys");
17
+ /**
18
+ * Create the state required to render MenuSplitGroup.
19
+ *
20
+ * The returned state can be modified with hooks such as useMenuSplitGroupStyles,
21
+ * before being passed to renderMenuSplitGroup.
22
+ *
23
+ * @param props - props from this instance of MenuSplitGroup
24
+ * @param ref - reference to root HTMLElement of MenuSplitGroup
25
+ */
26
+
27
+
28
+ const useMenuSplitGroup = (props, ref) => {
29
+ const innerRef = React.useRef();
30
+ const {
31
+ dir,
32
+ targetDocument
33
+ } = react_shared_contexts_1.useFluent();
34
+ const nextArrowKey = react_utilities_1.getRTLSafeKey(keyboard_keys_1.ArrowRight, dir);
35
+ const prevArrowKey = react_utilities_1.getRTLSafeKey(keyboard_keys_1.ArrowLeft, dir);
36
+ const {
37
+ findNextFocusable,
38
+ findPrevFocusable
39
+ } = react_tabster_1.useFocusFinders();
40
+ const onKeyDown = React.useCallback(e => {
41
+ var _a;
42
+
43
+ const activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;
44
+
45
+ if (!activeElement) {
46
+ return;
47
+ }
48
+
49
+ if (!((_a = innerRef.current) === null || _a === void 0 ? void 0 : _a.contains(activeElement))) {
50
+ return;
51
+ }
52
+
53
+ if (e.key === nextArrowKey) {
54
+ const next = findNextFocusable(activeElement, {
55
+ container: innerRef.current
56
+ });
57
+ next === null || next === void 0 ? void 0 : next.focus();
58
+ }
59
+
60
+ if (e.key === prevArrowKey) {
61
+ const prev = findPrevFocusable(activeElement, {
62
+ container: innerRef.current
63
+ });
64
+ prev === null || prev === void 0 ? void 0 : prev.focus();
65
+ }
66
+ }, [findNextFocusable, findPrevFocusable, targetDocument, nextArrowKey, prevArrowKey]);
67
+ return {
68
+ components: {
69
+ root: 'div'
70
+ },
71
+ root: react_utilities_1.getNativeElementProps('div', {
72
+ role: 'group',
73
+ ref: react_utilities_1.useMergedRefs(ref, innerRef),
74
+ onKeyDown,
75
+ ...props
76
+ })
77
+ };
78
+ };
79
+
80
+ exports.useMenuSplitGroup = useMenuSplitGroup;
81
+ //# sourceMappingURL=useMenuSplitGroup.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/MenuSplitGroup/useMenuSplitGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AAEA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;AAEA;;;;;;;;AAQG;;;AACI,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAA6B,GAA7B,KAAiF;AAChH,QAAM,QAAQ,GAAG,KAAK,CAAC,MAAN,EAAjB;AACA,QAAM;AAAE,IAAA,GAAF;AAAO,IAAA;AAAP,MAA0B,uBAAA,CAAA,SAAA,EAAhC;AAEA,QAAM,YAAY,GAAG,iBAAA,CAAA,aAAA,CAAc,eAAA,CAAA,UAAd,EAA0B,GAA1B,CAArB;AACA,QAAM,YAAY,GAAG,iBAAA,CAAA,aAAA,CAAc,eAAA,CAAA,SAAd,EAAyB,GAAzB,CAArB;AAEA,QAAM;AAAE,IAAA,iBAAF;AAAqB,IAAA;AAArB,MAA2C,eAAA,CAAA,eAAA,EAAjD;AAEA,QAAM,SAAS,GAAG,KAAK,CAAC,WAAN,CACf,CAAD,IAAwC;;;AACtC,UAAM,aAAa,GAAG,cAAc,KAAA,IAAd,IAAA,cAAc,KAAA,KAAA,CAAd,GAAc,KAAA,CAAd,GAAA,cAAc,CAAE,aAAtC;;AACA,QAAI,CAAC,aAAL,EAAoB;AAClB;AACD;;AAED,QAAI,EAAC,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAT,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAE,QAAF,CAAW,aAAX,CAAjB,CAAJ,EAAgD;AAC9C;AACD;;AAED,QAAI,CAAC,CAAC,GAAF,KAAU,YAAd,EAA4B;AAC1B,YAAM,IAAI,GAAG,iBAAiB,CAAC,aAAD,EAA+B;AAAE,QAAA,SAAS,EAAE,QAAQ,CAAC;AAAtB,OAA/B,CAA9B;AACA,MAAA,IAAI,KAAA,IAAJ,IAAA,IAAI,KAAA,KAAA,CAAJ,GAAI,KAAA,CAAJ,GAAA,IAAI,CAAE,KAAN,EAAA;AACD;;AAED,QAAI,CAAC,CAAC,GAAF,KAAU,YAAd,EAA4B;AAC1B,YAAM,IAAI,GAAG,iBAAiB,CAAC,aAAD,EAA+B;AAAE,QAAA,SAAS,EAAE,QAAQ,CAAC;AAAtB,OAA/B,CAA9B;AACA,MAAA,IAAI,KAAA,IAAJ,IAAA,IAAI,KAAA,KAAA,CAAJ,GAAI,KAAA,CAAJ,GAAA,IAAI,CAAE,KAAN,EAAA;AACD;AACF,GApBe,EAqBhB,CAAC,iBAAD,EAAoB,iBAApB,EAAuC,cAAvC,EAAuD,YAAvD,EAAqE,YAArE,CArBgB,CAAlB;AAwBA,SAAO;AACL,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KADP;AAIL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;AACjC,MAAA,IAAI,EAAE,OAD2B;AAEjC,MAAA,GAAG,EAAE,iBAAA,CAAA,aAAA,CAAc,GAAd,EAAmB,QAAnB,CAF4B;AAGjC,MAAA,SAHiC;AAIjC,SAAG;AAJ8B,KAA7B;AAJD,GAAP;AAWD,CA5CM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB","sourceRoot":""}
@@ -0,0 +1,6 @@
1
+ import type { MenuSplitGroupState } from './MenuSplitGroup.types';
2
+ export declare const menuSplitGroupClassName = "fui-MenuSplitGroup";
3
+ /**
4
+ * Apply styling to the MenuSplitGroup slots based on the state
5
+ */
6
+ export declare const useMenuSplitGroupStyles: (state: MenuSplitGroupState) => MenuSplitGroupState;
@@ -0,0 +1,47 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useMenuSplitGroupStyles = exports.menuSplitGroupClassName = void 0;
7
+
8
+ const react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
9
+
10
+ const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
+
12
+ const useMenuItemStyles_1 = /*#__PURE__*/require("../MenuItem/useMenuItemStyles");
13
+
14
+ exports.menuSplitGroupClassName = 'fui-MenuSplitGroup';
15
+ /**
16
+ * Styles for the root slot
17
+ */
18
+
19
+ const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
20
+ "root": {
21
+ "mc9l5x": "f22iagw",
22
+ "u7v6m2": "f168awwq",
23
+ "Bo1wru1": ["f1om2jlk", "fcyhg04"],
24
+ "Bhkyaub": ["fgqgg70", "fqo1hry"],
25
+ "J9ixe0": ["fh1zedf", "f1auaj6e"],
26
+ "rj29m3": ["fokbbcd", "f1xlvh9o"],
27
+ "lispf9": "f1et5qag",
28
+ "B9hwub1": "f13ngu1f",
29
+ "dvf9w6": "f1db9j62",
30
+ "Hjn5ok": "f92z21p"
31
+ }
32
+ }, {
33
+ "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f168awwq>.fui-MenuItem:nth-child(1){width:100%;}", ".f1om2jlk>.fui-MenuItem:nth-child(2){border-top-left-radius:0;}", ".fcyhg04>.fui-MenuItem:nth-child(2){border-top-right-radius:0;}", ".fgqgg70>.fui-MenuItem:nth-child(2){border-bottom-left-radius:0;}", ".fqo1hry>.fui-MenuItem:nth-child(2){border-bottom-right-radius:0;}", ".fh1zedf>.fui-MenuItem:nth-child(2){padding-left:0;}", ".f1auaj6e>.fui-MenuItem:nth-child(2){padding-right:0;}", ".fokbbcd>.fui-MenuItem:nth-child(2){margin-left:auto;}", ".f1xlvh9o>.fui-MenuItem:nth-child(2){margin-right:auto;}", ".f1et5qag>.fui-MenuItem:nth-child(2):before{content:\"\";}", ".f13ngu1f>.fui-MenuItem:nth-child(2):before{width:var(--strokeWidthThin);}", ".f1db9j62>.fui-MenuItem:nth-child(2):before{height:24px;}", ".f92z21p>.fui-MenuItem:nth-child(2):before{background-color:var(--colorNeutralStroke1);}"]
34
+ });
35
+ /**
36
+ * Apply styling to the MenuSplitGroup slots based on the state
37
+ */
38
+
39
+
40
+ const useMenuSplitGroupStyles = state => {
41
+ const styles = useStyles();
42
+ state.root.className = react_make_styles_1.mergeClasses(exports.menuSplitGroupClassName, styles.root, state.root.className);
43
+ return state;
44
+ };
45
+
46
+ exports.useMenuSplitGroupStyles = useMenuSplitGroupStyles;
47
+ //# sourceMappingURL=useMenuSplitGroupStyles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/MenuSplitGroup/useMenuSplitGroupStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,+BAAA,CAAA;;AAGa,OAAA,CAAA,uBAAA,GAA0B,oBAA1B;AAEb;;AAEG;;AACH,MAAM,SAAS,gBAAG,mBAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqBA;;AAEG;;;AACI,MAAM,uBAAuB,GAAI,KAAD,IAAoD;AACzF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,mBAAA,CAAA,YAAA,CAAa,OAAA,CAAA,uBAAb,EAAsC,MAAM,CAAC,IAA7C,EAAmD,KAAK,CAAC,IAAN,CAAW,SAA9D,CAAvB;AACA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourceRoot":""}
@@ -1,15 +1,16 @@
1
- export * from './MenuItem';
2
- export * from './MenuList';
3
- export * from './MenuItemCheckbox';
4
- export * from './MenuItemRadio';
5
- export * from './MenuDivider';
6
- export * from './MenuGroupHeader';
7
- export * from './MenuGroup';
8
- export * from './selectable/index';
9
- export * from './MenuTrigger';
10
- export * from './Menu';
11
1
  export * from './contexts/menuContext';
12
2
  export * from './contexts/menuTriggerContext';
13
3
  export * from './contexts/menuGroupContext';
14
4
  export * from './contexts/menuListContext';
5
+ export * from './Menu';
6
+ export * from './MenuDivider';
7
+ export * from './MenuGroup';
8
+ export * from './MenuGroupHeader';
9
+ export * from './MenuItem';
10
+ export * from './MenuItemCheckbox';
11
+ export * from './MenuItemRadio';
12
+ export * from './MenuList';
15
13
  export * from './MenuPopover';
14
+ export * from './MenuSplitGroup';
15
+ export * from './MenuTrigger';
16
+ export * from './selectable/index';
@@ -6,33 +6,35 @@ Object.defineProperty(exports, "__esModule", {
6
6
 
7
7
  const tslib_1 = /*#__PURE__*/require("tslib");
8
8
 
9
- tslib_1.__exportStar(require("./MenuItem"), exports);
9
+ tslib_1.__exportStar(require("./contexts/menuContext"), exports);
10
10
 
11
- tslib_1.__exportStar(require("./MenuList"), exports);
11
+ tslib_1.__exportStar(require("./contexts/menuTriggerContext"), exports);
12
12
 
13
- tslib_1.__exportStar(require("./MenuItemCheckbox"), exports);
13
+ tslib_1.__exportStar(require("./contexts/menuGroupContext"), exports);
14
14
 
15
- tslib_1.__exportStar(require("./MenuItemRadio"), exports);
15
+ tslib_1.__exportStar(require("./contexts/menuListContext"), exports);
16
16
 
17
- tslib_1.__exportStar(require("./MenuDivider"), exports);
17
+ tslib_1.__exportStar(require("./Menu"), exports);
18
18
 
19
- tslib_1.__exportStar(require("./MenuGroupHeader"), exports);
19
+ tslib_1.__exportStar(require("./MenuDivider"), exports);
20
20
 
21
21
  tslib_1.__exportStar(require("./MenuGroup"), exports);
22
22
 
23
- tslib_1.__exportStar(require("./selectable/index"), exports);
23
+ tslib_1.__exportStar(require("./MenuGroupHeader"), exports);
24
24
 
25
- tslib_1.__exportStar(require("./MenuTrigger"), exports);
25
+ tslib_1.__exportStar(require("./MenuItem"), exports);
26
26
 
27
- tslib_1.__exportStar(require("./Menu"), exports);
27
+ tslib_1.__exportStar(require("./MenuItemCheckbox"), exports);
28
28
 
29
- tslib_1.__exportStar(require("./contexts/menuContext"), exports);
29
+ tslib_1.__exportStar(require("./MenuItemRadio"), exports);
30
30
 
31
- tslib_1.__exportStar(require("./contexts/menuTriggerContext"), exports);
31
+ tslib_1.__exportStar(require("./MenuList"), exports);
32
32
 
33
- tslib_1.__exportStar(require("./contexts/menuGroupContext"), exports);
33
+ tslib_1.__exportStar(require("./MenuPopover"), exports);
34
34
 
35
- tslib_1.__exportStar(require("./contexts/menuListContext"), exports);
35
+ tslib_1.__exportStar(require("./MenuSplitGroup"), exports);
36
36
 
37
- tslib_1.__exportStar(require("./MenuPopover"), exports);
37
+ tslib_1.__exportStar(require("./MenuTrigger"), exports);
38
+
39
+ tslib_1.__exportStar(require("./selectable/index"), exports);
38
40
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,aAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,QAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,6BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,4BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA","sourceRoot":""}
1
+ {"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,6BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,4BAAA,CAAA,EAAA,OAAA;;AAEA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,QAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,aAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AAEA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA","sourceRoot":""}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-menu",
3
- "version": "0.0.0-nightly58c310891320211216.1",
3
+ "version": "0.0.0-nightly5ab766c40f20220114.1",
4
4
  "description": "Fluent UI menu component",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -27,11 +27,11 @@
27
27
  "type-check": "tsc -b tsconfig.json"
28
28
  },
29
29
  "devDependencies": {
30
- "@fluentui/babel-make-styles": "0.0.0-nightly58c310891320211216.1",
30
+ "@fluentui/babel-make-styles": "0.0.0-nightly5ab766c40f20220114.1",
31
31
  "@fluentui/eslint-plugin": "*",
32
- "@fluentui/jest-serializer-make-styles": "0.0.0-nightly58c310891320211216.1",
32
+ "@fluentui/jest-serializer-make-styles": "0.0.0-nightly5ab766c40f20220114.1",
33
33
  "@fluentui/react-conformance": "*",
34
- "@fluentui/react-conformance-make-styles": "0.0.0-nightly58c310891320211216.1",
34
+ "@fluentui/react-conformance-make-styles": "0.0.0-nightly5ab766c40f20220114.1",
35
35
  "@fluentui/scripts": "^1.0.0",
36
36
  "@types/enzyme": "3.10.3",
37
37
  "@types/enzyme-adapter-react-16": "1.0.3",
@@ -45,15 +45,15 @@
45
45
  "react-test-renderer": "^16.3.0"
46
46
  },
47
47
  "dependencies": {
48
- "@fluentui/keyboard-keys": "0.0.0-nightly58c310891320211216.1",
49
- "@fluentui/react-context-selector": "0.0.0-nightly58c310891320211216.1",
48
+ "@fluentui/keyboard-keys": "0.0.0-nightly5ab766c40f20220114.1",
49
+ "@fluentui/react-context-selector": "0.0.0-nightly5ab766c40f20220114.1",
50
50
  "@fluentui/react-icons": "^2.0.154-beta.5",
51
- "@fluentui/react-make-styles": "0.0.0-nightly58c310891320211216.1",
52
- "@fluentui/react-portal": "0.0.0-nightly58c310891320211216.1",
53
- "@fluentui/react-positioning": "0.0.0-nightly58c310891320211216.1",
54
- "@fluentui/react-shared-contexts": "0.0.0-nightly58c310891320211216.1",
55
- "@fluentui/react-tabster": "0.0.0-nightly58c310891320211216.1",
56
- "@fluentui/react-utilities": "0.0.0-nightly58c310891320211216.1",
51
+ "@fluentui/react-make-styles": "0.0.0-nightly5ab766c40f20220114.1",
52
+ "@fluentui/react-portal": "0.0.0-nightly5ab766c40f20220114.1",
53
+ "@fluentui/react-positioning": "0.0.0-nightly5ab766c40f20220114.1",
54
+ "@fluentui/react-shared-contexts": "0.0.0-nightly5ab766c40f20220114.1",
55
+ "@fluentui/react-tabster": "0.0.0-nightly5ab766c40f20220114.1",
56
+ "@fluentui/react-utilities": "0.0.0-nightly5ab766c40f20220114.1",
57
57
  "tslib": "^2.1.0"
58
58
  },
59
59
  "peerDependencies": {