@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.
- package/CHANGELOG.json +102 -1
- package/CHANGELOG.md +22 -2
- package/dist/react-menu.d.ts +46 -0
- package/lib/components/MenuDivider/useMenuDividerStyles.d.ts +6 -1
- package/lib/components/MenuDivider/useMenuDividerStyles.js +8 -1
- package/lib/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroupStyles.d.ts +6 -1
- package/lib/components/MenuGroup/useMenuGroupStyles.js +8 -1
- package/lib/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.d.ts +6 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +8 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
- package/lib/components/MenuItem/useMenuItemStyles.d.ts +6 -1
- package/lib/components/MenuItem/useMenuItemStyles.js +50 -14
- package/lib/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.d.ts +6 -0
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js +29 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.d.ts +6 -0
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js +29 -1
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib/components/MenuList/useMenuListStyles.d.ts +6 -1
- package/lib/components/MenuList/useMenuListStyles.js +8 -1
- package/lib/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopoverStyles.d.ts +6 -1
- package/lib/components/MenuPopover/useMenuPopoverStyles.js +8 -1
- package/lib/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.d.ts +6 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js +9 -2
- package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.d.ts +6 -1
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js +9 -2
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.d.ts +6 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js +9 -2
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.d.ts +6 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +9 -2
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.d.ts +6 -1
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js +51 -15
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.d.ts +6 -0
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js +30 -2
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.d.ts +6 -0
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js +30 -2
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListStyles.d.ts +6 -1
- package/lib-commonjs/components/MenuList/useMenuListStyles.js +9 -2
- package/lib-commonjs/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.d.ts +6 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js +9 -2
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.d.ts +6 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js +9 -2
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
- 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;
|
@@ -1,9 +1,37 @@
|
|
1
1
|
import { mergeClasses } from '@griffel/react';
|
2
2
|
import { useCheckmarkStyles_unstable } from '../../selectable/index';
|
3
3
|
import { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';
|
4
|
+
/**
|
5
|
+
* @deprecated Use `menuItemRadioClassNames.root` instead.
|
6
|
+
*/
|
7
|
+
|
4
8
|
export const menuItemRadioClassName = 'fui-MenuItemRadio';
|
9
|
+
export const menuItemRadioClassNames = {
|
10
|
+
root: 'fui-MenuItemRadio',
|
11
|
+
icon: 'fui-MenuItemRadio__icon',
|
12
|
+
checkmark: 'fui-MenuItemRadio__checkmark',
|
13
|
+
content: 'fui-MenuItemRadio__content',
|
14
|
+
secondaryContent: 'fui-MenuItemRadio__secondaryContent'
|
15
|
+
};
|
5
16
|
export const useMenuItemRadioStyles_unstable = state => {
|
6
|
-
state.root.className = mergeClasses(
|
17
|
+
state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);
|
18
|
+
|
19
|
+
if (state.content) {
|
20
|
+
state.content.className = mergeClasses(menuItemRadioClassNames.content, state.content.className);
|
21
|
+
}
|
22
|
+
|
23
|
+
if (state.secondaryContent) {
|
24
|
+
state.secondaryContent.className = mergeClasses(menuItemRadioClassNames.secondaryContent, state.secondaryContent.className);
|
25
|
+
}
|
26
|
+
|
27
|
+
if (state.icon) {
|
28
|
+
state.icon.className = mergeClasses(menuItemRadioClassNames.icon, state.icon.className);
|
29
|
+
}
|
30
|
+
|
31
|
+
if (state.checkmark) {
|
32
|
+
state.checkmark.className = mergeClasses(menuItemRadioClassNames.checkmark, state.checkmark.className);
|
33
|
+
}
|
34
|
+
|
7
35
|
useMenuItemStyles_unstable(state);
|
8
36
|
useCheckmarkStyles_unstable(state);
|
9
37
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuItemRadio/useMenuItemRadioStyles.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["components/MenuItemRadio/useMenuItemRadioStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,QAA6B,gBAA7B;AACA,SAAS,2BAAT,QAA4C,wBAA5C;AAEA,SAAS,0BAAT,QAA2C,+BAA3C;AAGA;;AAEG;;AACH,OAAO,MAAM,sBAAsB,GAAG,mBAA/B;AACP,OAAO,MAAM,uBAAuB,GAA4D;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,CAAzF;AAQP,OAAO,MAAM,+BAA+B,GAAI,KAAD,IAA8B;AAC3E,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,uBAAuB,CAAC,IAAzB,EAA+B,KAAK,CAAC,IAAN,CAAW,SAA1C,CAAnC;;AAEA,MAAI,KAAK,CAAC,OAAV,EAAmB;AACjB,IAAA,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,YAAY,CAAC,uBAAuB,CAAC,OAAzB,EAAkC,KAAK,CAAC,OAAN,CAAc,SAAhD,CAAtC;AACD;;AAED,MAAI,KAAK,CAAC,gBAAV,EAA4B;AAC1B,IAAA,KAAK,CAAC,gBAAN,CAAuB,SAAvB,GAAmC,YAAY,CAC7C,uBAAuB,CAAC,gBADqB,EAE7C,KAAK,CAAC,gBAAN,CAAuB,SAFsB,CAA/C;AAID;;AAED,MAAI,KAAK,CAAC,IAAV,EAAgB;AACd,IAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,uBAAuB,CAAC,IAAzB,EAA+B,KAAK,CAAC,IAAN,CAAW,SAA1C,CAAnC;AACD;;AAED,MAAI,KAAK,CAAC,SAAV,EAAqB;AACnB,IAAA,KAAK,CAAC,SAAN,CAAgB,SAAhB,GAA4B,YAAY,CAAC,uBAAuB,CAAC,SAAzB,EAAoC,KAAK,CAAC,SAAN,CAAgB,SAApD,CAAxC;AACD;;AAED,EAAA,0BAA0B,CAAC,KAAD,CAA1B;AACA,EAAA,2BAA2B,CAAC,KAAD,CAA3B;AACD,CAxBM","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 {
|
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
|
*/
|
@@ -1,5 +1,12 @@
|
|
1
1
|
import { mergeClasses, __styles, shorthands } from '@griffel/react';
|
2
|
+
/**
|
3
|
+
* @deprecated Use `menuListClassNames.root` instead.
|
4
|
+
*/
|
5
|
+
|
2
6
|
export const menuListClassName = 'fui-MenuList';
|
7
|
+
export const menuListClassNames = {
|
8
|
+
root: 'fui-MenuList'
|
9
|
+
};
|
3
10
|
|
4
11
|
const useStyles = /*#__PURE__*/__styles({
|
5
12
|
"root": {
|
@@ -18,7 +25,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
18
25
|
|
19
26
|
export const useMenuListStyles_unstable = state => {
|
20
27
|
const styles = useStyles();
|
21
|
-
state.root.className = mergeClasses(
|
28
|
+
state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.root.className);
|
22
29
|
return state;
|
23
30
|
};
|
24
31
|
//# sourceMappingURL=useMenuListStyles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuList/useMenuListStyles.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["components/MenuList/useMenuListStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,YAAmC,UAAnC,QAAqD,gBAArD;AAGA;;AAEG;;AACH,OAAO,MAAM,iBAAiB,GAAG,cAA1B;AACP,OAAO,MAAM,kBAAkB,GAAkC;AAC/D,EAAA,IAAI,EAAE;AADyD,CAA1D;;AAIP,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAQA;;AAEG;;;AACH,OAAO,MAAM,0BAA0B,GAAI,KAAD,IAAwC;AAChF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,kBAAkB,CAAC,IAApB,EAA0B,MAAM,CAAC,IAAjC,EAAuC,KAAK,CAAC,IAAN,CAAW,SAAlD,CAAnC;AACA,SAAO,KAAP;AACD,CAJM","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
|
*/
|
@@ -1,6 +1,13 @@
|
|
1
1
|
import { shorthands, mergeClasses, __styles } from '@griffel/react';
|
2
2
|
import { tokens } from '@fluentui/react-theme';
|
3
|
+
/**
|
4
|
+
* @deprecated Use `menuPopoverClassNames.root` instead.
|
5
|
+
*/
|
6
|
+
|
3
7
|
export const menuPopoverClassName = 'fui-MenuPopover';
|
8
|
+
export const menuPopoverClassNames = {
|
9
|
+
root: 'fui-MenuPopover'
|
10
|
+
};
|
4
11
|
|
5
12
|
const useStyles = /*#__PURE__*/__styles({
|
6
13
|
"root": {
|
@@ -40,7 +47,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
40
47
|
|
41
48
|
export const useMenuPopoverStyles_unstable = state => {
|
42
49
|
const styles = useStyles();
|
43
|
-
state.root.className = mergeClasses(
|
50
|
+
state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);
|
44
51
|
return state;
|
45
52
|
};
|
46
53
|
//# sourceMappingURL=useMenuPopoverStyles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,EAAqB,YAArB,kBAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;
|
1
|
+
{"version":3,"sources":["components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,EAAqB,YAArB,kBAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAIA;;AAEG;;AACH,OAAO,MAAM,oBAAoB,GAAG,iBAA7B;AACP,OAAO,MAAM,qBAAqB,GAAqC;AACrE,EAAA,IAAI,EAAE;AAD+D,CAAhE;;AAIP,MAAM,SAAS,gBAAG;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;;;AACH,OAAO,MAAM,6BAA6B,GAAI,KAAD,IAA8C;AACzF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,qBAAqB,CAAC,IAAvB,EAA6B,MAAM,CAAC,IAApC,EAA0C,KAAK,CAAC,IAAN,CAAW,SAArD,CAAnC;AACA,SAAO,KAAP;AACD,CAJM","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
|
*/
|
@@ -1,7 +1,14 @@
|
|
1
1
|
import { __styles, mergeClasses } from '@griffel/react';
|
2
2
|
import { tokens } from '@fluentui/react-theme';
|
3
|
-
import {
|
3
|
+
import { menuItemClassNames } from '../MenuItem/useMenuItemStyles';
|
4
|
+
/**
|
5
|
+
* @deprecated Use `menuSplitGroupClassNames.root` instead.
|
6
|
+
*/
|
7
|
+
|
4
8
|
export const menuSplitGroupClassName = 'fui-MenuSplitGroup';
|
9
|
+
export const menuSplitGroupClassNames = {
|
10
|
+
root: 'fui-MenuSplitGroup'
|
11
|
+
};
|
5
12
|
/**
|
6
13
|
* Styles for the root slot
|
7
14
|
*/
|
@@ -29,7 +36,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
29
36
|
|
30
37
|
export const useMenuSplitGroupStyles_unstable = state => {
|
31
38
|
const styles = useStyles();
|
32
|
-
state.root.className = mergeClasses(
|
39
|
+
state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);
|
33
40
|
return state;
|
34
41
|
};
|
35
42
|
//# sourceMappingURL=useMenuSplitGroupStyles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuSplitGroup/useMenuSplitGroupStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AACA,SAAS,
|
1
|
+
{"version":3,"sources":["components/MenuSplitGroup/useMenuSplitGroupStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AACA,SAAS,kBAAT,QAAmC,+BAAnC;AAIA;;AAEG;;AACH,OAAO,MAAM,uBAAuB,GAAG,oBAAhC;AACP,OAAO,MAAM,wBAAwB,GAAwC;AAC3E,EAAA,IAAI,EAAE;AADqE,CAAtE;AAGP;;AAEG;;AACH,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqBA;;AAEG;;;AACH,OAAO,MAAM,gCAAgC,GAAI,KAAD,IAAoD;AAClG,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,wBAAwB,CAAC,IAA1B,EAAgC,MAAM,CAAC,IAAvC,EAA6C,KAAK,CAAC,IAAN,CAAW,SAAxD,CAAnC;AACA,SAAO,KAAP;AACD,CAJM","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/"}
|
@@ -1,3 +1,8 @@
|
|
1
|
-
import type { MenuDividerState } from './MenuDivider.types';
|
1
|
+
import type { MenuDividerSlots, MenuDividerState } from './MenuDivider.types';
|
2
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
3
|
+
/**
|
4
|
+
* @deprecated Use `menuDividerClassNames.root` instead.
|
5
|
+
*/
|
2
6
|
export declare const menuDividerClassName = "fui-MenuDivider";
|
7
|
+
export declare const menuDividerClassNames: SlotClassNames<MenuDividerSlots>;
|
3
8
|
export declare const useMenuDividerStyles_unstable: (state: MenuDividerState) => MenuDividerState;
|
@@ -3,13 +3,20 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useMenuDividerStyles_unstable = exports.menuDividerClassName = void 0;
|
6
|
+
exports.useMenuDividerStyles_unstable = exports.menuDividerClassNames = exports.menuDividerClassName = 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 `menuDividerClassNames.root` instead.
|
13
|
+
*/
|
14
|
+
|
11
15
|
|
12
16
|
exports.menuDividerClassName = 'fui-MenuDivider';
|
17
|
+
exports.menuDividerClassNames = {
|
18
|
+
root: 'fui-MenuDivider'
|
19
|
+
};
|
13
20
|
|
14
21
|
const useStyles = /*#__PURE__*/react_1.__styles({
|
15
22
|
"root": {
|
@@ -27,7 +34,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
27
34
|
|
28
35
|
const useMenuDividerStyles_unstable = state => {
|
29
36
|
const styles = useStyles();
|
30
|
-
state.root.className = react_1.mergeClasses(exports.
|
37
|
+
state.root.className = react_1.mergeClasses(exports.menuDividerClassNames.root, styles.root, state.root.className);
|
31
38
|
return state;
|
32
39
|
};
|
33
40
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuDivider/useMenuDividerStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;
|
1
|
+
{"version":3,"sources":["components/MenuDivider/useMenuDividerStyles.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,EAAlB;;AASO,MAAM,6BAA6B,GAAI,KAAD,IAA4B;AACvE,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;AAEA,SAAO,KAAP;AACD,CALM;;AAAM,OAAA,CAAA,6BAAA,GAA6B,6BAA7B","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuDividerSlots, MenuDividerState } from './MenuDivider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `menuDividerClassNames.root` instead.\n */\nexport const menuDividerClassName = 'fui-MenuDivider';\nexport const menuDividerClassNames: SlotClassNames<MenuDividerSlots> = {\n root: 'fui-MenuDivider',\n};\n\nconst useStyles = makeStyles({\n root: {\n height: '1px',\n ...shorthands.margin('4px', '-5px', '4px', '-5px'),\n width: 'auto',\n backgroundColor: tokens.colorNeutralStroke2,\n },\n});\n\nexport const useMenuDividerStyles_unstable = (state: MenuDividerState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuDividerClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,3 +1,8 @@
|
|
1
|
-
import type {
|
1
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
2
|
+
import type { MenuGroupSlots, MenuGroupState } from './MenuGroup.types';
|
3
|
+
/**
|
4
|
+
* @deprecated Use `menuGroupClassNames.root` instead.
|
5
|
+
*/
|
2
6
|
export declare const menuGroupClassName = "fui-MenuGroup";
|
7
|
+
export declare const menuGroupClassNames: SlotClassNames<MenuGroupSlots>;
|
3
8
|
export declare const useMenuGroupStyles_unstable: (state: MenuGroupState) => MenuGroupState;
|
@@ -3,14 +3,21 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useMenuGroupStyles_unstable = exports.menuGroupClassName = void 0;
|
6
|
+
exports.useMenuGroupStyles_unstable = exports.menuGroupClassNames = exports.menuGroupClassName = void 0;
|
7
7
|
|
8
8
|
const react_1 = /*#__PURE__*/require("@griffel/react");
|
9
|
+
/**
|
10
|
+
* @deprecated Use `menuGroupClassNames.root` instead.
|
11
|
+
*/
|
12
|
+
|
9
13
|
|
10
14
|
exports.menuGroupClassName = 'fui-MenuGroup';
|
15
|
+
exports.menuGroupClassNames = {
|
16
|
+
root: 'fui-MenuGroup'
|
17
|
+
};
|
11
18
|
|
12
19
|
const useMenuGroupStyles_unstable = state => {
|
13
|
-
state.root.className = react_1.mergeClasses(exports.
|
20
|
+
state.root.className = react_1.mergeClasses(exports.menuGroupClassNames.root, state.root.className);
|
14
21
|
return state;
|
15
22
|
};
|
16
23
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuGroup/useMenuGroupStyles.ts"],"names":[],"mappings":";;;;;;;
|
1
|
+
{"version":3,"sources":["components/MenuGroup/useMenuGroupStyles.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAGA;;AAEG;;;AACU,OAAA,CAAA,kBAAA,GAAqB,eAArB;AACA,OAAA,CAAA,mBAAA,GAAsD;AACjE,EAAA,IAAI,EAAE;AAD2D,CAAtD;;AAIN,MAAM,2BAA2B,GAAI,KAAD,IAA0C;AACnF,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,mBAAA,CAAoB,IAAjC,EAAuC,KAAK,CAAC,IAAN,CAAW,SAAlD,CAAvB;AAEA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,2BAAA,GAA2B,2BAA3B","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport type { MenuGroupSlots, MenuGroupState } from './MenuGroup.types';\n\n/**\n * @deprecated Use `menuGroupClassNames.root` instead.\n */\nexport const menuGroupClassName = 'fui-MenuGroup';\nexport const menuGroupClassNames: SlotClassNames<MenuGroupSlots> = {\n root: 'fui-MenuGroup',\n};\n\nexport const useMenuGroupStyles_unstable = (state: MenuGroupState): MenuGroupState => {\n state.root.className = mergeClasses(menuGroupClassNames.root, state.root.className);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,3 +1,8 @@
|
|
1
|
-
import type { MenuGroupHeaderState } from './MenuGroupHeader.types';
|
1
|
+
import type { MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader.types';
|
2
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
3
|
+
/**
|
4
|
+
* @deprecated Use `menuGroupHeaderClassNames.root` instead.
|
5
|
+
*/
|
2
6
|
export declare const menuGroupHeaderClassName = "fui-MenuGroupHeader";
|
7
|
+
export declare const menuGroupHeaderClassNames: SlotClassNames<MenuGroupHeaderSlots>;
|
3
8
|
export declare const useMenuGroupHeaderStyles_unstable: (state: MenuGroupHeaderState) => MenuGroupHeaderState;
|
@@ -3,13 +3,20 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useMenuGroupHeaderStyles_unstable = exports.menuGroupHeaderClassName = void 0;
|
6
|
+
exports.useMenuGroupHeaderStyles_unstable = exports.menuGroupHeaderClassNames = exports.menuGroupHeaderClassName = 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 `menuGroupHeaderClassNames.root` instead.
|
13
|
+
*/
|
14
|
+
|
11
15
|
|
12
16
|
exports.menuGroupHeaderClassName = 'fui-MenuGroupHeader';
|
17
|
+
exports.menuGroupHeaderClassNames = {
|
18
|
+
root: 'fui-MenuGroupHeader'
|
19
|
+
};
|
13
20
|
|
14
21
|
const useStyles = /*#__PURE__*/react_1.__styles({
|
15
22
|
"root": {
|
@@ -28,7 +35,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
28
35
|
|
29
36
|
const useMenuGroupHeaderStyles_unstable = state => {
|
30
37
|
const styles = useStyles();
|
31
|
-
state.root.className = react_1.mergeClasses(exports.
|
38
|
+
state.root.className = react_1.mergeClasses(exports.menuGroupHeaderClassNames.root, styles.root, state.root.className);
|
32
39
|
return state;
|
33
40
|
};
|
34
41
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuGroupHeader/useMenuGroupHeaderStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;
|
1
|
+
{"version":3,"sources":["components/MenuGroupHeader/useMenuGroupHeaderStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,wBAAA,GAA2B,qBAA3B;AACA,OAAA,CAAA,yBAAA,GAAkE;AAC7E,EAAA,IAAI,EAAE;AADuE,CAAlE;;AAIb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;;AAaO,MAAM,iCAAiC,GAAI,KAAD,IAAgC;AAC/E,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,yBAAA,CAA0B,IAAvC,EAA6C,MAAM,CAAC,IAApD,EAA0D,KAAK,CAAC,IAAN,CAAW,SAArE,CAAvB;AAEA,SAAO,KAAP;AACD,CALM;;AAAM,OAAA,CAAA,iCAAA,GAAiC,iCAAjC","sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `menuGroupHeaderClassNames.root` instead.\n */\nexport const menuGroupHeaderClassName = 'fui-MenuGroupHeader';\nexport const menuGroupHeaderClassNames: SlotClassNames<MenuGroupHeaderSlots> = {\n root: 'fui-MenuGroupHeader',\n};\n\nconst useStyles = makeStyles({\n root: {\n fontSize: tokens.fontSizeBase200,\n color: tokens.colorNeutralForeground3,\n paddingLeft: '12px',\n paddingRight: '12px',\n fontWeight: tokens.fontWeightSemibold,\n height: '32px',\n display: 'flex',\n alignItems: 'center',\n },\n});\n\nexport const useMenuGroupHeaderStyles_unstable = (state: MenuGroupHeaderState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuGroupHeaderClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,4 +1,9 @@
|
|
1
|
-
import type { MenuItemState } from './MenuItem.types';
|
1
|
+
import type { MenuItemSlots, MenuItemState } from './MenuItem.types';
|
2
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
3
|
+
/**
|
4
|
+
* @deprecated Use `menuItemClassNames.root` instead.
|
5
|
+
*/
|
2
6
|
export declare const menuItemClassName = "fui-MenuItem";
|
7
|
+
export declare const menuItemClassNames: SlotClassNames<MenuItemSlots>;
|
3
8
|
/** Applies style classnames to slots */
|
4
9
|
export declare const useMenuItemStyles_unstable: (state: MenuItemState) => void;
|
@@ -3,7 +3,7 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useMenuItemStyles_unstable = exports.menuItemClassName = void 0;
|
6
|
+
exports.useMenuItemStyles_unstable = exports.menuItemClassNames = exports.menuItemClassName = void 0;
|
7
7
|
|
8
8
|
const react_1 = /*#__PURE__*/require("@griffel/react");
|
9
9
|
|
@@ -12,22 +12,48 @@ const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
|
|
12
12
|
const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
|
13
13
|
|
14
14
|
const index_1 = /*#__PURE__*/require("../../selectable/index");
|
15
|
+
/**
|
16
|
+
* @deprecated Use `menuItemClassNames.root` instead.
|
17
|
+
*/
|
18
|
+
|
15
19
|
|
16
20
|
exports.menuItemClassName = 'fui-MenuItem';
|
21
|
+
exports.menuItemClassNames = {
|
22
|
+
root: 'fui-MenuItem',
|
23
|
+
icon: 'fui-MenuItem__icon',
|
24
|
+
checkmark: 'fui-MenuItem__checkmark',
|
25
|
+
submenuIndicator: 'fui-MenuItem__submenuIndicator',
|
26
|
+
content: 'fui-MenuItem__content',
|
27
|
+
secondaryContent: 'fui-MenuItem__secondaryContent'
|
28
|
+
};
|
17
29
|
|
18
30
|
const useStyles = /*#__PURE__*/react_1.__styles({
|
19
31
|
"focusIndicator": {
|
20
32
|
"B486eqv": "f2hkw1w",
|
21
|
-
"
|
33
|
+
"Bnmjwt4": "flfsvnh",
|
34
|
+
"Jopkrh": ["f1781m5e", "flvaaa9"],
|
35
|
+
"hhrs2v": "f50u1b5",
|
36
|
+
"B7jbng7": ["flvaaa9", "f1781m5e"],
|
22
37
|
"e8izhr": "f1pxpxw8",
|
23
38
|
"in3gf6": "f1149fnl",
|
24
39
|
"B1i23sz": "fd1orka",
|
25
|
-
"ln9as": "fgtqheg",
|
26
40
|
"Bfgg0yq": "fq7mjg8",
|
27
|
-
"
|
28
|
-
"
|
29
|
-
"
|
30
|
-
"
|
41
|
+
"B7231uf": "fmqgchs",
|
42
|
+
"Bxoolf0": ["f1lv6wi8", "famjx04"],
|
43
|
+
"fo1iai": "f1nbyjd2",
|
44
|
+
"Bh81ga8": ["famjx04", "f1lv6wi8"],
|
45
|
+
"qztvpn": "f5n18is",
|
46
|
+
"ge3ubn": ["f13az7yk", "f14kwzu1"],
|
47
|
+
"F41yt0": "fneogx5",
|
48
|
+
"Bxrdl85": ["f14kwzu1", "f13az7yk"],
|
49
|
+
"Bb63s14": ["f1f0b0sl", "flsib9d"],
|
50
|
+
"Ikxprv": ["flsib9d", "f1f0b0sl"],
|
51
|
+
"Bhxvgo6": ["fbewl49", "fs55jlu"],
|
52
|
+
"J01dyq": ["fs55jlu", "fbewl49"],
|
53
|
+
"hzsgvt": "f1f43d5r",
|
54
|
+
"Ba9tnbb": ["f1ib27sc", "f14s7j5v"],
|
55
|
+
"Fpkomr": "f13oqbgc",
|
56
|
+
"Bttdqvk": ["f14s7j5v", "f1ib27sc"],
|
31
57
|
"Bl8qd6i": "f1284xzw",
|
32
58
|
"Byzgy54": "f14dru39",
|
33
59
|
"mq8cyt": ["fvabyfg", "f12y1wz2"],
|
@@ -71,13 +97,19 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
71
97
|
"a9b677": "f64fuq3",
|
72
98
|
"Bqenvij": "fjamq6b",
|
73
99
|
"Be2twd7": "fe5j1ua",
|
74
|
-
"Bg96gwp": "fez10in"
|
100
|
+
"Bg96gwp": "fez10in",
|
101
|
+
"Bt984gj": "f122n59",
|
102
|
+
"mc9l5x": "ftuwxu6",
|
103
|
+
"Brf1p80": "f4d9j23"
|
75
104
|
},
|
76
105
|
"submenuIndicator": {
|
77
106
|
"a9b677": "f64fuq3",
|
78
107
|
"Bqenvij": "fjamq6b",
|
79
108
|
"Be2twd7": "fe5j1ua",
|
80
|
-
"Bg96gwp": "fez10in"
|
109
|
+
"Bg96gwp": "fez10in",
|
110
|
+
"Bt984gj": "f122n59",
|
111
|
+
"mc9l5x": "ftuwxu6",
|
112
|
+
"Brf1p80": "f4d9j23"
|
81
113
|
},
|
82
114
|
"disabled": {
|
83
115
|
"sj55zd": "f1s2aq7o",
|
@@ -86,7 +118,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
86
118
|
}
|
87
119
|
}, {
|
88
120
|
"i": [".f2hkw1w:focus-visible{outline-style:none;}"],
|
89
|
-
"d": ["[data-keyboard-nav] .
|
121
|
+
"d": ["[data-keyboard-nav] .flfsvnh:focus{border-top-color:transparent;}", "[data-keyboard-nav] .f1781m5e:focus{border-right-color:transparent;}", "[data-keyboard-nav] .flvaaa9:focus{border-left-color:transparent;}", "[data-keyboard-nav] .f50u1b5:focus{border-bottom-color:transparent;}", "[data-keyboard-nav] .f1pxpxw8:focus:after{content:\"\";}", "[data-keyboard-nav] .f1149fnl:focus:after{position:absolute;}", "[data-keyboard-nav] .fd1orka:focus:after{pointer-events:none;}", "[data-keyboard-nav] .fq7mjg8:focus:after{z-index:1;}", "[data-keyboard-nav] .fmqgchs:focus:after{border-top-style:solid;}", "[data-keyboard-nav] .f1lv6wi8:focus:after{border-right-style:solid;}", "[data-keyboard-nav] .famjx04:focus:after{border-left-style:solid;}", "[data-keyboard-nav] .f1nbyjd2:focus:after{border-bottom-style:solid;}", "[data-keyboard-nav] .f5n18is:focus:after{border-top-width:2px;}", "[data-keyboard-nav] .f13az7yk:focus:after{border-right-width:2px;}", "[data-keyboard-nav] .f14kwzu1:focus:after{border-left-width:2px;}", "[data-keyboard-nav] .fneogx5:focus:after{border-bottom-width:2px;}", "[data-keyboard-nav] .f1f0b0sl:focus:after{border-bottom-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .flsib9d:focus:after{border-bottom-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .fbewl49:focus:after{border-top-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .fs55jlu:focus:after{border-top-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f1f43d5r:focus:after{border-top-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1ib27sc:focus:after{border-right-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f14s7j5v:focus:after{border-left-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f13oqbgc:focus:after{border-bottom-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1284xzw:focus:after{top:-2px;}", "[data-keyboard-nav] .f14dru39:focus:after{bottom:-2px;}", "[data-keyboard-nav] .fvabyfg:focus:after{left:-2px;}", "[data-keyboard-nav] .f12y1wz2:focus:after{right:-2px;}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f10pi13n{position:relative;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f81rol6{padding-right:10px;}", ".frdkuqy{padding-left:10px;}", ".f1d2rq10{height:32px;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1k6fduh{cursor:pointer;}", ".f1q8lukm{-webkit-column-gap:4px;column-gap:4px;}", ".f1ma2n7n{row-gap:4px;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f161knb0{padding-left:2px;}", ".f12huiiw{padding-right:2px;}", ".f3rmtva{background-color:transparent;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f64fuq3{width:20px;}", ".fjamq6b{height:20px;}", ".fe5j1ua{font-size:20px;}", ".fez10in{line-height:0;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}"],
|
90
122
|
"h": [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".f1jp5ecu:hover{color:var(--colorNeutralForeground3Hover);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}"],
|
91
123
|
"f": [".fc1cou1:focus{color:var(--colorNeutralForeground3Hover);}", ".ft33916:focus{color:var(--colorNeutralForegroundDisabled);}"]
|
92
124
|
});
|
@@ -95,22 +127,26 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
95
127
|
|
96
128
|
const useMenuItemStyles_unstable = state => {
|
97
129
|
const styles = useStyles();
|
98
|
-
state.root.className = react_1.mergeClasses(exports.
|
130
|
+
state.root.className = react_1.mergeClasses(exports.menuItemClassNames.root, styles.root, styles.focusIndicator, state.disabled && styles.disabled, state.root.className);
|
99
131
|
|
100
132
|
if (state.content) {
|
101
|
-
state.content.className = react_1.mergeClasses(styles.content, state.content.className);
|
133
|
+
state.content.className = react_1.mergeClasses(exports.menuItemClassNames.content, styles.content, state.content.className);
|
134
|
+
}
|
135
|
+
|
136
|
+
if (state.checkmark) {
|
137
|
+
state.checkmark.className = react_1.mergeClasses(exports.menuItemClassNames.checkmark, state.checkmark.className);
|
102
138
|
}
|
103
139
|
|
104
140
|
if (state.secondaryContent) {
|
105
|
-
state.secondaryContent.className = react_1.mergeClasses(!state.disabled && styles.secondaryContent, state.secondaryContent.className);
|
141
|
+
state.secondaryContent.className = react_1.mergeClasses(exports.menuItemClassNames.secondaryContent, !state.disabled && styles.secondaryContent, state.secondaryContent.className);
|
106
142
|
}
|
107
143
|
|
108
144
|
if (state.icon) {
|
109
|
-
state.icon.className = react_1.mergeClasses(styles.icon, state.icon.className);
|
145
|
+
state.icon.className = react_1.mergeClasses(exports.menuItemClassNames.icon, styles.icon, state.icon.className);
|
110
146
|
}
|
111
147
|
|
112
148
|
if (state.submenuIndicator) {
|
113
|
-
state.submenuIndicator.className = react_1.mergeClasses(styles.submenuIndicator, state.submenuIndicator.className);
|
149
|
+
state.submenuIndicator.className = react_1.mergeClasses(exports.menuItemClassNames.submenuIndicator, styles.submenuIndicator, state.submenuIndicator.className);
|
114
150
|
}
|
115
151
|
|
116
152
|
index_1.useCheckmarkStyles_unstable(state);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuItem/useMenuItemStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;
|
1
|
+
{"version":3,"sources":["components/MenuItem/useMenuItemStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { MenuItemCheckboxState } from '../MenuItemCheckbox/index';\nimport type { MenuItemSlots, MenuItemState } from './MenuItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `menuItemClassNames.root` instead.\n */\nexport const menuItemClassName = 'fui-MenuItem';\nexport const menuItemClassNames: SlotClassNames<MenuItemSlots> = {\n root: 'fui-MenuItem',\n icon: 'fui-MenuItem__icon',\n checkmark: 'fui-MenuItem__checkmark',\n submenuIndicator: 'fui-MenuItem__submenuIndicator',\n content: 'fui-MenuItem__content',\n secondaryContent: 'fui-MenuItem__secondaryContent',\n};\n\nconst useStyles = makeStyles({\n focusIndicator: createFocusOutlineStyle(),\n root: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n position: 'relative',\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n paddingRight: '10px',\n paddingLeft: '10px',\n height: '32px',\n display: 'flex',\n alignItems: 'center',\n fontSize: tokens.fontSizeBase300,\n cursor: 'pointer',\n ...shorthands.gap('4px'),\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n color: tokens.colorNeutralForeground2Hover,\n },\n\n userSelect: 'none',\n },\n content: {\n paddingLeft: '2px',\n paddingRight: '2px',\n backgroundColor: 'transparent',\n flexGrow: 1,\n },\n secondaryContent: {\n paddingLeft: '2px',\n paddingRight: '2px',\n color: tokens.colorNeutralForeground3,\n ':hover': {\n color: tokens.colorNeutralForeground3Hover,\n },\n ':focus': {\n color: tokens.colorNeutralForeground3Hover,\n },\n },\n icon: {\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n },\n submenuIndicator: {\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n ':hover': {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n ':focus': {\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n});\n\n/** Applies style classnames to slots */\nexport const useMenuItemStyles_unstable = (state: MenuItemState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n menuItemClassNames.root,\n styles.root,\n styles.focusIndicator,\n state.disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemClassNames.content, styles.content, state.content.className);\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, state.checkmark.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemClassNames.secondaryContent,\n !state.disabled && styles.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemClassNames.icon, styles.icon, state.icon.className);\n }\n\n if (state.submenuIndicator) {\n state.submenuIndicator.className = mergeClasses(\n menuItemClassNames.submenuIndicator,\n styles.submenuIndicator,\n state.submenuIndicator.className,\n );\n }\n useCheckmarkStyles_unstable(state as MenuItemCheckboxState);\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,3 +1,9 @@
|
|
1
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
2
|
+
import { MenuItemSlots } from '../index';
|
1
3
|
import type { MenuItemCheckboxState } from './MenuItemCheckbox.types';
|
4
|
+
/**
|
5
|
+
* @deprecated Use `menuItemCheckboxClassNames.root` instead.
|
6
|
+
*/
|
2
7
|
export declare const menuItemCheckboxClassName = "fui-MenuItemCheckbox";
|
8
|
+
export declare const menuItemCheckboxClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>>;
|
3
9
|
export declare const useMenuItemCheckboxStyles_unstable: (state: MenuItemCheckboxState) => void;
|
@@ -3,18 +3,46 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useMenuItemCheckboxStyles_unstable = exports.menuItemCheckboxClassName = void 0;
|
6
|
+
exports.useMenuItemCheckboxStyles_unstable = exports.menuItemCheckboxClassNames = exports.menuItemCheckboxClassName = 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 `menuItemCheckboxClassNames.root` instead.
|
15
|
+
*/
|
16
|
+
|
13
17
|
|
14
18
|
exports.menuItemCheckboxClassName = 'fui-MenuItemCheckbox';
|
19
|
+
exports.menuItemCheckboxClassNames = {
|
20
|
+
root: 'fui-MenuItemCheckbox',
|
21
|
+
icon: 'fui-MenuItemCheckbox__icon',
|
22
|
+
checkmark: 'fui-MenuItemCheckbox__checkmark',
|
23
|
+
content: 'fui-MenuItemCheckbox__content',
|
24
|
+
secondaryContent: 'fui-MenuItemCheckbox__secondaryContent'
|
25
|
+
};
|
15
26
|
|
16
27
|
const useMenuItemCheckboxStyles_unstable = state => {
|
17
|
-
state.root.className = react_1.mergeClasses(exports.
|
28
|
+
state.root.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.root, state.root.className);
|
29
|
+
|
30
|
+
if (state.content) {
|
31
|
+
state.content.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.content, state.content.className);
|
32
|
+
}
|
33
|
+
|
34
|
+
if (state.secondaryContent) {
|
35
|
+
state.secondaryContent.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.secondaryContent, state.secondaryContent.className);
|
36
|
+
}
|
37
|
+
|
38
|
+
if (state.icon) {
|
39
|
+
state.icon.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.icon, state.icon.className);
|
40
|
+
}
|
41
|
+
|
42
|
+
if (state.checkmark) {
|
43
|
+
state.checkmark.className = react_1.mergeClasses(exports.menuItemCheckboxClassNames.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/MenuItemCheckbox/useMenuItemCheckboxStyles.ts"],"names":[],"mappings":";;;;;;;
|
1
|
+
{"version":3,"sources":["components/MenuItemCheckbox/useMenuItemCheckboxStyles.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,yBAAA,GAA4B,sBAA5B;AACA,OAAA,CAAA,0BAAA,GAAsF;AACjG,EAAA,IAAI,EAAE,sBAD2F;AAEjG,EAAA,IAAI,EAAE,4BAF2F;AAGjG,EAAA,SAAS,EAAE,iCAHsF;AAIjG,EAAA,OAAO,EAAE,+BAJwF;AAKjG,EAAA,gBAAgB,EAAE;AAL+E,CAAtF;;AAQN,MAAM,kCAAkC,GAAI,KAAD,IAAiC;AACjF,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,0BAAA,CAA2B,IAAxC,EAA8C,KAAK,CAAC,IAAN,CAAW,SAAzD,CAAvB;;AAEA,MAAI,KAAK,CAAC,OAAV,EAAmB;AACjB,IAAA,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,0BAAA,CAA2B,OAAxC,EAAiD,KAAK,CAAC,OAAN,CAAc,SAA/D,CAA1B;AACD;;AAED,MAAI,KAAK,CAAC,gBAAV,EAA4B;AAC1B,IAAA,KAAK,CAAC,gBAAN,CAAuB,SAAvB,GAAmC,OAAA,CAAA,YAAA,CACjC,OAAA,CAAA,0BAAA,CAA2B,gBADM,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,0BAAA,CAA2B,IAAxC,EAA8C,KAAK,CAAC,IAAN,CAAW,SAAzD,CAAvB;AACD;;AAED,MAAI,KAAK,CAAC,SAAV,EAAqB;AACnB,IAAA,KAAK,CAAC,SAAN,CAAgB,SAAhB,GAA4B,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,0BAAA,CAA2B,SAAxC,EAAmD,KAAK,CAAC,SAAN,CAAgB,SAAnE,CAA5B;AACD;;AAED,EAAA,mBAAA,CAAA,0BAAA,CAA2B,KAA3B;AACA,EAAA,OAAA,CAAA,2BAAA,CAA4B,KAA5B;AACD,CAxBM;;AAAM,OAAA,CAAA,kCAAA,GAAkC,kCAAlC","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 { MenuItemCheckboxState } from './MenuItemCheckbox.types';\n\n/**\n * @deprecated Use `menuItemCheckboxClassNames.root` instead.\n */\nexport const menuItemCheckboxClassName = 'fui-MenuItemCheckbox';\nexport const menuItemCheckboxClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n root: 'fui-MenuItemCheckbox',\n icon: 'fui-MenuItemCheckbox__icon',\n checkmark: 'fui-MenuItemCheckbox__checkmark',\n content: 'fui-MenuItemCheckbox__content',\n secondaryContent: 'fui-MenuItemCheckbox__secondaryContent',\n};\n\nexport const useMenuItemCheckboxStyles_unstable = (state: MenuItemCheckboxState) => {\n state.root.className = mergeClasses(menuItemCheckboxClassNames.root, state.root.className);\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemCheckboxClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemCheckboxClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemCheckboxClassNames.icon, state.icon.className);\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemCheckboxClassNames.checkmark, state.checkmark.className);\n }\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"sourceRoot":"../src/"}
|