@fluentui/react-button 0.0.0-nightly050f89bf0020211102.1 → 0.0.0-nightly442708a36520211209.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +190 -26
- package/CHANGELOG.md +50 -14
- package/dist/react-button.d.ts +14 -1
- package/lib/components/Button/Button.js +2 -2
- package/lib/components/Button/Button.js.map +1 -1
- package/lib/components/Button/index.d.ts +1 -1
- package/lib/components/Button/index.js +1 -1
- package/lib/components/Button/index.js.map +1 -1
- package/lib/components/Button/renderButton.js +10 -9
- package/lib/components/Button/renderButton.js.map +1 -1
- package/lib/components/Button/useButton.js +20 -24
- package/lib/components/Button/useButton.js.map +1 -1
- package/lib/components/Button/useButtonStyles.d.ts +1 -0
- package/lib/components/Button/useButtonStyles.js +118 -81
- package/lib/components/Button/useButtonStyles.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.js +2 -2
- package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/index.d.ts +1 -1
- package/lib/components/CompoundButton/index.js +1 -1
- package/lib/components/CompoundButton/index.js.map +1 -1
- package/lib/components/CompoundButton/renderCompoundButton.js +10 -9
- package/lib/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButton.js +8 -8
- package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButtonStyles.d.ts +1 -0
- package/lib/components/CompoundButton/useCompoundButtonStyles.js +43 -39
- package/lib/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.js +2 -2
- package/lib/components/MenuButton/MenuButton.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.types.d.ts +5 -1
- package/lib/components/MenuButton/index.d.ts +1 -1
- package/lib/components/MenuButton/index.js +1 -1
- package/lib/components/MenuButton/index.js.map +1 -1
- package/lib/components/MenuButton/renderMenuButton.js +10 -9
- package/lib/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButton.js +8 -8
- package/lib/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButtonStyles.d.ts +1 -0
- package/lib/components/MenuButton/useMenuButtonStyles.js +5 -3
- package/lib/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.js +2 -2
- package/lib/components/SplitButton/SplitButton.js.map +1 -1
- package/lib/components/SplitButton/index.d.ts +1 -1
- package/lib/components/SplitButton/index.js +1 -1
- package/lib/components/SplitButton/index.js.map +1 -1
- package/lib/components/SplitButton/renderSplitButton.js +6 -7
- package/lib/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButton.js +41 -45
- package/lib/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButtonStyles.d.ts +1 -0
- package/lib/components/SplitButton/useSplitButtonStyles.js +36 -33
- package/lib/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.js +2 -2
- package/lib/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/index.d.ts +1 -1
- package/lib/components/ToggleButton/index.js +1 -1
- package/lib/components/ToggleButton/index.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButton.js +27 -29
- package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButtonStyles.d.ts +1 -0
- package/lib/components/ToggleButton/useToggleButtonStyles.js +44 -41
- package/lib/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib-commonjs/Button.js +1 -1
- package/lib-commonjs/CompoundButton.js +1 -1
- package/lib-commonjs/MenuButton.js +1 -1
- package/lib-commonjs/SplitButton.js +1 -1
- package/lib-commonjs/ToggleButton.js +1 -1
- package/lib-commonjs/components/Button/Button.js +6 -6
- package/lib-commonjs/components/Button/Button.js.map +1 -1
- package/lib-commonjs/components/Button/index.d.ts +1 -1
- package/lib-commonjs/components/Button/index.js +8 -2
- package/lib-commonjs/components/Button/index.js.map +1 -1
- package/lib-commonjs/components/Button/renderButton.js +12 -12
- package/lib-commonjs/components/Button/renderButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButton.js +22 -26
- package/lib-commonjs/components/Button/useButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButtonStyles.d.ts +1 -0
- package/lib-commonjs/components/Button/useButtonStyles.js +119 -82
- package/lib-commonjs/components/Button/useButtonStyles.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.js +6 -6
- package/lib-commonjs/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/index.d.ts +1 -1
- package/lib-commonjs/components/CompoundButton/index.js +8 -2
- package/lib-commonjs/components/CompoundButton/index.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.js +12 -12
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js +10 -11
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.d.ts +1 -0
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js +45 -41
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.js +6 -6
- package/lib-commonjs/components/MenuButton/MenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.types.d.ts +5 -1
- package/lib-commonjs/components/MenuButton/index.d.ts +1 -1
- package/lib-commonjs/components/MenuButton/index.js +8 -2
- package/lib-commonjs/components/MenuButton/index.js.map +1 -1
- package/lib-commonjs/components/MenuButton/renderMenuButton.js +12 -12
- package/lib-commonjs/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButton.js +12 -13
- package/lib-commonjs/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.d.ts +1 -0
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js +9 -6
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.js +6 -6
- package/lib-commonjs/components/SplitButton/SplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/index.d.ts +1 -1
- package/lib-commonjs/components/SplitButton/index.js +8 -2
- package/lib-commonjs/components/SplitButton/index.js.map +1 -1
- package/lib-commonjs/components/SplitButton/renderSplitButton.js +8 -10
- package/lib-commonjs/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButton.js +44 -49
- package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.d.ts +1 -0
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js +39 -36
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.js +6 -6
- package/lib-commonjs/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/index.d.ts +1 -1
- package/lib-commonjs/components/ToggleButton/index.js +8 -2
- package/lib-commonjs/components/ToggleButton/index.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButton.js +31 -34
- package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.d.ts +1 -0
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js +47 -43
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib-commonjs/index.js +1 -1
- package/package.json +14 -15
- package/lib/common/isConformant.d.ts +0 -4
- package/lib/common/isConformant.js +0 -13
- package/lib/common/isConformant.js.map +0 -1
- package/lib-commonjs/common/isConformant.d.ts +0 -4
- package/lib-commonjs/common/isConformant.js +0 -24
- package/lib-commonjs/common/isConformant.js.map +0 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CompoundButton/useCompoundButton.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/CompoundButton/useCompoundButton.ts"],"names":[],"mappings":"AACA,SAAS,gBAAT,QAAiC,2BAAjC;AAEA,SAAS,SAAT,QAA0B,iBAA1B;AAEA;;;;AAIG;;AACH,OAAO,MAAM,iBAAiB,GAAG,CAC/B;AAAE,EAAA,gBAAF;AAAoB,EAAA,gBAApB;AAAsC,KAAG;AAAzC,CAD+B,EAE/B,GAF+B,KAGR;AACvB,SAAO,EACL;AACA,OAAG,SAAS,CAAC,KAAD,EAAQ,GAAR,CAFP;AAIL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,QADI;AAEV,MAAA,IAAI,EAAE,MAFI;AAGV,MAAA,gBAAgB,EAAE,MAHR;AAIV,MAAA,gBAAgB,EAAE;AAJR,KALP;AAWL,IAAA,gBAAgB,EAAE,gBAAgB,CAAC,gBAAD,EAAmB;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAnB,CAX7B;AAYL,IAAA,gBAAgB,EAAE,gBAAgB,CAAC,gBAAD;AAZ7B,GAAP;AAcD,CAlBM","sourceRoot":""}
|
@@ -1,32 +1,34 @@
|
|
1
|
-
import { mergeClasses, __styles } from '@fluentui/react-make-styles';
|
1
|
+
import { shorthands, mergeClasses, __styles } from '@fluentui/react-make-styles';
|
2
2
|
import { buttonSpacing, useButtonStyles } from '../Button/useButtonStyles';
|
3
|
-
|
4
|
-
|
3
|
+
export const compoundButtonClassName = 'fui-CompoundButton';
|
4
|
+
const CompoundButtonClassNames = {
|
5
|
+
secondaryContent: `${compoundButtonClassName}-secondaryContent`
|
5
6
|
};
|
6
7
|
|
7
|
-
|
8
|
+
const useRootStyles = /*#__PURE__*/__styles({
|
8
9
|
"base": {
|
9
|
-
"
|
10
|
+
"i8kkvl": "f4akndk",
|
11
|
+
"Belr9w4": "fe5j3v",
|
10
12
|
"Bqenvij": "f11ysow2",
|
11
|
-
"
|
12
|
-
"
|
13
|
-
"
|
13
|
+
"Bma4kx5": "f900oq5",
|
14
|
+
"l15nfm": "f8rpug0",
|
15
|
+
"n4n7rj": "fre7xro"
|
14
16
|
},
|
15
17
|
"outline": {},
|
16
18
|
"primary": {
|
17
|
-
"
|
18
|
-
"
|
19
|
-
"
|
19
|
+
"Bma4kx5": "f1ur7rb7",
|
20
|
+
"l15nfm": "f1itoici",
|
21
|
+
"n4n7rj": "f1uen3ov"
|
20
22
|
},
|
21
23
|
"subtle": {
|
22
|
-
"
|
23
|
-
"
|
24
|
-
"
|
24
|
+
"Bma4kx5": "f900oq5",
|
25
|
+
"l15nfm": "f1l9nom2",
|
26
|
+
"n4n7rj": "fvjq8kx"
|
25
27
|
},
|
26
28
|
"transparent": {
|
27
|
-
"
|
28
|
-
"
|
29
|
-
"
|
29
|
+
"Bma4kx5": "f900oq5",
|
30
|
+
"l15nfm": "f1l9nom2",
|
31
|
+
"n4n7rj": "fvjq8kx"
|
30
32
|
},
|
31
33
|
"small": {
|
32
34
|
"z8tnut": "fp9bwmr",
|
@@ -53,17 +55,17 @@ var useRootStyles = /*#__PURE__*/__styles({
|
|
53
55
|
"Bg96gwp": "faaz57k"
|
54
56
|
},
|
55
57
|
"disabled": {
|
56
|
-
"
|
57
|
-
"
|
58
|
-
"
|
58
|
+
"Bma4kx5": "fj9njph",
|
59
|
+
"l15nfm": "fr13fpv",
|
60
|
+
"n4n7rj": "f1xrf5v0"
|
59
61
|
}
|
60
62
|
}, {
|
61
|
-
"d": [".
|
62
|
-
"h": [".
|
63
|
-
"a": [".
|
63
|
+
"d": [".f4akndk{-webkit-column-gap:12px;column-gap:12px;}", ".fe5j3v{row-gap:12px;}", ".f11ysow2{height:auto;}", ".f900oq5 .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForeground2);}", ".f1ur7rb7 .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForegroundOnBrand);}", ".fp9bwmr{padding-top:8px;}", ".f19lj068{padding-right:8px;}", ".f177v4lu{padding-left:8px;}", ".f150uoa4{padding-bottom:8px;}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f1kcqot9{padding-top:12px;}", ".f11qrl6u{padding-right:12px;}", ".fjlbh76{padding-left:12px;}", ".fpe6lb7{padding-bottom:12px;}", ".fqag9an{padding-top:16px;}", ".f1gbmcue{padding-right:16px;}", ".f1rh9g5y{padding-left:16px;}", ".fp67ikv{padding-bottom:16px;}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".faaz57k{line-height:var(--lineHeightBase400);}", ".fj9njph .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForegroundDisabled);}"],
|
64
|
+
"h": [".f8rpug0:hover .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForeground2Hover);}", ".f1itoici:hover .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForegroundOnBrand);}", ".f1l9nom2:hover .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForeground2BrandHover);}", ".fr13fpv:hover .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForegroundDisabled);}"],
|
65
|
+
"a": [".fre7xro:active .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForeground2Pressed);}", ".f1uen3ov:active .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForegroundOnBrand);}", ".fvjq8kx:active .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForeground2BrandPressed);}", ".f1xrf5v0:active .fui-CompoundButton-secondaryContent{color:var(--colorNeutralForegroundDisabled);}"]
|
64
66
|
});
|
65
67
|
|
66
|
-
|
68
|
+
const useRootIconOnlyStyles = /*#__PURE__*/__styles({
|
67
69
|
"small": {
|
68
70
|
"z8tnut": "f10ra9hq",
|
69
71
|
"z189sj": ["f8wuabp", "fycuoez"],
|
@@ -92,7 +94,7 @@ var useRootIconOnlyStyles = /*#__PURE__*/__styles({
|
|
92
94
|
"d": [".f10ra9hq{padding-top:4px;}", ".f8wuabp{padding-right:4px;}", ".fycuoez{padding-left:4px;}", ".f1y2xyjm{padding-bottom:4px;}", ".ft5vyj6{max-width:48px;}", ".f17suaiq{min-width:48px;}", ".f1xp5gbu{padding-top:6px;}", ".f1sgzk6v{padding-right:6px;}", ".f1bg5zqg{padding-left:6px;}", ".f1d7kygh{padding-bottom:6px;}", ".fdczgix{max-width:52px;}", ".fjdcg9m{min-width:52px;}", ".fp9bwmr{padding-top:8px;}", ".f19lj068{padding-right:8px;}", ".f177v4lu{padding-left:8px;}", ".f150uoa4{padding-bottom:8px;}", ".fww51uw{max-width:56px;}", ".f1qhsl2h{min-width:56px;}"]
|
93
95
|
});
|
94
96
|
|
95
|
-
|
97
|
+
const useIconStyles = /*#__PURE__*/__styles({
|
96
98
|
"base": {
|
97
99
|
"Be2twd7": "fndrnj9",
|
98
100
|
"Bqenvij": "fbhnoac",
|
@@ -102,7 +104,7 @@ var useIconStyles = /*#__PURE__*/__styles({
|
|
102
104
|
"d": [".fndrnj9{font-size:40px;}", ".fbhnoac{height:40px;}", ".feqmc2u{width:40px;}"]
|
103
105
|
});
|
104
106
|
|
105
|
-
|
107
|
+
const useContentContainerStyles = /*#__PURE__*/__styles({
|
106
108
|
"base": {
|
107
109
|
"mc9l5x": "f22iagw",
|
108
110
|
"Beiy3e4": "f1vx9l62",
|
@@ -112,7 +114,7 @@ var useContentContainerStyles = /*#__PURE__*/__styles({
|
|
112
114
|
"d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f1o700av{text-align:left;}", ".fes3tcz{text-align:right;}"]
|
113
115
|
});
|
114
116
|
|
115
|
-
|
117
|
+
const useSecondaryContentStyles = /*#__PURE__*/__styles({
|
116
118
|
"base": {
|
117
119
|
"Bg96gwp": "flkuc6h",
|
118
120
|
"B6of3ja": "fvjh0tl",
|
@@ -131,18 +133,20 @@ var useSecondaryContentStyles = /*#__PURE__*/__styles({
|
|
131
133
|
"d": [".flkuc6h{line-height:100%;}", ".fvjh0tl{margin-top:4px;}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fkhj508{font-size:var(--fontSizeBase300);}"]
|
132
134
|
});
|
133
135
|
|
134
|
-
export
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
136
|
+
export const useCompoundButtonStyles = state => {
|
137
|
+
const rootStyles = useRootStyles();
|
138
|
+
const rootIconOnlyStyles = useRootIconOnlyStyles();
|
139
|
+
const iconStyles = useIconStyles();
|
140
|
+
const contentContainerStyles = useContentContainerStyles();
|
141
|
+
const secondaryContentStyles = useSecondaryContentStyles();
|
142
|
+
const {
|
143
|
+
appearance,
|
144
|
+
disabled,
|
145
|
+
disabledFocusable,
|
146
|
+
iconOnly,
|
147
|
+
size
|
148
|
+
} = state;
|
149
|
+
state.root.className = mergeClasses(compoundButtonClassName, // Root styles
|
146
150
|
rootStyles.base, appearance && rootStyles[appearance], rootStyles[size], // Disabled styles
|
147
151
|
(disabled || disabledFocusable) && rootStyles.disabled, // Icon-only styles
|
148
152
|
iconOnly && rootIconOnlyStyles[size], // User provided class name
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CompoundButton/useCompoundButtonStyles.ts"],"names":[],"mappings":"AAAA,SAAS,
|
1
|
+
{"version":3,"sources":["../../../src/components/CompoundButton/useCompoundButtonStyles.ts"],"names":[],"mappings":"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","sourceRoot":""}
|
@@ -6,8 +6,8 @@ import { useMenuButtonStyles } from './useMenuButtonStyles';
|
|
6
6
|
* MenuButtons are buttons that handle opening and closing a menu when they are triggered.
|
7
7
|
*/
|
8
8
|
|
9
|
-
export
|
10
|
-
|
9
|
+
export const MenuButton = /*#__PURE__*/React.forwardRef((props, ref) => {
|
10
|
+
const state = useMenuButton(props, ref);
|
11
11
|
useMenuButtonStyles(state);
|
12
12
|
return renderMenuButton(state); // Casting is required due to lack of distributive union to support unions on @types/react
|
13
13
|
});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuButton/MenuButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AACA,SAAS,aAAT,QAA8B,iBAA9B;AACA,SAAS,mBAAT,QAAoC,uBAApC;AAIA;;AAEG;;AACH,OAAO,
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuButton/MenuButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AACA,SAAS,aAAT,QAA8B,iBAA9B;AACA,SAAS,mBAAT,QAAoC,uBAApC;AAIA;;AAEG;;AACH,OAAO,MAAM,UAAU,gBAAyC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,aAAa,CAAC,KAAD,EAAQ,GAAR,CAA3B;AAEA,EAAA,mBAAmB,CAAC,KAAD,CAAnB;AAEA,SAAO,gBAAgB,CAAC,KAAD,CAAvB,CAL8F,CAM9F;AACD,CAP+D,CAAzD;AASP,UAAU,CAAC,WAAX,GAAyB,YAAzB","sourceRoot":""}
|
@@ -1,6 +1,9 @@
|
|
1
|
-
import
|
1
|
+
import * as React from 'react';
|
2
2
|
import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
|
3
3
|
import type { ButtonCommons, ButtonSlots, ButtonState } from '../Button/Button.types';
|
4
|
+
declare type MenuTriggerChildProps = Pick<React.HTMLAttributes<HTMLElement>, 'onClick' | 'onMouseEnter' | 'onMouseLeave' | 'onContextMenu' | 'onKeyDown' | 'aria-haspopup' | 'aria-expanded' | 'id'> & {
|
5
|
+
ref?: React.Ref<never>;
|
6
|
+
};
|
4
7
|
export declare type MenuButtonSlots = ButtonSlots & {
|
5
8
|
/**
|
6
9
|
* Menu icon that indicates that this button has a menu that can be expanded.
|
@@ -9,3 +12,4 @@ export declare type MenuButtonSlots = ButtonSlots & {
|
|
9
12
|
};
|
10
13
|
export declare type MenuButtonProps = ComponentProps<MenuButtonSlots> & Partial<Omit<ButtonCommons, 'iconPosition'>> & Partial<MenuTriggerChildProps>;
|
11
14
|
export declare type MenuButtonState = ComponentState<MenuButtonSlots> & Omit<ButtonState, keyof ButtonSlots | 'components' | 'iconPosition'>;
|
15
|
+
export {};
|
@@ -2,4 +2,4 @@ export * from './MenuButton.types';
|
|
2
2
|
export * from './MenuButton';
|
3
3
|
export * from './renderMenuButton';
|
4
4
|
export * from './useMenuButton';
|
5
|
-
export { useMenuButtonStyles } from './useMenuButtonStyles';
|
5
|
+
export { menuButtonClassName, useMenuButtonStyles } from './useMenuButtonStyles';
|
@@ -2,5 +2,5 @@ export * from './MenuButton.types';
|
|
2
2
|
export * from './MenuButton';
|
3
3
|
export * from './renderMenuButton';
|
4
4
|
export * from './useMenuButton';
|
5
|
-
export { useMenuButtonStyles } from './useMenuButtonStyles';
|
5
|
+
export { menuButtonClassName, useMenuButtonStyles } from './useMenuButtonStyles';
|
6
6
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/MenuButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC"}
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/MenuButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC"}
|
@@ -1,17 +1,18 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
1
|
import * as React from 'react';
|
3
2
|
import { getSlots } from '@fluentui/react-utilities';
|
4
3
|
/**
|
5
4
|
* Renders a MenuButton component by passing the state defined props to the appropriate slots.
|
6
5
|
*/
|
7
6
|
|
8
|
-
export
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
7
|
+
export const renderMenuButton = state => {
|
8
|
+
const {
|
9
|
+
slots,
|
10
|
+
slotProps
|
11
|
+
} = getSlots(state, ['root', 'icon', 'menuIcon']);
|
12
|
+
const {
|
13
|
+
icon,
|
14
|
+
iconOnly
|
15
|
+
} = state;
|
16
|
+
return /*#__PURE__*/React.createElement(slots.root, Object.assign({}, slotProps.root), /*#__PURE__*/React.createElement(slots.icon, Object.assign({}, slotProps.icon)), !iconOnly && slotProps.root.children, (!iconOnly || !(icon === null || icon === void 0 ? void 0 : icon.children)) && /*#__PURE__*/React.createElement(slots.menuIcon, Object.assign({}, slotProps.menuIcon)));
|
16
17
|
};
|
17
18
|
//# sourceMappingURL=renderMenuButton.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuButton/renderMenuButton.tsx"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuButton/renderMenuButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,gBAAgB,GAAI,KAAD,IAA2B;AACzD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAkB,KAAlB,EAAyB,CAAC,MAAD,EAAS,MAAT,EAAiB,UAAjB,CAAzB,CAArC;AACA,QAAM;AAAE,IAAA,IAAF;AAAQ,IAAA;AAAR,MAAqB,KAA3B;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CADF,EAEG,CAAC,QAAD,IAAa,SAAS,CAAC,IAAV,CAAe,QAF/B,EAGG,CAAC,CAAC,QAAD,IAAa,EAAC,IAAI,KAAA,IAAJ,IAAA,IAAI,KAAA,KAAA,CAAJ,GAAI,KAAA,CAAJ,GAAA,IAAI,CAAE,QAAP,CAAd,kBAAkC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,QAAP,EAAe,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,QAAf,CAAf,CAHrC,CADF;AAOD,CAXM","sourceRoot":""}
|
@@ -1,4 +1,3 @@
|
|
1
|
-
import { __assign, __rest } from "tslib";
|
2
1
|
import * as React from 'react';
|
3
2
|
import { ChevronDown20Regular, ChevronDown24Regular } from '@fluentui/react-icons';
|
4
3
|
import { resolveShorthand } from '@fluentui/react-utilities';
|
@@ -7,12 +6,13 @@ import { useButton } from '../Button/index';
|
|
7
6
|
* Given user props, returns the final state for a MenuButton.
|
8
7
|
*/
|
9
8
|
|
10
|
-
export
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
return
|
9
|
+
export const useMenuButton = ({
|
10
|
+
menuIcon,
|
11
|
+
...props
|
12
|
+
}, ref) => {
|
13
|
+
const buttonState = useButton(props, ref);
|
14
|
+
return { // Button state
|
15
|
+
...buttonState,
|
16
16
|
// State calculated from a set of props
|
17
17
|
iconOnly: Boolean(!props.children),
|
18
18
|
// Slots definition
|
@@ -27,6 +27,6 @@ export var useMenuButton = function (_a, ref) {
|
|
27
27
|
},
|
28
28
|
required: true
|
29
29
|
})
|
30
|
-
}
|
30
|
+
};
|
31
31
|
};
|
32
32
|
//# sourceMappingURL=useMenuButton.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuButton/useMenuButton.tsx"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuButton/useMenuButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,oBAAT,EAA+B,oBAA/B,QAA2D,uBAA3D;AACA,SAAS,gBAAT,QAAiC,2BAAjC;AACA,SAAS,SAAT,QAA0B,iBAA1B;AAGA;;AAEG;;AACH,OAAO,MAAM,aAAa,GAAG,CAC3B;AAAE,EAAA,QAAF;AAAY,KAAG;AAAf,CAD2B,EAE3B,GAF2B,KAGR;AACnB,QAAM,WAAW,GAAG,SAAS,CAAC,KAAD,EAAQ,GAAR,CAA7B;AACA,SAAO,EACL;AACA,OAAG,WAFE;AAIL;AACA,IAAA,QAAQ,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,QAAR,CALZ;AAOL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,QADI;AAEV,MAAA,IAAI,EAAE,MAFI;AAGV,MAAA,QAAQ,EAAE;AAHA,KARP;AAcL,IAAA,QAAQ,EAAE,gBAAgB,CAAC,QAAD,EAAW;AACnC,MAAA,YAAY,EAAE;AACZ,QAAA,QAAQ,EAAE,WAAW,CAAC,IAAZ,KAAqB,OAArB,gBAA+B,KAAA,CAAA,aAAA,CAAC,oBAAD,EAAqB,IAArB,CAA/B,gBAA0D,KAAA,CAAA,aAAA,CAAC,oBAAD,EAAqB,IAArB;AADxD,OADqB;AAInC,MAAA,QAAQ,EAAE;AAJyB,KAAX;AAdrB,GAAP;AAqBD,CA1BM","sourceRoot":""}
|
@@ -1,7 +1,8 @@
|
|
1
1
|
import { mergeClasses, __styles } from '@fluentui/react-make-styles';
|
2
2
|
import { useButtonStyles } from '../Button/useButtonStyles';
|
3
|
+
export const menuButtonClassName = 'fui-MenuButton';
|
3
4
|
|
4
|
-
|
5
|
+
const useMenuIconStyles = /*#__PURE__*/__styles({
|
5
6
|
"small": {
|
6
7
|
"Be2twd7": "fe5j1ua",
|
7
8
|
"Bqenvij": "fjamq6b",
|
@@ -21,8 +22,9 @@ var useMenuIconStyles = /*#__PURE__*/__styles({
|
|
21
22
|
"d": [".fe5j1ua{font-size:20px;}", ".fjamq6b{height:20px;}", ".f64fuq3{width:20px;}", ".f1rt2boy{font-size:24px;}", ".frvgh55{height:24px;}", ".fq4mcun{width:24px;}"]
|
22
23
|
});
|
23
24
|
|
24
|
-
export
|
25
|
-
|
25
|
+
export const useMenuButtonStyles = state => {
|
26
|
+
const menuIconStyles = useMenuIconStyles();
|
27
|
+
state.root.className = mergeClasses(menuButtonClassName, state.root.className);
|
26
28
|
|
27
29
|
if (state.menuIcon) {
|
28
30
|
state.menuIcon.className = mergeClasses(menuIconStyles[state.size], state.menuIcon.className);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/MenuButton/useMenuButtonStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,kBAAyC,6BAAzC;AAEA,SAAS,eAAT,QAAgC,2BAAhC
|
1
|
+
{"version":3,"sources":["../../../src/components/MenuButton/useMenuButtonStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,kBAAyC,6BAAzC;AAEA,SAAS,eAAT,QAAgC,2BAAhC;AAGA,OAAO,MAAM,mBAAmB,GAAG,gBAA5B;;AAEP,MAAM,iBAAiB,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA1B;;AAmBA,OAAO,MAAM,mBAAmB,GAAI,KAAD,IAA4C;AAC7E,QAAM,cAAc,GAAG,iBAAiB,EAAxC;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,mBAAD,EAAsB,KAAK,CAAC,IAAN,CAAW,SAAjC,CAAnC;;AAEA,MAAI,KAAK,CAAC,QAAV,EAAoB;AAClB,IAAA,KAAK,CAAC,QAAN,CAAe,SAAf,GAA2B,YAAY,CAAC,cAAc,CAAC,KAAK,CAAC,IAAP,CAAf,EAA6B,KAAK,CAAC,QAAN,CAAe,SAA5C,CAAvC;AACD;;AAED,EAAA,eAAe,CAAC,KAAD,CAAf;AAEA,SAAO,KAAP;AACD,CAZM","sourceRoot":""}
|
@@ -7,8 +7,8 @@ import { useSplitButtonStyles } from './useSplitButtonStyles';
|
|
7
7
|
* action, while interacting with the second one opens a menu with secondary actions.
|
8
8
|
*/
|
9
9
|
|
10
|
-
export
|
11
|
-
|
10
|
+
export const SplitButton = /*#__PURE__*/React.forwardRef((props, ref) => {
|
11
|
+
const state = useSplitButton(props, ref);
|
12
12
|
useSplitButtonStyles(state);
|
13
13
|
return renderSplitButton(state); // Casting is required due to lack of distributive union to support unions on @types/react
|
14
14
|
});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/SplitButton/SplitButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,iBAAT,QAAkC,qBAAlC;AACA,SAAS,cAAT,QAA+B,kBAA/B;AACA,SAAS,oBAAT,QAAqC,wBAArC;AAIA;;;AAGG;;AACH,OAAO,
|
1
|
+
{"version":3,"sources":["../../../src/components/SplitButton/SplitButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,iBAAT,QAAkC,qBAAlC;AACA,SAAS,cAAT,QAA+B,kBAA/B;AACA,SAAS,oBAAT,QAAqC,wBAArC;AAIA;;;AAGG;;AACH,OAAO,MAAM,WAAW,gBAA0C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAChG,QAAM,KAAK,GAAG,cAAc,CAAC,KAAD,EAAQ,GAAR,CAA5B;AAEA,EAAA,oBAAoB,CAAC,KAAD,CAApB;AAEA,SAAO,iBAAiB,CAAC,KAAD,CAAxB,CALgG,CAMhG;AACD,CAPiE,CAA3D;AASP,WAAW,CAAC,WAAZ,GAA0B,aAA1B","sourceRoot":""}
|
@@ -2,4 +2,4 @@ export * from './SplitButton';
|
|
2
2
|
export * from './SplitButton.types';
|
3
3
|
export * from './renderSplitButton';
|
4
4
|
export * from './useSplitButton';
|
5
|
-
export { useSplitButtonStyles } from './useSplitButtonStyles';
|
5
|
+
export { splitButtonClassName, useSplitButtonStyles } from './useSplitButtonStyles';
|
@@ -2,5 +2,5 @@ export * from './SplitButton';
|
|
2
2
|
export * from './SplitButton.types';
|
3
3
|
export * from './renderSplitButton';
|
4
4
|
export * from './useSplitButton';
|
5
|
-
export { useSplitButtonStyles } from './useSplitButtonStyles';
|
5
|
+
export { splitButtonClassName, useSplitButtonStyles } from './useSplitButtonStyles';
|
6
6
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SplitButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC"}
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SplitButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC"}
|
@@ -1,15 +1,14 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
1
|
import * as React from 'react';
|
3
2
|
import { getSlots } from '@fluentui/react-utilities';
|
4
3
|
/**
|
5
4
|
* Renders a SplitButton component by passing the state defined props to the appropriate slots.
|
6
5
|
*/
|
7
6
|
|
8
|
-
export
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
return /*#__PURE__*/React.createElement(slots.root,
|
7
|
+
export const renderSplitButton = state => {
|
8
|
+
const {
|
9
|
+
slots,
|
10
|
+
slotProps
|
11
|
+
} = getSlots(state, ['root', 'menuButton', 'primaryActionButton']);
|
12
|
+
return /*#__PURE__*/React.createElement(slots.root, Object.assign({}, slotProps.root), /*#__PURE__*/React.createElement(slots.primaryActionButton, Object.assign({}, slotProps.primaryActionButton)), /*#__PURE__*/React.createElement(slots.menuButton, Object.assign({}, slotProps.menuButton)));
|
14
13
|
};
|
15
14
|
//# sourceMappingURL=renderSplitButton.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/SplitButton/renderSplitButton.tsx"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/SplitButton/renderSplitButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,iBAAiB,GAAI,KAAD,IAA4B;AAC3D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAmB,KAAnB,EAA0B,CAAC,MAAD,EAAS,YAAT,EAAuB,qBAAvB,CAA1B,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,mBAAP,EAA0B,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,mBAAf,CAA1B,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,UAAf,CAAjB,CAFF,CADF;AAMD,CATM","sourceRoot":""}
|
@@ -1,4 +1,3 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
1
|
import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
|
3
2
|
import { Button } from '../Button/Button';
|
4
3
|
import { MenuButton } from '../MenuButton/MenuButton';
|
@@ -8,64 +7,61 @@ import { MenuButton } from '../MenuButton/MenuButton';
|
|
8
7
|
* @param ref - User provided ref to be passed to the SplitButton component.
|
9
8
|
*/
|
10
9
|
|
11
|
-
export
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
shape = _e === void 0 ? 'rounded' : _e,
|
27
|
-
_f = props.size,
|
28
|
-
size = _f === void 0 ? 'medium' : _f;
|
29
|
-
var menuButtonShorthand = resolveShorthand(menuButton, {
|
10
|
+
export const useSplitButton = (props, ref) => {
|
11
|
+
const {
|
12
|
+
appearance,
|
13
|
+
block = false,
|
14
|
+
children,
|
15
|
+
disabled = false,
|
16
|
+
disabledFocusable = false,
|
17
|
+
icon,
|
18
|
+
iconPosition = 'before',
|
19
|
+
menuButton,
|
20
|
+
primaryActionButton,
|
21
|
+
shape = 'rounded',
|
22
|
+
size = 'medium'
|
23
|
+
} = props;
|
24
|
+
const menuButtonShorthand = resolveShorthand(menuButton, {
|
30
25
|
defaultProps: {
|
31
|
-
appearance
|
32
|
-
disabled
|
33
|
-
disabledFocusable
|
34
|
-
shape
|
35
|
-
size
|
26
|
+
appearance,
|
27
|
+
disabled,
|
28
|
+
disabledFocusable,
|
29
|
+
shape,
|
30
|
+
size
|
36
31
|
}
|
37
32
|
});
|
38
|
-
|
33
|
+
const primaryActionButtonShorthand = resolveShorthand(primaryActionButton, {
|
39
34
|
defaultProps: {
|
40
|
-
appearance
|
41
|
-
block
|
42
|
-
children
|
43
|
-
disabled
|
44
|
-
disabledFocusable
|
45
|
-
icon
|
46
|
-
iconPosition
|
47
|
-
shape
|
48
|
-
size
|
35
|
+
appearance,
|
36
|
+
block,
|
37
|
+
children,
|
38
|
+
disabled,
|
39
|
+
disabledFocusable,
|
40
|
+
icon,
|
41
|
+
iconPosition,
|
42
|
+
shape,
|
43
|
+
size
|
49
44
|
}
|
50
45
|
});
|
51
46
|
return {
|
52
47
|
// Props passed at the top-level
|
53
|
-
appearance
|
54
|
-
block
|
55
|
-
disabled
|
56
|
-
disabledFocusable
|
57
|
-
iconPosition
|
58
|
-
shape
|
59
|
-
size
|
48
|
+
appearance,
|
49
|
+
block,
|
50
|
+
disabled,
|
51
|
+
disabledFocusable,
|
52
|
+
iconPosition,
|
53
|
+
shape,
|
54
|
+
size,
|
60
55
|
// Slots definition
|
61
56
|
components: {
|
62
57
|
root: 'div',
|
63
58
|
menuButton: MenuButton,
|
64
59
|
primaryActionButton: Button
|
65
60
|
},
|
66
|
-
root: getNativeElementProps('div',
|
67
|
-
ref
|
68
|
-
|
61
|
+
root: getNativeElementProps('div', {
|
62
|
+
ref,
|
63
|
+
...props
|
64
|
+
}),
|
69
65
|
menuButton: menuButtonShorthand,
|
70
66
|
primaryActionButton: primaryActionButtonShorthand
|
71
67
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/SplitButton/useSplitButton.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/SplitButton/useSplitButton.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,QAAwD,2BAAxD;AACA,SAAS,MAAT,QAAuB,kBAAvB;AACA,SAAS,UAAT,QAA2B,0BAA3B;AAGA;;;;AAIG;;AACH,OAAO,MAAM,cAAc,GAAG,CAC5B,KAD4B,EAE5B,GAF4B,KAGR;AACpB,QAAM;AACJ,IAAA,UADI;AAEJ,IAAA,KAAK,GAAG,KAFJ;AAGJ,IAAA,QAHI;AAIJ,IAAA,QAAQ,GAAG,KAJP;AAKJ,IAAA,iBAAiB,GAAG,KALhB;AAMJ,IAAA,IANI;AAOJ,IAAA,YAAY,GAAG,QAPX;AAQJ,IAAA,UARI;AASJ,IAAA,mBATI;AAUJ,IAAA,KAAK,GAAG,SAVJ;AAWJ,IAAA,IAAI,GAAG;AAXH,MAYF,KAZJ;AAaA,QAAM,mBAAmB,GAAG,gBAAgB,CAAC,UAAD,EAAa;AACvD,IAAA,YAAY,EAAE;AACZ,MAAA,UADY;AAEZ,MAAA,QAFY;AAGZ,MAAA,iBAHY;AAIZ,MAAA,KAJY;AAKZ,MAAA;AALY;AADyC,GAAb,CAA5C;AASA,QAAM,4BAA4B,GAAG,gBAAgB,CAAC,mBAAD,EAAsB;AACzE,IAAA,YAAY,EAAE;AACZ,MAAA,UADY;AAEZ,MAAA,KAFY;AAGZ,MAAA,QAHY;AAIZ,MAAA,QAJY;AAKZ,MAAA,iBALY;AAMZ,MAAA,IANY;AAOZ,MAAA,YAPY;AAQZ,MAAA,KARY;AASZ,MAAA;AATY;AAD2D,GAAtB,CAArD;AAcA,SAAO;AACL;AACA,IAAA,UAFK;AAGL,IAAA,KAHK;AAIL,IAAA,QAJK;AAKL,IAAA,iBALK;AAML,IAAA,YANK;AAOL,IAAA,KAPK;AAQL,IAAA,IARK;AAUL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,UAAU,EAAE,UAFF;AAGV,MAAA,mBAAmB,EAAE;AAHX,KAXP;AAiBL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;AAAE,MAAA,GAAF;AAAO,SAAG;AAAV,KAAR,CAjBtB;AAkBL,IAAA,UAAU,EAAE,mBAlBP;AAmBL,IAAA,mBAAmB,EAAE;AAnBhB,GAAP;AAqBD,CA7DM","sourceRoot":""}
|