@fluentui/react-menu 9.0.0-rc.5 → 9.0.0-rc.6

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 (58) hide show
  1. package/CHANGELOG.json +102 -1
  2. package/CHANGELOG.md +22 -2
  3. package/dist/react-menu.d.ts +46 -0
  4. package/lib/components/MenuDivider/useMenuDividerStyles.d.ts +6 -1
  5. package/lib/components/MenuDivider/useMenuDividerStyles.js +8 -1
  6. package/lib/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
  7. package/lib/components/MenuGroup/useMenuGroupStyles.d.ts +6 -1
  8. package/lib/components/MenuGroup/useMenuGroupStyles.js +8 -1
  9. package/lib/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
  10. package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.d.ts +6 -1
  11. package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +8 -1
  12. package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
  13. package/lib/components/MenuItem/useMenuItemStyles.d.ts +6 -1
  14. package/lib/components/MenuItem/useMenuItemStyles.js +50 -14
  15. package/lib/components/MenuItem/useMenuItemStyles.js.map +1 -1
  16. package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.d.ts +6 -0
  17. package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js +29 -1
  18. package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
  19. package/lib/components/MenuItemRadio/useMenuItemRadioStyles.d.ts +6 -0
  20. package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js +29 -1
  21. package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
  22. package/lib/components/MenuList/useMenuListStyles.d.ts +6 -1
  23. package/lib/components/MenuList/useMenuListStyles.js +8 -1
  24. package/lib/components/MenuList/useMenuListStyles.js.map +1 -1
  25. package/lib/components/MenuPopover/useMenuPopoverStyles.d.ts +6 -1
  26. package/lib/components/MenuPopover/useMenuPopoverStyles.js +8 -1
  27. package/lib/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
  28. package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.d.ts +6 -1
  29. package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js +9 -2
  30. package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
  31. package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.d.ts +6 -1
  32. package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js +9 -2
  33. package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
  34. package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.d.ts +6 -1
  35. package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js +9 -2
  36. package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
  37. package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.d.ts +6 -1
  38. package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +9 -2
  39. package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
  40. package/lib-commonjs/components/MenuItem/useMenuItemStyles.d.ts +6 -1
  41. package/lib-commonjs/components/MenuItem/useMenuItemStyles.js +51 -15
  42. package/lib-commonjs/components/MenuItem/useMenuItemStyles.js.map +1 -1
  43. package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.d.ts +6 -0
  44. package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js +30 -2
  45. package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
  46. package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.d.ts +6 -0
  47. package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js +30 -2
  48. package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
  49. package/lib-commonjs/components/MenuList/useMenuListStyles.d.ts +6 -1
  50. package/lib-commonjs/components/MenuList/useMenuListStyles.js +9 -2
  51. package/lib-commonjs/components/MenuList/useMenuListStyles.js.map +1 -1
  52. package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.d.ts +6 -1
  53. package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js +9 -2
  54. package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
  55. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.d.ts +6 -1
  56. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js +9 -2
  57. package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
  58. package/package.json +12 -22
@@ -1,3 +1,9 @@
1
+ import type { SlotClassNames } from '@fluentui/react-utilities';
2
+ import { MenuItemSlots } from '../index';
1
3
  import type { MenuItemRadioState } from './MenuItemRadio.types';
4
+ /**
5
+ * @deprecated Use `menuItemRadioClassNames.root` instead.
6
+ */
2
7
  export declare const menuItemRadioClassName = "fui-MenuItemRadio";
8
+ export declare const menuItemRadioClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>>;
3
9
  export declare const useMenuItemRadioStyles_unstable: (state: MenuItemRadioState) => void;
@@ -3,18 +3,46 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useMenuItemRadioStyles_unstable = exports.menuItemRadioClassName = void 0;
6
+ exports.useMenuItemRadioStyles_unstable = exports.menuItemRadioClassNames = exports.menuItemRadioClassName = void 0;
7
7
 
8
8
  const react_1 = /*#__PURE__*/require("@griffel/react");
9
9
 
10
10
  const index_1 = /*#__PURE__*/require("../../selectable/index");
11
11
 
