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

Sign up to get free protection for your applications and to get access to all the features.
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": {