12
12
  const useMenuItemStyles_1 = /*#__PURE__*/require("../MenuItem/useMenuItemStyles");
13
+ /**
14
+ * @deprecated Use `menuItemRadioClassNames.root` instead.
15
+ */
16
+
13
17
 
14
18
  exports.menuItemRadioClassName = 'fui-MenuItemRadio';
19
+ exports.menuItemRadioClassNames = {
20
+ root: 'fui-MenuItemRadio',
21
+ icon: 'fui-MenuItemRadio__icon',
22
+ checkmark: 'fui-MenuItemRadio__checkmark',
23
+ content: 'fui-MenuItemRadio__content',
24
+ secondaryContent: 'fui-MenuItemRadio__secondaryContent'
25
+ };
15
26
 
16
27
  const useMenuItemRadioStyles_unstable = state => {
17
- state.root.className = react_1.mergeClasses(exports.menuItemRadioClassName, state.root.className);
28
+ state.root.className = react_1.mergeClasses(exports.menuItemRadioClassNames.root, state.root.className);
29
+
30
+ if (state.content) {
31
+ state.content.className = react_1.mergeClasses(exports.menuItemRadioClassNames.content, state.content.className);
32
+ }
33
+
34
+ if (state.secondaryContent) {
35
+ state.secondaryContent.className = react_1.mergeClasses(exports.menuItemRadioClassNames.secondaryContent, state.secondaryContent.className);
36
+ }
37
+
38
+ if (state.icon) {
39
+ state.icon.className = react_1.mergeClasses(exports.menuItemRadioClassNames.icon, state.icon.className);
40
+ }
41
+
42
+ if (state.checkmark) {
43
+ state.checkmark.className = react_1.mergeClasses(exports.menuItemRadioClassNames.checkmark, state.checkmark.className);
44
+ }
45
+
18
46
  useMenuItemStyles_1.useMenuItemStyles_unstable(state);
19
47
  index_1.useCheckmarkStyles_unstable(state);
20
48
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["components/MenuItemRadio/useMenuItemRadioStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,+BAAA,CAAA;;AAGa,OAAA,CAAA,sBAAA,GAAyB,mBAAzB;;AAEN,MAAM,+BAA+B,GAAI,KAAD,IAA8B;AAC3E,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,sBAAb,EAAqC,KAAK,CAAC,IAAN,CAAW,SAAhD,CAAvB;AAEA,EAAA,mBAAA,CAAA,0BAAA,CAA2B,KAA3B;AACA,EAAA,OAAA,CAAA,2BAAA,CAA4B,KAA5B;AACD,CALM;;AAAM,OAAA,CAAA,+BAAA,GAA+B,+BAA/B","sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\n\nexport const menuItemRadioClassName = 'fui-MenuItemRadio';\n\nexport const useMenuItemRadioStyles_unstable = (state: MenuItemRadioState) => {\n state.root.className = mergeClasses(menuItemRadioClassName, state.root.className);\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["components/MenuItemRadio/useMenuItemRadioStyles.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AAEA,MAAA,mBAAA,gBAAA,OAAA,CAAA,+BAAA,CAAA;AAGA;;AAEG;;;AACU,OAAA,CAAA,sBAAA,GAAyB,mBAAzB;AACA,OAAA,CAAA,uBAAA,GAAmF;AAC9F,EAAA,IAAI,EAAE,mBADwF;AAE9F,EAAA,IAAI,EAAE,yBAFwF;AAG9F,EAAA,SAAS,EAAE,8BAHmF;AAI9F,EAAA,OAAO,EAAE,4BAJqF;AAK9F,EAAA,gBAAgB,EAAE;AAL4E,CAAnF;;AAQN,MAAM,+BAA+B,GAAI,KAAD,IAA8B;AAC3E,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,uBAAA,CAAwB,IAArC,EAA2C,KAAK,CAAC,IAAN,CAAW,SAAtD,CAAvB;;AAEA,MAAI,KAAK,CAAC,OAAV,EAAmB;AACjB,IAAA,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,uBAAA,CAAwB,OAArC,EAA8C,KAAK,CAAC,OAAN,CAAc,SAA5D,CAA1B;AACD;;AAED,MAAI,KAAK,CAAC,gBAAV,EAA4B;AAC1B,IAAA,KAAK,CAAC,gBAAN,CAAuB,SAAvB,GAAmC,OAAA,CAAA,YAAA,CACjC,OAAA,CAAA,uBAAA,CAAwB,gBADS,EAEjC,KAAK,CAAC,gBAAN,CAAuB,SAFU,CAAnC;AAID;;AAED,MAAI,KAAK,CAAC,IAAV,EAAgB;AACd,IAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,uBAAA,CAAwB,IAArC,EAA2C,KAAK,CAAC,IAAN,CAAW,SAAtD,CAAvB;AACD;;AAED,MAAI,KAAK,CAAC,SAAV,EAAqB;AACnB,IAAA,KAAK,CAAC,SAAN,CAAgB,SAAhB,GAA4B,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,uBAAA,CAAwB,SAArC,EAAgD,KAAK,CAAC,SAAN,CAAgB,SAAhE,CAA5B;AACD;;AAED,EAAA,mBAAA,CAAA,0BAAA,CAA2B,KAA3B;AACA,EAAA,OAAA,CAAA,2BAAA,CAA4B,KAA5B;AACD,CAxBM;;AAAM,OAAA,CAAA,+BAAA,GAA+B,+BAA/B","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { MenuItemSlots } from '../index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\n\n/**\n * @deprecated Use `menuItemRadioClassNames.root` instead.\n */\nexport const menuItemRadioClassName = 'fui-MenuItemRadio';\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"],"sourceRoot":"../src/"}
@@ -1,5 +1,10 @@
1
- import type { MenuListState } from './MenuList.types';
1
+ import type { SlotClassNames } from '@fluentui/react-utilities';
2
+ import type { MenuListSlots, MenuListState } from './MenuList.types';
3
+ /**
4
+ * @deprecated Use `menuListClassNames.root` instead.
5
+ */
2
6
  export declare const menuListClassName = "fui-MenuList";
7
+ export declare const menuListClassNames: SlotClassNames<MenuListSlots>;
3
8
  /**
4
9
  * Apply styling to the Menu slots based on the state
5
10
  */
@@ -3,11 +3,18 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useMenuListStyles_unstable = exports.menuListClassName = void 0;
6
+ exports.useMenuListStyles_unstable = exports.menuListClassNames = exports.menuListClassName = void 0;
7
7
 
8
8
  const react_1 = /*#__PURE__*/require("@griffel/react");
9
+ /**
10
+ * @deprecated Use `menuListClassNames.root` instead.
11
+ */
12
+
9
13
 
10
14
  exports.menuListClassName = 'fui-MenuList';
15
+ exports.menuListClassNames = {
16
+ root: 'fui-MenuList'
17
+ };
11
18
 
12
19
  const useStyles = /*#__PURE__*/react_1.__styles({
13
20
  "root": {
@@ -26,7 +33,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
26
33
 
27
34
  const useMenuListStyles_unstable = state => {
28
35
  const styles = useStyles();
29
- state.root.className = react_1.mergeClasses(exports.menuListClassName, styles.root, state.root.className);
36
+ state.root.className = react_1.mergeClasses(exports.menuListClassNames.root, styles.root, state.root.className);
30
37
  return state;
31
38
  };
32
39
 
@@ -1 +1 @@
1
- {"version":3,"sources":["components/MenuList/useMenuListStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AAGa,OAAA,CAAA,iBAAA,GAAoB,cAApB;;AAEb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAQA;;AAEG;;;AACI,MAAM,0BAA0B,GAAI,KAAD,IAAwC;AAChF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,iBAAb,EAAgC,MAAM,CAAC,IAAvC,EAA6C,KAAK,CAAC,IAAN,CAAW,SAAxD,CAAvB;AACA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B","sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport type { MenuListState } from './MenuList.types';\n\nexport const menuListClassName = 'fui-MenuList';\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(menuListClassName, styles.root, state.root.className);\n return state;\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["components/MenuList/useMenuListStyles.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAGA;;AAEG;;;AACU,OAAA,CAAA,iBAAA,GAAoB,cAApB;AACA,OAAA,CAAA,kBAAA,GAAoD;AAC/D,EAAA,IAAI,EAAE;AADyD,CAApD;;AAIb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAQA;;AAEG;;;AACI,MAAM,0BAA0B,GAAI,KAAD,IAAwC;AAChF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,kBAAA,CAAmB,IAAhC,EAAsC,MAAM,CAAC,IAA7C,EAAmD,KAAK,CAAC,IAAN,CAAW,SAA9D,CAAvB;AACA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport type { MenuListSlots, MenuListState } from './MenuList.types';\n\n/**\n * @deprecated Use `menuListClassNames.root` instead.\n */\nexport const menuListClassName = 'fui-MenuList';\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"],"sourceRoot":"../src/"}
@@ -1,5 +1,10 @@
1
- import type { MenuPopoverState } from './MenuPopover.types';
1
+ import type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';
2
+ import type { SlotClassNames } from '@fluentui/react-utilities';
3
+ /**
4
+ * @deprecated Use `menuPopoverClassNames.root` instead.
5
+ */
2
6
  export declare const menuPopoverClassName = "fui-MenuPopover";
7
+ export declare const menuPopoverClassNames: SlotClassNames<MenuPopoverSlots>;
3
8
  /**
4
9
  * Apply styling to the Menu slots based on the state
5
10
  */
@@ -3,13 +3,20 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useMenuPopoverStyles_unstable = exports.menuPopoverClassName = void 0;
6
+ exports.useMenuPopoverStyles_unstable = exports.menuPopoverClassNames = exports.menuPopoverClassName = void 0;
7
7
 
8
8
  const react_1 = /*#__PURE__*/require("@griffel/react");
9
9
 
10
10
  const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
+ /**
12
+ * @deprecated Use `menuPopoverClassNames.root` instead.
13
+ */
14
+
11
15
 
12
16
  exports.menuPopoverClassName = 'fui-MenuPopover';
17
+ exports.menuPopoverClassNames = {
18
+ root: 'fui-MenuPopover'
19
+ };
13
20
 
14
21
  const useStyles = /*#__PURE__*/react_1.__styles({
15
22
  "root": {
@@ -49,7 +56,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
49
56
 
50
57
  const useMenuPopoverStyles_unstable = state => {
51
58
  const styles = useStyles();
52
- state.root.className = react_1.mergeClasses(exports.menuPopoverClassName, styles.root, state.root.className);
59
+ state.root.className = react_1.mergeClasses(exports.menuPopoverClassNames.root, styles.root, state.root.className);
53
60
  return state;
54
61
  };
55
62
 
@@ -1 +1 @@
1
- {"version":3,"sources":["components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAGa,OAAA,CAAA,oBAAA,GAAuB,iBAAvB;;AAEb,MAAM,SAAS,gBAAG,OAAA,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,6BAA6B,GAAI,KAAD,IAA8C;AACzF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,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,6BAAA,GAA6B,6BAA7B","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuPopoverState } from './MenuPopover.types';\n\nexport const menuPopoverClassName = 'fui-MenuPopover';\n\nconst useStyles = makeStyles({\n root: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n backgroundColor: tokens.colorNeutralBackground1,\n minWidth: '128px',\n maxWidth: '300px',\n width: 'max-content',\n boxShadow: `${tokens.shadow16}`,\n ...shorthands.padding('4px'),\n ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuPopoverStyles_unstable = (state: MenuPopoverState): MenuPopoverState => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuPopoverClassName, styles.root, state.root.className);\n return state;\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,oBAAA,GAAuB,iBAAvB;AACA,OAAA,CAAA,qBAAA,GAA0D;AACrE,EAAA,IAAI,EAAE;AAD+D,CAA1D;;AAIb,MAAM,SAAS,gBAAG,OAAA,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,6BAA6B,GAAI,KAAD,IAA8C;AACzF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,qBAAA,CAAsB,IAAnC,EAAyC,MAAM,CAAC,IAAhD,EAAsD,KAAK,CAAC,IAAN,CAAW,SAAjE,CAAvB;AACA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,6BAAA,GAA6B,6BAA7B","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `menuPopoverClassNames.root` instead.\n */\nexport const menuPopoverClassName = 'fui-MenuPopover';\nexport const menuPopoverClassNames: SlotClassNames<MenuPopoverSlots> = {\n root: 'fui-MenuPopover',\n};\n\nconst useStyles = makeStyles({\n root: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n backgroundColor: tokens.colorNeutralBackground1,\n minWidth: '128px',\n maxWidth: '300px',\n width: 'max-content',\n boxShadow: `${tokens.shadow16}`,\n ...shorthands.padding('4px'),\n ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuPopoverStyles_unstable = (state: MenuPopoverState): MenuPopoverState => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -1,5 +1,10 @@
1
- import type { MenuSplitGroupState } from './MenuSplitGroup.types';
1
+ import type { MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup.types';
2
+ import type { SlotClassNames } from '@fluentui/react-utilities';
3
+ /**
4
+ * @deprecated Use `menuSplitGroupClassNames.root` instead.
5
+ */
2
6
  export declare const menuSplitGroupClassName = "fui-MenuSplitGroup";
7
+ export declare const menuSplitGroupClassNames: SlotClassNames<MenuSplitGroupSlots>;
3
8
  /**
4
9
  * Apply styling to the MenuSplitGroup slots based on the state
5
10
  */
@@ -3,15 +3,22 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useMenuSplitGroupStyles_unstable = exports.menuSplitGroupClassName = void 0;
6
+ exports.useMenuSplitGroupStyles_unstable = exports.menuSplitGroupClassNames = exports.menuSplitGroupClassName = void 0;
7
7
 
8
8
  const react_1 = /*#__PURE__*/require("@griffel/react");
9
9
 
10
10
  const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
11
 
12
12
  const useMenuItemStyles_1 = /*#__PURE__*/require("../MenuItem/useMenuItemStyles");
13
+ /**
14
+ * @deprecated Use `menuSplitGroupClassNames.root` instead.
15
+ */
16
+
13
17
 
14
18
  exports.menuSplitGroupClassName = 'fui-MenuSplitGroup';
19
+ exports.menuSplitGroupClassNames = {
20
+ root: 'fui-MenuSplitGroup'
21
+ };
15
22
  /**
16
23
  * Styles for the root slot
17
24
  */
@@ -39,7 +46,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
39
46
 
40
47
  const useMenuSplitGroupStyles_unstable = state => {
41
48
  const styles = useStyles();
42
- state.root.className = react_1.mergeClasses(exports.menuSplitGroupClassName, styles.root, state.root.className);
49
+ state.root.className = react_1.mergeClasses(exports.menuSplitGroupClassNames.root, styles.root, state.root.className);
43
50
  return state;
44
51
  };
45
52
 
@@ -1 +1 @@
1
- {"version":3,"sources":["components/MenuSplitGroup/useMenuSplitGroupStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,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,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqBA;;AAEG;;;AACI,MAAM,gCAAgC,GAAI,KAAD,IAAoD;AAClG,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,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,gCAAA,GAAgC,gCAAhC","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassName } from '../MenuItem/useMenuItemStyles';\nimport type { MenuSplitGroupState } from './MenuSplitGroup.types';\n\nexport const menuSplitGroupClassName = 'fui-MenuSplitGroup';\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n [`& > .${menuItemClassName}:nth-child(1)`]: {\n width: '100%',\n },\n [`& > .${menuItemClassName}:nth-child(2)`]: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n marginLeft: 'auto',\n ':before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '24px',\n backgroundColor: tokens.colorNeutralStroke1,\n },\n },\n },\n});\n\n/**\n * Apply styling to the MenuSplitGroup slots based on the state\n */\nexport const useMenuSplitGroupStyles_unstable = (state: MenuSplitGroupState): MenuSplitGroupState => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuSplitGroupClassName, styles.root, state.root.className);\n return state;\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["components/MenuSplitGroup/useMenuSplitGroupStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,+BAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,uBAAA,GAA0B,oBAA1B;AACA,OAAA,CAAA,wBAAA,GAAgE;AAC3E,EAAA,IAAI,EAAE;AADqE,CAAhE;AAGb;;AAEG;;AACH,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqBA;;AAEG;;;AACI,MAAM,gCAAgC,GAAI,KAAD,IAAoD;AAClG,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,wBAAA,CAAyB,IAAtC,EAA4C,MAAM,CAAC,IAAnD,EAAyD,KAAK,CAAC,IAAN,CAAW,SAApE,CAAvB;AACA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,gCAAA,GAAgC,gCAAhC","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles';\nimport type { MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `menuSplitGroupClassNames.root` instead.\n */\nexport const menuSplitGroupClassName = 'fui-MenuSplitGroup';\nexport const menuSplitGroupClassNames: SlotClassNames<MenuSplitGroupSlots> = {\n root: 'fui-MenuSplitGroup',\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n [`& > .${menuItemClassNames.root}:nth-child(1)`]: {\n width: '100%',\n },\n [`& > .${menuItemClassNames.root}:nth-child(2)`]: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n marginLeft: 'auto',\n ':before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '24px',\n backgroundColor: tokens.colorNeutralStroke1,\n },\n },\n },\n});\n\n/**\n * Apply styling to the MenuSplitGroup slots based on the state\n */\nexport const useMenuSplitGroupStyles_unstable = (state: MenuSplitGroupState): MenuSplitGroupState => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"sourceRoot":"../src/"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-menu",
3
- "version": "9.0.0-rc.5",
3
+ "version": "9.0.0-rc.6",
4
4
  "description": "Fluent UI menu component",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -29,30 +29,20 @@
29
29
  "devDependencies": {
30
30
  "@fluentui/eslint-plugin": "*",
31
31
  "@fluentui/react-conformance": "*",
32
- "@fluentui/react-conformance-griffel": "9.0.0-beta.3",
33
- "@fluentui/scripts": "^1.0.0",
34
- "@types/enzyme": "3.10.3",
35
- "@types/enzyme-adapter-react-16": "1.0.3",
36
- "@types/react": "16.9.42",
37
- "@types/react-dom": "16.9.10",
38
- "@types/react-test-renderer": "^16.0.0",
39
- "enzyme": "~3.10.0",
40
- "enzyme-adapter-react-16": "^1.15.0",
41
- "react": "16.8.6",
42
- "react-dom": "16.8.6",
43
- "react-test-renderer": "^16.3.0"
32
+ "@fluentui/react-conformance-griffel": "9.0.0-beta.4",
33
+ "@fluentui/scripts": "^1.0.0"
44
34
  },
45
35
  "dependencies": {
46
36
  "@fluentui/keyboard-keys": "9.0.0-rc.4",
47
- "@fluentui/react-context-selector": "9.0.0-rc.5",
48
- "@fluentui/react-icons": "^2.0.159-beta.10",
49
- "@griffel/react": "1.0.0",
50
- "@fluentui/react-portal": "9.0.0-rc.5",
51
- "@fluentui/react-positioning": "9.0.0-rc.5",
52
- "@fluentui/react-shared-contexts": "9.0.0-rc.4",
53
- "@fluentui/react-tabster": "9.0.0-rc.5",
54
- "@fluentui/react-theme": "9.0.0-rc.4",
55
- "@fluentui/react-utilities": "9.0.0-rc.5",
37
+ "@fluentui/react-context-selector": "9.0.0-rc.6",
38
+ "@fluentui/react-icons": "^2.0.166-rc.3",
39
+ "@griffel/react": "1.0.3",
40
+ "@fluentui/react-portal": "9.0.0-rc.6",
41
+ "@fluentui/react-positioning": "9.0.0-rc.6",
42
+ "@fluentui/react-shared-contexts": "9.0.0-rc.5",
43
+ "@fluentui/react-tabster": "9.0.0-rc.6",
44
+ "@fluentui/react-theme": "9.0.0-rc.5",
45
+ "@fluentui/react-utilities": "9.0.0-rc.6",
56
46
  "tslib": "^2.1.0"
57
47
  },
58
48
  "peerDependencies": {