@fluentui/react-button 9.0.0-rc.1 → 9.0.0-rc.12
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +549 -1
- package/CHANGELOG.md +321 -172
- package/README.md +80 -18
- package/dist/{react-button.d.ts → index.d.ts} +42 -37
- package/{lib → dist}/tsdoc-metadata.json +0 -0
- package/lib/Button.js.map +1 -1
- package/lib/CompoundButton.js.map +1 -1
- package/lib/MenuButton.js.map +1 -1
- package/lib/SplitButton.js.map +1 -1
- package/lib/ToggleButton.js.map +1 -1
- package/lib/components/Button/Button.js.map +1 -1
- package/lib/components/Button/Button.types.js.map +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.map +1 -1
- package/lib/components/Button/useButton.js +1 -3
- package/lib/components/Button/useButton.js.map +1 -1
- package/lib/components/Button/useButtonStyles.js +162 -115
- package/lib/components/Button/useButtonStyles.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.types.js.map +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.map +1 -1
- package/lib/components/CompoundButton/useCompoundButton.js +7 -2
- package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButtonStyles.js +72 -55
- package/lib/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.js +2 -1
- package/lib/components/MenuButton/MenuButton.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.types.js.map +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.map +1 -1
- package/lib/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButtonStyles.js +34 -14
- package/lib/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.js +1 -1
- package/lib/components/SplitButton/SplitButton.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.types.js.map +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.map +1 -1
- package/lib/components/SplitButton/useSplitButton.js +17 -8
- package/lib/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButtonStyles.js +37 -34
- package/lib/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.types.js.map +1 -1
- package/lib/components/ToggleButton/index.js +1 -1
- package/lib/components/ToggleButton/index.js.map +1 -1
- package/lib/components/ToggleButton/renderToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButton.js +3 -41
- package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButtonStyles.js +122 -61
- package/lib/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib/index.js +6 -5
- package/lib/index.js.map +1 -1
- package/lib/utils/index.js +2 -0
- package/lib/utils/index.js.map +1 -0
- package/lib/utils/useToggleState.js +37 -0
- package/lib/utils/useToggleState.js.map +1 -0
- package/lib-commonjs/Button.js.map +1 -1
- package/lib-commonjs/CompoundButton.js.map +1 -1
- package/lib-commonjs/MenuButton.js.map +1 -1
- package/lib-commonjs/SplitButton.js.map +1 -1
- package/lib-commonjs/ToggleButton.js.map +1 -1
- package/lib-commonjs/components/Button/Button.js.map +1 -1
- package/lib-commonjs/components/Button/Button.types.js.map +1 -1
- package/lib-commonjs/components/Button/index.js +3 -3
- package/lib-commonjs/components/Button/index.js.map +1 -1
- package/lib-commonjs/components/Button/renderButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButton.js +1 -3
- package/lib-commonjs/components/Button/useButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButtonStyles.js +164 -116
- package/lib-commonjs/components/Button/useButtonStyles.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.types.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/index.js +3 -3
- package/lib-commonjs/components/CompoundButton/index.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js +7 -2
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js +74 -57
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.js +2 -1
- package/lib-commonjs/components/MenuButton/MenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.types.js.map +1 -1
- package/lib-commonjs/components/MenuButton/index.js +3 -3
- package/lib-commonjs/components/MenuButton/index.js.map +1 -1
- package/lib-commonjs/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js +36 -15
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.js +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.types.js.map +1 -1
- package/lib-commonjs/components/SplitButton/index.js +3 -3
- package/lib-commonjs/components/SplitButton/index.js.map +1 -1
- package/lib-commonjs/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButton.js +16 -7
- package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js +38 -35
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.types.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/index.js +3 -3
- package/lib-commonjs/components/ToggleButton/index.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/renderToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButton.js +3 -42
- package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js +127 -63
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib-commonjs/index.js +169 -6
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/index.js +10 -0
- package/lib-commonjs/utils/index.js.map +1 -0
- package/lib-commonjs/utils/useToggleState.js +48 -0
- package/lib-commonjs/utils/useToggleState.js.map +1 -0
- package/package.json +20 -22
- package/dist/demo/index.html +0 -71
- package/dist/demo/react-dom.development.js +0 -21413
- package/dist/demo/react.development.js +0 -3155
- package/lib/Button.d.ts +0 -1
- package/lib/CompoundButton.d.ts +0 -1
- package/lib/MenuButton.d.ts +0 -1
- package/lib/SplitButton.d.ts +0 -1
- package/lib/ToggleButton.d.ts +0 -1
- package/lib/components/Button/Button.d.ts +0 -6
- package/lib/components/Button/Button.types.d.ts +0 -62
- package/lib/components/Button/index.d.ts +0 -5
- package/lib/components/Button/renderButton.d.ts +0 -5
- package/lib/components/Button/useButton.d.ts +0 -8
- package/lib/components/Button/useButtonStyles.d.ts +0 -3
- package/lib/components/CompoundButton/CompoundButton.d.ts +0 -6
- package/lib/components/CompoundButton/CompoundButton.types.d.ts +0 -14
- package/lib/components/CompoundButton/index.d.ts +0 -5
- package/lib/components/CompoundButton/renderCompoundButton.d.ts +0 -5
- package/lib/components/CompoundButton/useCompoundButton.d.ts +0 -8
- package/lib/components/CompoundButton/useCompoundButtonStyles.d.ts +0 -3
- package/lib/components/MenuButton/MenuButton.d.ts +0 -6
- package/lib/components/MenuButton/MenuButton.types.d.ts +0 -10
- package/lib/components/MenuButton/index.d.ts +0 -5
- package/lib/components/MenuButton/renderMenuButton.d.ts +0 -5
- package/lib/components/MenuButton/useMenuButton.d.ts +0 -6
- package/lib/components/MenuButton/useMenuButtonStyles.d.ts +0 -3
- package/lib/components/SplitButton/SplitButton.d.ts +0 -7
- package/lib/components/SplitButton/SplitButton.types.d.ts +0 -21
- package/lib/components/SplitButton/index.d.ts +0 -5
- package/lib/components/SplitButton/renderSplitButton.d.ts +0 -5
- package/lib/components/SplitButton/useSplitButton.d.ts +0 -8
- package/lib/components/SplitButton/useSplitButtonStyles.d.ts +0 -3
- package/lib/components/ToggleButton/ToggleButton.d.ts +0 -6
- package/lib/components/ToggleButton/ToggleButton.types.d.ts +0 -20
- package/lib/components/ToggleButton/index.d.ts +0 -5
- package/lib/components/ToggleButton/renderToggleButton.d.ts +0 -1
- package/lib/components/ToggleButton/useToggleButton.d.ts +0 -9
- package/lib/components/ToggleButton/useToggleButtonStyles.d.ts +0 -3
- package/lib/index.d.ts +0 -5
- package/lib-commonjs/Button.d.ts +0 -1
- package/lib-commonjs/CompoundButton.d.ts +0 -1
- package/lib-commonjs/MenuButton.d.ts +0 -1
- package/lib-commonjs/SplitButton.d.ts +0 -1
- package/lib-commonjs/ToggleButton.d.ts +0 -1
- package/lib-commonjs/components/Button/Button.d.ts +0 -6
- package/lib-commonjs/components/Button/Button.types.d.ts +0 -62
- package/lib-commonjs/components/Button/index.d.ts +0 -5
- package/lib-commonjs/components/Button/renderButton.d.ts +0 -5
- package/lib-commonjs/components/Button/useButton.d.ts +0 -8
- package/lib-commonjs/components/Button/useButtonStyles.d.ts +0 -3
- package/lib-commonjs/components/CompoundButton/CompoundButton.d.ts +0 -6
- package/lib-commonjs/components/CompoundButton/CompoundButton.types.d.ts +0 -14
- package/lib-commonjs/components/CompoundButton/index.d.ts +0 -5
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.d.ts +0 -5
- package/lib-commonjs/components/CompoundButton/useCompoundButton.d.ts +0 -8
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.d.ts +0 -3
- package/lib-commonjs/components/MenuButton/MenuButton.d.ts +0 -6
- package/lib-commonjs/components/MenuButton/MenuButton.types.d.ts +0 -10
- package/lib-commonjs/components/MenuButton/index.d.ts +0 -5
- package/lib-commonjs/components/MenuButton/renderMenuButton.d.ts +0 -5
- package/lib-commonjs/components/MenuButton/useMenuButton.d.ts +0 -6
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.d.ts +0 -3
- package/lib-commonjs/components/SplitButton/SplitButton.d.ts +0 -7
- package/lib-commonjs/components/SplitButton/SplitButton.types.d.ts +0 -21
- package/lib-commonjs/components/SplitButton/index.d.ts +0 -5
- package/lib-commonjs/components/SplitButton/renderSplitButton.d.ts +0 -5
- package/lib-commonjs/components/SplitButton/useSplitButton.d.ts +0 -8
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.d.ts +0 -3
- package/lib-commonjs/components/ToggleButton/ToggleButton.d.ts +0 -6
- package/lib-commonjs/components/ToggleButton/ToggleButton.types.d.ts +0 -20
- package/lib-commonjs/components/ToggleButton/index.d.ts +0 -5
- package/lib-commonjs/components/ToggleButton/renderToggleButton.d.ts +0 -1
- package/lib-commonjs/components/ToggleButton/useToggleButton.d.ts +0 -9
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.d.ts +0 -3
- package/lib-commonjs/index.d.ts +0 -5
@@ -3,45 +3,103 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useToggleButtonStyles_unstable = exports.
|
6
|
+
exports.useToggleButtonStyles_unstable = exports.useDisabledStyles = exports.useCheckedStyles = exports.toggleButtonClassNames = void 0;
|
7
7
|
|
8
|
-
const
|
8
|
+
const react_icons_1 = /*#__PURE__*/require("@fluentui/react-icons");
|
9
|
+
|
10
|
+
const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
|
9
11
|
|
10
12
|
const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
|
11
13
|
|
12
|
-
const
|
14
|
+
const react_1 = /*#__PURE__*/require("@griffel/react");
|
13
15
|
|
14
|
-
|
16
|
+
const useButtonStyles_1 = /*#__PURE__*/require("../Button/useButtonStyles");
|
15
17
|
|
16
|
-
|
18
|
+
exports.toggleButtonClassNames = {
|
19
|
+
root: 'fui-ToggleButton',
|
20
|
+
icon: 'fui-ToggleButton__icon'
|
21
|
+
};
|
22
|
+
exports.useCheckedStyles = /*#__PURE__*/react_1.__styles({
|
17
23
|
"base": {
|
18
24
|
"De3pzq": "f1nfm20t",
|
19
25
|
"g2u3we": "fj3muxo",
|
20
26
|
"h3c5rm": ["f1akhkt", "f1lxtadh"],
|
21
27
|
"B9xav0g": "f1aperda",
|
22
28
|
"zhjwy3": ["f1lxtadh", "f1akhkt"],
|
23
|
-
"sj55zd": "
|
29
|
+
"sj55zd": "f14nttnl",
|
24
30
|
"B4j52fo": "f192inf7",
|
25
31
|
"Bekrc4i": ["f5tn483", "f1ojsxk5"],
|
26
32
|
"Bn0qgzm": "f1vxd6vx",
|
27
33
|
"ibv6hh": ["f1ojsxk5", "f5tn483"],
|
34
|
+
"D0sxk3": "fxoiby5",
|
35
|
+
"t6yez3": "f15q0o9g",
|
28
36
|
"Jwef8y": "f1knas48",
|
29
37
|
"Bgoe8wy": "fvcxoqz",
|
30
38
|
"Bwzppfd": ["f1ub3y4t", "f1m52nbi"],
|
31
39
|
"oetu4i": "f1xlaoq0",
|
32
40
|
"gg5e9n": ["f1m52nbi", "f1ub3y4t"],
|
33
|
-
"Bi91k9c": "
|
34
|
-
"
|
35
|
-
"
|
36
|
-
"
|
37
|
-
"
|
38
|
-
"
|
39
|
-
"
|
41
|
+
"Bi91k9c": "feu1g3u",
|
42
|
+
"iro3zm": "f141de4g",
|
43
|
+
"b661bw": "f11v6sdu",
|
44
|
+
"Bk6r4ia": ["f9yn8i4", "f1ajwf28"],
|
45
|
+
"B9zn80p": "f1uwu36w",
|
46
|
+
"Bpld233": ["f1ajwf28", "f9yn8i4"],
|
47
|
+
"B2d53fq": "f9olfzr"
|
48
|
+
},
|
49
|
+
"highContrast": {
|
50
|
+
"Bsw6fvg": "f1rirnrt",
|
51
|
+
"Bjwas2f": "f132fbg1",
|
52
|
+
"Bn1d65q": ["f1ene5x0", "fzbc999"],
|
53
|
+
"Bxeuatn": "f6jgcol",
|
54
|
+
"n51gp8": ["fzbc999", "f1ene5x0"],
|
55
|
+
"Bbusuzp": "f1lkg8j3",
|
56
|
+
"ycbfsm": "fkc42ay",
|
57
|
+
"Bqrx1nm": "fq7113v",
|
58
|
+
"pgvf35": "ff1wgvm",
|
59
|
+
"Bh7lczh": ["fiob0tu", "f1x4h75k"],
|
60
|
+
"dpv3f4": "f1j6scgf",
|
61
|
+
"Bpnjhaq": ["f1x4h75k", "fiob0tu"],
|
62
|
+
"ze5xyy": "f4xjyn1",
|
63
|
+
"g2kj27": "fbgcvur",
|
64
|
+
"Bf756sw": "f1ks1yx8",
|
65
|
+
"Bow2dr7": ["f1o6qegi", "fmxjhhp"],
|
66
|
+
"Bvhedfk": "fcnxywj",
|
67
|
+
"Gye4lf": ["fmxjhhp", "f1o6qegi"],
|
68
|
+
"pc6evw": "f9ddjv3",
|
69
|
+
"G867l3": "fr7nen4",
|
70
|
+
"gdbnj": ["f10aq6ld", "fq8rgo9"],
|
71
|
+
"mxns5l": "f1md2qq2",
|
72
|
+
"o3nasb": ["fq8rgo9", "f10aq6ld"]
|
73
|
+
},
|
74
|
+
"highContrastFocusStyles": {
|
75
|
+
"Brovlpu": "ftqa4ok",
|
76
|
+
"rkqiyj": "f12vviyd",
|
77
|
+
"Bs3nqqt": ["f8ccjn4", "f1kizmkg"],
|
78
|
+
"B4mky7d": "f14ges4w",
|
79
|
+
"Bviepcv": ["f1kizmkg", "f8ccjn4"],
|
80
|
+
"Bc28wk5": "flnfwa4",
|
81
|
+
"w1edd7": ["fuav46a", "fcnogh1"],
|
82
|
+
"Ba8awiv": "f19zilzp",
|
83
|
+
"I50xcx": ["fcnogh1", "fuav46a"],
|
84
|
+
"Bnmjwt4": "f4h99gy",
|
85
|
+
"Jopkrh": ["f4u9xa3", "f1uetw7i"],
|
86
|
+
"hhrs2v": "fnkqhj8",
|
87
|
+
"B7jbng7": ["f1uetw7i", "f4u9xa3"],
|
88
|
+
"Bh48x57": "f1kn9aoz"
|
40
89
|
},
|
41
90
|
"outline": {
|
42
91
|
"De3pzq": "f1q9pm1r",
|
92
|
+
"B4j52fo": "fgx37oo",
|
93
|
+
"Bekrc4i": ["f130t4y6", "f1efpmoh"],
|
94
|
+
"Bn0qgzm": "fv51ejd",
|
95
|
+
"ibv6hh": ["f1efpmoh", "f130t4y6"],
|
43
96
|
"Jwef8y": "fjxutwb",
|
44
|
-
"
|
97
|
+
"iro3zm": "fwiml72",
|
98
|
+
"Brovlpu": "ftqa4ok",
|
99
|
+
"Bnmjwt4": "f1d6g2h1",
|
100
|
+
"Jopkrh": ["fs8i4z6", "fgzizio"],
|
101
|
+
"hhrs2v": "fajrl09",
|
102
|
+
"B7jbng7": ["fgzizio", "fs8i4z6"]
|
45
103
|
},
|
46
104
|
"primary": {
|
47
105
|
"De3pzq": "f8w4g0q",
|
@@ -56,13 +114,14 @@ const useCheckedStyles = /*#__PURE__*/react_1.__styles({
|
|
56
114
|
"oetu4i": "f1ukrpxl",
|
57
115
|
"gg5e9n": ["fecsdlb", "fr80ssc"],
|
58
116
|
"Bi91k9c": "f1rq72xc",
|
59
|
-
"
|
60
|
-
"
|
61
|
-
"
|
62
|
-
"
|
63
|
-
"
|
64
|
-
"
|
117
|
+
"iro3zm": "fnp9lpt",
|
118
|
+
"b661bw": "f1h0usnq",
|
119
|
+
"Bk6r4ia": ["fs4ktlq", "fx2bmrt"],
|
120
|
+
"B9zn80p": "f16h9ulv",
|
121
|
+
"Bpld233": ["fx2bmrt", "fs4ktlq"],
|
122
|
+
"B2d53fq": "f1d6v5y2"
|
65
123
|
},
|
124
|
+
"secondary": {},
|
66
125
|
"subtle": {
|
67
126
|
"De3pzq": "fq5gl1p",
|
68
127
|
"g2u3we": "f1p3nwhy",
|
@@ -76,12 +135,12 @@ const useCheckedStyles = /*#__PURE__*/react_1.__styles({
|
|
76
135
|
"oetu4i": "f1ukrpxl",
|
77
136
|
"gg5e9n": ["fecsdlb", "fr80ssc"],
|
78
137
|
"Bi91k9c": "f139oj5f",
|
79
|
-
"
|
80
|
-
"
|
81
|
-
"
|
82
|
-
"
|
83
|
-
"
|
84
|
-
"
|
138
|
+
"iro3zm": "fsv2rcd",
|
139
|
+
"b661bw": "f1h0usnq",
|
140
|
+
"Bk6r4ia": ["fs4ktlq", "fx2bmrt"],
|
141
|
+
"B9zn80p": "f16h9ulv",
|
142
|
+
"Bpld233": ["fx2bmrt", "fs4ktlq"],
|
143
|
+
"B2d53fq": "f1fg1p5m"
|
85
144
|
},
|
86
145
|
"transparent": {
|
87
146
|
"De3pzq": "f1q9pm1r",
|
@@ -96,20 +155,20 @@ const useCheckedStyles = /*#__PURE__*/react_1.__styles({
|
|
96
155
|
"oetu4i": "f1ukrpxl",
|
97
156
|
"gg5e9n": ["fecsdlb", "fr80ssc"],
|
98
157
|
"Bi91k9c": "f139oj5f",
|
99
|
-
"
|
100
|
-
"
|
101
|
-
"
|
102
|
-
"
|
103
|
-
"
|
104
|
-
"
|
158
|
+
"iro3zm": "fwiml72",
|
159
|
+
"b661bw": "f1h0usnq",
|
160
|
+
"Bk6r4ia": ["fs4ktlq", "fx2bmrt"],
|
161
|
+
"B9zn80p": "f16h9ulv",
|
162
|
+
"Bpld233": ["fx2bmrt", "fs4ktlq"],
|
163
|
+
"B2d53fq": "f1fg1p5m"
|
105
164
|
}
|
106
165
|
}, {
|
107
|
-
"d": [".f1nfm20t{background-color:var(--colorNeutralBackground1Selected);}", ".fj3muxo{border-top-color:var(--colorNeutralStroke1);}", ".f1akhkt{border-right-color:var(--colorNeutralStroke1);}", ".f1lxtadh{border-left-color:var(--colorNeutralStroke1);}", ".f1aperda{border-bottom-color:var(--colorNeutralStroke1);}", ".
|
108
|
-
"h": [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fvcxoqz:hover{border-top-color:var(--colorNeutralStroke1Hover);}", ".f1ub3y4t:hover{border-right-color:var(--colorNeutralStroke1Hover);}", ".f1m52nbi:hover{border-left-color:var(--colorNeutralStroke1Hover);}", ".f1xlaoq0:hover{border-bottom-color:var(--colorNeutralStroke1Hover);}", ".
|
109
|
-
"
|
166
|
+
"d": [".f1nfm20t{background-color:var(--colorNeutralBackground1Selected);}", ".fj3muxo{border-top-color:var(--colorNeutralStroke1);}", ".f1akhkt{border-right-color:var(--colorNeutralStroke1);}", ".f1lxtadh{border-left-color:var(--colorNeutralStroke1);}", ".f1aperda{border-bottom-color:var(--colorNeutralStroke1);}", ".f14nttnl{color:var(--colorNeutralForeground1Selected);}", ".f192inf7{border-top-width:var(--strokeWidthThin);}", ".f5tn483{border-right-width:var(--strokeWidthThin);}", ".f1ojsxk5{border-left-width:var(--strokeWidthThin);}", ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}", ".fxoiby5 .fui-Icon-filled{display:inline;}", ".f15q0o9g .fui-Icon-regular{display:none;}", "[data-keyboard-nav] .f12vviyd:focus{border-top-width:1px;}", "[data-keyboard-nav] .f8ccjn4:focus{border-right-width:1px;}", "[data-keyboard-nav] .f1kizmkg:focus{border-left-width:1px;}", "[data-keyboard-nav] .f14ges4w:focus{border-bottom-width:1px;}", "[data-keyboard-nav] .flnfwa4:focus{border-top-style:solid;}", "[data-keyboard-nav] .fuav46a:focus{border-right-style:solid;}", "[data-keyboard-nav] .fcnogh1:focus{border-left-style:solid;}", "[data-keyboard-nav] .f19zilzp:focus{border-bottom-style:solid;}", "[data-keyboard-nav] .f4h99gy:focus{border-top-color:HighlightText;}", "[data-keyboard-nav] .f4u9xa3:focus{border-right-color:HighlightText;}", "[data-keyboard-nav] .f1uetw7i:focus{border-left-color:HighlightText;}", "[data-keyboard-nav] .fnkqhj8:focus{border-bottom-color:HighlightText;}", "[data-keyboard-nav] .f1kn9aoz:focus{outline-color:Highlight;}", ".f1q9pm1r{background-color:var(--colorTransparentBackgroundSelected);}", ".fgx37oo{border-top-width:var(--strokeWidthThicker);}", ".f130t4y6{border-right-width:var(--strokeWidthThicker);}", ".f1efpmoh{border-left-width:var(--strokeWidthThicker);}", ".fv51ejd{border-bottom-width:var(--strokeWidthThicker);}", "[data-keyboard-nav] .f1d6g2h1:focus{border-top-color:var(--colorNeutralStroke1);}", "[data-keyboard-nav] .fs8i4z6:focus{border-right-color:var(--colorNeutralStroke1);}", "[data-keyboard-nav] .fgzizio:focus{border-left-color:var(--colorNeutralStroke1);}", "[data-keyboard-nav] .fajrl09:focus{border-bottom-color:var(--colorNeutralStroke1);}", ".f8w4g0q{background-color:var(--colorBrandBackgroundSelected);}", ".f1p3nwhy{border-top-color:transparent;}", ".f11589ue{border-right-color:transparent;}", ".f1pdflbu{border-left-color:transparent;}", ".f1q5o8ev{border-bottom-color:transparent;}", ".f1phragk{color:var(--colorNeutralForegroundOnBrand);}", ".fq5gl1p{background-color:var(--colorSubtleBackgroundSelected);}", ".f1qj7y59{color:var(--colorNeutralForeground2BrandSelected);}"],
|
167
|
+
"h": [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fvcxoqz:hover{border-top-color:var(--colorNeutralStroke1Hover);}", ".f1ub3y4t:hover{border-right-color:var(--colorNeutralStroke1Hover);}", ".f1m52nbi:hover{border-left-color:var(--colorNeutralStroke1Hover);}", ".f1xlaoq0:hover{border-bottom-color:var(--colorNeutralStroke1Hover);}", ".feu1g3u:hover{color:var(--colorNeutralForeground1Hover);}", ".f141de4g:hover:active{background-color:var(--colorNeutralBackground1Pressed);}", ".f11v6sdu:hover:active{border-top-color:var(--colorNeutralStroke1Pressed);}", ".f9yn8i4:hover:active{border-right-color:var(--colorNeutralStroke1Pressed);}", ".f1ajwf28:hover:active{border-left-color:var(--colorNeutralStroke1Pressed);}", ".f1uwu36w:hover:active{border-bottom-color:var(--colorNeutralStroke1Pressed);}", ".f9olfzr:hover:active{color:var(--colorNeutralForeground1Pressed);}", ".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}", ".fwiml72:hover:active{background-color:var(--colorTransparentBackgroundPressed);}", ".f15wkkf3:hover{background-color:var(--colorBrandBackgroundHover);}", ".f1s2uweq:hover{border-top-color:transparent;}", ".fr80ssc:hover{border-right-color:transparent;}", ".fecsdlb:hover{border-left-color:transparent;}", ".f1ukrpxl:hover{border-bottom-color:transparent;}", ".f1rq72xc:hover{color:var(--colorNeutralForegroundOnBrand);}", ".fnp9lpt:hover:active{background-color:var(--colorBrandBackgroundPressed);}", ".f1h0usnq:hover:active{border-top-color:transparent;}", ".fs4ktlq:hover:active{border-right-color:transparent;}", ".fx2bmrt:hover:active{border-left-color:transparent;}", ".f16h9ulv:hover:active{border-bottom-color:transparent;}", ".f1d6v5y2:hover:active{color:var(--colorNeutralForegroundOnBrand);}", ".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}", ".f139oj5f:hover{color:var(--colorNeutralForeground2BrandHover);}", ".fsv2rcd:hover:active{background-color:var(--colorSubtleBackgroundPressed);}", ".f1fg1p5m:hover:active{color:var(--colorNeutralForeground2BrandPressed);}"],
|
168
|
+
"t": ["@media (forced-colors: active){.f1rirnrt{background-color:Highlight;}}", "@media (forced-colors: active){.f132fbg1{border-top-color:Highlight;}}", "@media (forced-colors: active){.f1ene5x0{border-right-color:Highlight;}.fzbc999{border-left-color:Highlight;}}", "@media (forced-colors: active){.f6jgcol{border-bottom-color:Highlight;}}", "@media (forced-colors: active){.fzbc999{border-left-color:Highlight;}.f1ene5x0{border-right-color:Highlight;}}", "@media (forced-colors: active){.f1lkg8j3{color:HighlightText;}}", "@media (forced-colors: active){.fkc42ay{forced-color-adjust:none;}}", "@media (forced-colors: active){.fq7113v:hover{background-color:HighlightText;}}", "@media (forced-colors: active){.ff1wgvm:hover{border-top-color:Highlight;}}", "@media (forced-colors: active){.fiob0tu:hover{border-right-color:Highlight;}.f1x4h75k:hover{border-left-color:Highlight;}}", "@media (forced-colors: active){.f1j6scgf:hover{border-bottom-color:Highlight;}}", "@media (forced-colors: active){.f1x4h75k:hover{border-left-color:Highlight;}.fiob0tu:hover{border-right-color:Highlight;}}", "@media (forced-colors: active){.f4xjyn1:hover{color:Highlight;}}", "@media (forced-colors: active){.fbgcvur:hover:active{background-color:HighlightText;}}", "@media (forced-colors: active){.f1ks1yx8:hover:active{border-top-color:Highlight;}}", "@media (forced-colors: active){.f1o6qegi:hover:active{border-right-color:Highlight;}.fmxjhhp:hover:active{border-left-color:Highlight;}}", "@media (forced-colors: active){.fcnxywj:hover:active{border-bottom-color:Highlight;}}", "@media (forced-colors: active){.fmxjhhp:hover:active{border-left-color:Highlight;}.f1o6qegi:hover:active{border-right-color:Highlight;}}", "@media (forced-colors: active){.f9ddjv3:hover:active{color:Highlight;}}", "@media (forced-colors: active){.fr7nen4:focus{border-top-color:Highlight;}}", "@media (forced-colors: active){.f10aq6ld:focus{border-right-color:Highlight;}.fq8rgo9:focus{border-left-color:Highlight;}}", "@media (forced-colors: active){.f1md2qq2:focus{border-bottom-color:Highlight;}}", "@media (forced-colors: active){.fq8rgo9:focus{border-left-color:Highlight;}.f10aq6ld:focus{border-right-color:Highlight;}}"],
|
169
|
+
"f": [".ftqa4ok:focus{outline-style:none;}"]
|
110
170
|
});
|
111
|
-
|
112
|
-
const useDisabledStyles = /*#__PURE__*/react_1.__styles({
|
171
|
+
exports.useDisabledStyles = /*#__PURE__*/react_1.__styles({
|
113
172
|
"base": {
|
114
173
|
"De3pzq": "f1bg9a2p",
|
115
174
|
"g2u3we": "f1jj8ep1",
|
@@ -123,12 +182,12 @@ const useDisabledStyles = /*#__PURE__*/react_1.__styles({
|
|
123
182
|
"oetu4i": "f1jnshp0",
|
124
183
|
"gg5e9n": ["f18rmfxp", "f1gwvigk"],
|
125
184
|
"Bi91k9c": "fvgxktp",
|
126
|
-
"
|
127
|
-
"
|
128
|
-
"
|
129
|
-
"
|
130
|
-
"
|
131
|
-
"
|
185
|
+
"iro3zm": "f1t6o4dc",
|
186
|
+
"b661bw": "f10ztigi",
|
187
|
+
"Bk6r4ia": ["f1ft5sdu", "f1gzf82w"],
|
188
|
+
"B9zn80p": "f12zbtn2",
|
189
|
+
"Bpld233": ["f1gzf82w", "f1ft5sdu"],
|
190
|
+
"B2d53fq": "fcvwxyo"
|
132
191
|
},
|
133
192
|
"outline": {},
|
134
193
|
"primary": {
|
@@ -140,11 +199,12 @@ const useDisabledStyles = /*#__PURE__*/react_1.__styles({
|
|
140
199
|
"Bwzppfd": ["fr80ssc", "fecsdlb"],
|
141
200
|
"oetu4i": "f1ukrpxl",
|
142
201
|
"gg5e9n": ["fecsdlb", "fr80ssc"],
|
143
|
-
"
|
144
|
-
"
|
145
|
-
"
|
146
|
-
"
|
202
|
+
"b661bw": "f1h0usnq",
|
203
|
+
"Bk6r4ia": ["fs4ktlq", "fx2bmrt"],
|
204
|
+
"B9zn80p": "f16h9ulv",
|
205
|
+
"Bpld233": ["fx2bmrt", "fs4ktlq"]
|
147
206
|
},
|
207
|
+
"secondary": {},
|
148
208
|
"subtle": {
|
149
209
|
"De3pzq": "f3rmtva",
|
150
210
|
"g2u3we": "f1p3nwhy",
|
@@ -156,11 +216,11 @@ const useDisabledStyles = /*#__PURE__*/react_1.__styles({
|
|
156
216
|
"Bwzppfd": ["fr80ssc", "fecsdlb"],
|
157
217
|
"oetu4i": "f1ukrpxl",
|
158
218
|
"gg5e9n": ["fecsdlb", "fr80ssc"],
|
159
|
-
"
|
160
|
-
"
|
161
|
-
"
|
162
|
-
"
|
163
|
-
"
|
219
|
+
"iro3zm": "fvaszet",
|
220
|
+
"b661bw": "f1h0usnq",
|
221
|
+
"Bk6r4ia": ["fs4ktlq", "fx2bmrt"],
|
222
|
+
"B9zn80p": "f16h9ulv",
|
223
|
+
"Bpld233": ["fx2bmrt", "fs4ktlq"]
|
164
224
|
},
|
165
225
|
"transparent": {
|
166
226
|
"De3pzq": "f3rmtva",
|
@@ -173,31 +233,35 @@ const useDisabledStyles = /*#__PURE__*/react_1.__styles({
|
|
173
233
|
"Bwzppfd": ["fr80ssc", "fecsdlb"],
|
174
234
|
"oetu4i": "f1ukrpxl",
|
175
235
|
"gg5e9n": ["fecsdlb", "fr80ssc"],
|
176
|
-
"
|
177
|
-
"
|
178
|
-
"
|
179
|
-
"
|
180
|
-
"
|
236
|
+
"iro3zm": "fvaszet",
|
237
|
+
"b661bw": "f1h0usnq",
|
238
|
+
"Bk6r4ia": ["fs4ktlq", "fx2bmrt"],
|
239
|
+
"B9zn80p": "f16h9ulv",
|
240
|
+
"Bpld233": ["fx2bmrt", "fs4ktlq"]
|
181
241
|
}
|
182
242
|
}, {
|
183
243
|
"d": [".f1bg9a2p{background-color:var(--colorNeutralBackgroundDisabled);}", ".f1jj8ep1{border-top-color:var(--colorNeutralStrokeDisabled);}", ".f15xbau{border-right-color:var(--colorNeutralStrokeDisabled);}", ".fy0fskl{border-left-color:var(--colorNeutralStrokeDisabled);}", ".f4ikngz{border-bottom-color:var(--colorNeutralStrokeDisabled);}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".f1p3nwhy{border-top-color:transparent;}", ".f11589ue{border-right-color:transparent;}", ".f1pdflbu{border-left-color:transparent;}", ".f1q5o8ev{border-bottom-color:transparent;}", ".f3rmtva{background-color:transparent;}"],
|
184
|
-
"h": [".f1falr9n:hover{background-color:var(--colorNeutralBackgroundDisabled);}", ".f12mpcsy:hover{border-top-color:var(--colorNeutralStrokeDisabled);}", ".f1gwvigk:hover{border-right-color:var(--colorNeutralStrokeDisabled);}", ".f18rmfxp:hover{border-left-color:var(--colorNeutralStrokeDisabled);}", ".f1jnshp0:hover{border-bottom-color:var(--colorNeutralStrokeDisabled);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}", ".f1s2uweq:hover{border-top-color:transparent;}", ".fr80ssc:hover{border-right-color:transparent;}", ".fecsdlb:hover{border-left-color:transparent;}", ".f1ukrpxl:hover{border-bottom-color:transparent;}", ".f1cio4g9:hover{background-color:transparent;}"]
|
185
|
-
"a": [".f1ryyzvn:active{background-color:var(--colorNeutralBackgroundDisabled);}", ".fdi4vxw:active{border-top-color:var(--colorNeutralStrokeDisabled);}", ".f4ryxzl:active{border-right-color:var(--colorNeutralStrokeDisabled);}", ".fkdgpbx:active{border-left-color:var(--colorNeutralStrokeDisabled);}", ".fcmhn06:active{border-bottom-color:var(--colorNeutralStrokeDisabled);}", ".f19wldhg:active{color:var(--colorNeutralForegroundDisabled);}", ".ff472gp:active{border-top-color:transparent;}", ".f4yyc7m:active{border-right-color:transparent;}", ".ft2aflc:active{border-left-color:transparent;}", ".fggejwh:active{border-bottom-color:transparent;}", ".f1rot6hk:active{background-color:transparent;}"]
|
244
|
+
"h": [".f1falr9n:hover{background-color:var(--colorNeutralBackgroundDisabled);}", ".f12mpcsy:hover{border-top-color:var(--colorNeutralStrokeDisabled);}", ".f1gwvigk:hover{border-right-color:var(--colorNeutralStrokeDisabled);}", ".f18rmfxp:hover{border-left-color:var(--colorNeutralStrokeDisabled);}", ".f1jnshp0:hover{border-bottom-color:var(--colorNeutralStrokeDisabled);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}", ".f1t6o4dc:hover:active{background-color:var(--colorNeutralBackgroundDisabled);}", ".f10ztigi:hover:active{border-top-color:var(--colorNeutralStrokeDisabled);}", ".f1ft5sdu:hover:active{border-right-color:var(--colorNeutralStrokeDisabled);}", ".f1gzf82w:hover:active{border-left-color:var(--colorNeutralStrokeDisabled);}", ".f12zbtn2:hover:active{border-bottom-color:var(--colorNeutralStrokeDisabled);}", ".fcvwxyo:hover:active{color:var(--colorNeutralForegroundDisabled);}", ".f1s2uweq:hover{border-top-color:transparent;}", ".fr80ssc:hover{border-right-color:transparent;}", ".fecsdlb:hover{border-left-color:transparent;}", ".f1ukrpxl:hover{border-bottom-color:transparent;}", ".f1h0usnq:hover:active{border-top-color:transparent;}", ".fs4ktlq:hover:active{border-right-color:transparent;}", ".fx2bmrt:hover:active{border-left-color:transparent;}", ".f16h9ulv:hover:active{border-bottom-color:transparent;}", ".f1cio4g9:hover{background-color:transparent;}", ".fvaszet:hover:active{background-color:transparent;}"]
|
186
245
|
});
|
187
246
|
|
188
247
|
const useToggleButtonStyles_unstable = state => {
|
189
|
-
const checkedStyles = useCheckedStyles();
|
190
|
-
const disabledStyles = useDisabledStyles();
|
248
|
+
const checkedStyles = exports.useCheckedStyles();
|
249
|
+
const disabledStyles = exports.useDisabledStyles();
|
191
250
|
const {
|
192
251
|
appearance,
|
193
252
|
checked,
|
194
253
|
disabled,
|
195
254
|
disabledFocusable
|
196
255
|
} = state;
|
197
|
-
state.root.className = react_1.mergeClasses(exports.
|
198
|
-
checked && checkedStyles.base, appearance && checked && checkedStyles[appearance], // Disabled styles
|
256
|
+
state.root.className = react_1.mergeClasses(exports.toggleButtonClassNames.root, // Checked styles
|
257
|
+
checked && checkedStyles.base, checked && checkedStyles.highContrast, appearance && checked && checkedStyles[appearance], // Disabled styles
|
199
258
|
(disabled || disabledFocusable) && disabledStyles.base, appearance && (disabled || disabledFocusable) && disabledStyles[appearance], // User provided class name
|
200
259
|
state.root.className);
|
260
|
+
|
261
|
+
if (state.icon) {
|
262
|
+
state.icon.className = react_1.mergeClasses(exports.toggleButtonClassNames.icon, state.icon.className);
|
263
|
+
}
|
264
|
+
|
201
265
|
useButtonStyles_1.useButtonStyles_unstable(state);
|
202
266
|
return state;
|
203
267
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/ToggleButton/useToggleButtonStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { useButtonStyles_unstable } from '../Button/useButtonStyles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ButtonSlots } from '../Button/Button.types';\nimport type { ToggleButtonState } from './ToggleButton.types';\n\nexport const toggleButtonClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fui-ToggleButton',\n icon: 'fui-ToggleButton__icon',\n};\n\nexport const useCheckedStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n color: tokens.colorNeutralForeground1Selected,\n\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n color: tokens.colorNeutralForeground1Hover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n color: tokens.colorNeutralForeground1Pressed,\n },\n },\n\n // High contrast styles\n highContrast: {\n '@media (forced-colors: active)': {\n backgroundColor: 'Highlight',\n ...shorthands.borderColor('Highlight'),\n color: 'HighlightText',\n forcedColorAdjust: 'none',\n\n ':hover': {\n backgroundColor: 'HighlightText',\n ...shorthands.borderColor('Highlight'),\n color: 'Highlight',\n },\n\n ':hover:active': {\n backgroundColor: 'HighlightText',\n ...shorthands.borderColor('Highlight'),\n color: 'Highlight',\n },\n\n ':focus': {\n ...shorthands.borderColor('Highlight'),\n },\n },\n },\n highContrastFocusStyles: createCustomFocusIndicatorStyle({\n ...shorthands.border('1px', 'solid', 'HighlightText'),\n outlineColor: 'Highlight',\n }),\n\n // Appearance variations\n outline: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n ...shorthands.borderWidth(tokens.strokeWidthThicker),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n },\n\n ...createCustomFocusIndicatorStyle({\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n }),\n },\n primary: {\n backgroundColor: tokens.colorBrandBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n\n ':hover': {\n backgroundColor: tokens.colorBrandBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandSelected,\n\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandSelected,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n});\n\nexport const useDisabledStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n\n // Appearance variations\n outline: {\n /* No styles */\n },\n primary: {\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n ...shorthands.borderColor('transparent'),\n },\n },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n },\n },\n transparent: {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n },\n },\n});\n\nexport const useToggleButtonStyles_unstable = (state: ToggleButtonState): ToggleButtonState => {\n const checkedStyles = useCheckedStyles();\n const disabledStyles = useDisabledStyles();\n\n const { appearance, checked, disabled, disabledFocusable } = state;\n\n state.root.className = mergeClasses(\n toggleButtonClassNames.root,\n\n // Checked styles\n checked && checkedStyles.base,\n checked && checkedStyles.highContrast,\n appearance && checked && checkedStyles[appearance],\n\n // Disabled styles\n (disabled || disabledFocusable) && disabledStyles.base,\n appearance && (disabled || disabledFocusable) && disabledStyles[appearance],\n\n // User provided class name\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(toggleButtonClassNames.icon, state.icon.className);\n }\n\n useButtonStyles_unstable(state);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
package/lib-commonjs/index.js
CHANGED
@@ -3,16 +3,179 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
+
exports.useToggleState = exports.useToggleButton_unstable = exports.useToggleButtonStyles_unstable = exports.toggleButtonClassNames = exports.renderToggleButton_unstable = exports.ToggleButton = exports.useSplitButton_unstable = exports.useSplitButtonStyles_unstable = exports.splitButtonClassNames = exports.renderSplitButton_unstable = exports.SplitButton = exports.useMenuButton_unstable = exports.useMenuButtonStyles_unstable = exports.renderMenuButton_unstable = exports.menuButtonClassNames = exports.MenuButton = exports.useCompoundButton_unstable = exports.useCompoundButtonStyles_unstable = exports.renderCompoundButton_unstable = exports.compoundButtonClassNames = exports.CompoundButton = exports.useButton_unstable = exports.useButtonStyles_unstable = exports.renderButton_unstable = exports.buttonClassNames = exports.Button = void 0;
|
6
7
|
|
7
|
-
|
8
|
+
var Button_1 = /*#__PURE__*/require("./Button");
|
8
9
|
|
9
|
-
|
10
|
+
Object.defineProperty(exports, "Button", {
|
11
|
+
enumerable: true,
|
12
|
+
get: function () {
|
13
|
+
return Button_1.Button;
|
14
|
+
}
|
15
|
+
});
|
16
|
+
Object.defineProperty(exports, "buttonClassNames", {
|
17
|
+
enumerable: true,
|
18
|
+
get: function () {
|
19
|
+
return Button_1.buttonClassNames;
|
20
|
+
}
|
21
|
+
});
|
22
|
+
Object.defineProperty(exports, "renderButton_unstable", {
|
23
|
+
enumerable: true,
|
24
|
+
get: function () {
|
25
|
+
return Button_1.renderButton_unstable;
|
26
|
+
}
|
27
|
+
});
|
28
|
+
Object.defineProperty(exports, "useButtonStyles_unstable", {
|
29
|
+
enumerable: true,
|
30
|
+
get: function () {
|
31
|
+
return Button_1.useButtonStyles_unstable;
|
32
|
+
}
|
33
|
+
});
|
34
|
+
Object.defineProperty(exports, "useButton_unstable", {
|
35
|
+
enumerable: true,
|
36
|
+
get: function () {
|
37
|
+
return Button_1.useButton_unstable;
|
38
|
+
}
|
39
|
+
});
|
40
|
+
|
41
|
+
var CompoundButton_1 = /*#__PURE__*/require("./CompoundButton");
|
42
|
+
|
43
|
+
Object.defineProperty(exports, "CompoundButton", {
|
44
|
+
enumerable: true,
|
45
|
+
get: function () {
|
46
|
+
return CompoundButton_1.CompoundButton;
|
47
|
+
}
|
48
|
+
});
|
49
|
+
Object.defineProperty(exports, "compoundButtonClassNames", {
|
50
|
+
enumerable: true,
|
51
|
+
get: function () {
|
52
|
+
return CompoundButton_1.compoundButtonClassNames;
|
53
|
+
}
|
54
|
+
});
|
55
|
+
Object.defineProperty(exports, "renderCompoundButton_unstable", {
|
56
|
+
enumerable: true,
|
57
|
+
get: function () {
|
58
|
+
return CompoundButton_1.renderCompoundButton_unstable;
|
59
|
+
}
|
60
|
+
});
|
61
|
+
Object.defineProperty(exports, "useCompoundButtonStyles_unstable", {
|
62
|
+
enumerable: true,
|
63
|
+
get: function () {
|
64
|
+
return CompoundButton_1.useCompoundButtonStyles_unstable;
|
65
|
+
}
|
66
|
+
});
|
67
|
+
Object.defineProperty(exports, "useCompoundButton_unstable", {
|
68
|
+
enumerable: true,
|
69
|
+
get: function () {
|
70
|
+
return CompoundButton_1.useCompoundButton_unstable;
|
71
|
+
}
|
72
|
+
});
|
73
|
+
|
74
|
+
var MenuButton_1 = /*#__PURE__*/require("./MenuButton");
|
75
|
+
|
76
|
+
Object.defineProperty(exports, "MenuButton", {
|
77
|
+
enumerable: true,
|
78
|
+
get: function () {
|
79
|
+
return MenuButton_1.MenuButton;
|
80
|
+
}
|
81
|
+
});
|
82
|
+
Object.defineProperty(exports, "menuButtonClassNames", {
|
83
|
+
enumerable: true,
|
84
|
+
get: function () {
|
85
|
+
return MenuButton_1.menuButtonClassNames;
|
86
|
+
}
|
87
|
+
});
|
88
|
+
Object.defineProperty(exports, "renderMenuButton_unstable", {
|
89
|
+
enumerable: true,
|
90
|
+
get: function () {
|
91
|
+
return MenuButton_1.renderMenuButton_unstable;
|
92
|
+
}
|
93
|
+
});
|
94
|
+
Object.defineProperty(exports, "useMenuButtonStyles_unstable", {
|
95
|
+
enumerable: true,
|
96
|
+
get: function () {
|
97
|
+
return MenuButton_1.useMenuButtonStyles_unstable;
|
98
|
+
}
|
99
|
+
});
|
100
|
+
Object.defineProperty(exports, "useMenuButton_unstable", {
|
101
|
+
enumerable: true,
|
102
|
+
get: function () {
|
103
|
+
return MenuButton_1.useMenuButton_unstable;
|
104
|
+
}
|
105
|
+
});
|
106
|
+
|
107
|
+
var SplitButton_1 = /*#__PURE__*/require("./SplitButton");
|
108
|
+
|
109
|
+
Object.defineProperty(exports, "SplitButton", {
|
110
|
+
enumerable: true,
|
111
|
+
get: function () {
|
112
|
+
return SplitButton_1.SplitButton;
|
113
|
+
}
|
114
|
+
});
|
115
|
+
Object.defineProperty(exports, "renderSplitButton_unstable", {
|
116
|
+
enumerable: true,
|
117
|
+
get: function () {
|
118
|
+
return SplitButton_1.renderSplitButton_unstable;
|
119
|
+
}
|
120
|
+
});
|
121
|
+
Object.defineProperty(exports, "splitButtonClassNames", {
|
122
|
+
enumerable: true,
|
123
|
+
get: function () {
|
124
|
+
return SplitButton_1.splitButtonClassNames;
|
125
|
+
}
|
126
|
+
});
|
127
|
+
Object.defineProperty(exports, "useSplitButtonStyles_unstable", {
|
128
|
+
enumerable: true,
|
129
|
+
get: function () {
|
130
|
+
return SplitButton_1.useSplitButtonStyles_unstable;
|
131
|
+
}
|
132
|
+
});
|
133
|
+
Object.defineProperty(exports, "useSplitButton_unstable", {
|
134
|
+
enumerable: true,
|
135
|
+
get: function () {
|
136
|
+
return SplitButton_1.useSplitButton_unstable;
|
137
|
+
}
|
138
|
+
});
|
10
139
|
|
11
|
-
|
140
|
+
var ToggleButton_1 = /*#__PURE__*/require("./ToggleButton");
|
12
141
|
|
13
|
-
|
142
|
+
Object.defineProperty(exports, "ToggleButton", {
|
143
|
+
enumerable: true,
|
144
|
+
get: function () {
|
145
|
+
return ToggleButton_1.ToggleButton;
|
146
|
+
}
|
147
|
+
});
|
148
|
+
Object.defineProperty(exports, "renderToggleButton_unstable", {
|
149
|
+
enumerable: true,
|
150
|
+
get: function () {
|
151
|
+
return ToggleButton_1.renderToggleButton_unstable;
|
152
|
+
}
|
153
|
+
});
|
154
|
+
Object.defineProperty(exports, "toggleButtonClassNames", {
|
155
|
+
enumerable: true,
|
156
|
+
get: function () {
|
157
|
+
return ToggleButton_1.toggleButtonClassNames;
|
158
|
+
}
|
159
|
+
});
|
160
|
+
Object.defineProperty(exports, "useToggleButtonStyles_unstable", {
|
161
|
+
enumerable: true,
|
162
|
+
get: function () {
|
163
|
+
return ToggleButton_1.useToggleButtonStyles_unstable;
|
164
|
+
}
|
165
|
+
});
|
166
|
+
Object.defineProperty(exports, "useToggleButton_unstable", {
|
167
|
+
enumerable: true,
|
168
|
+
get: function () {
|
169
|
+
return ToggleButton_1.useToggleButton_unstable;
|
170
|
+
}
|
171
|
+
});
|
14
172
|
|
15
|
-
|
173
|
+
var index_1 = /*#__PURE__*/require("./utils/index");
|
16
174
|
|
17
|
-
|
175
|
+
Object.defineProperty(exports, "useToggleState", {
|
176
|
+
enumerable: true,
|
177
|
+
get: function () {
|
178
|
+
return index_1.useToggleState;
|
179
|
+
}
|
180
|
+
});
|
18
181
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":"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","sourcesContent":["export {\n Button,\n buttonClassNames,\n renderButton_unstable,\n useButtonStyles_unstable,\n useButton_unstable,\n} from './Button';\nexport type { ButtonProps, ButtonSlots, ButtonState } from './Button';\nexport {\n CompoundButton,\n compoundButtonClassNames,\n renderCompoundButton_unstable,\n useCompoundButtonStyles_unstable,\n useCompoundButton_unstable,\n} from './CompoundButton';\nexport type { CompoundButtonProps, CompoundButtonSlots, CompoundButtonState } from './CompoundButton';\nexport {\n MenuButton,\n menuButtonClassNames,\n renderMenuButton_unstable,\n useMenuButtonStyles_unstable,\n useMenuButton_unstable,\n} from './MenuButton';\nexport type { MenuButtonProps, MenuButtonSlots, MenuButtonState } from './MenuButton';\nexport {\n SplitButton,\n renderSplitButton_unstable,\n splitButtonClassNames,\n useSplitButtonStyles_unstable,\n useSplitButton_unstable,\n} from './SplitButton';\nexport type { SplitButtonProps, SplitButtonSlots, SplitButtonState } from './SplitButton';\nexport {\n ToggleButton,\n renderToggleButton_unstable,\n toggleButtonClassNames,\n useToggleButtonStyles_unstable,\n useToggleButton_unstable,\n} from './ToggleButton';\nexport type { ToggleButtonProps, ToggleButtonState } from './ToggleButton';\n\nexport { useToggleState } from './utils/index';\n"],"sourceRoot":"../src/"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["utils/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './useToggleState';\n"],"sourceRoot":"../src/"}
|
@@ -0,0 +1,48 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.useToggleState = void 0;
|
7
|
+
|
8
|
+
const React = /*#__PURE__*/require("react");
|
9
|
+
|
10
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
11
|
+
|
12
|
+
function useToggleState(props, state) {
|
13
|
+
const {
|
14
|
+
checked,
|
15
|
+
defaultChecked,
|
16
|
+
disabled,
|
17
|
+
disabledFocusable
|
18
|
+
} = props;
|
19
|
+
const {
|
20
|
+
onClick,
|
21
|
+
role
|
22
|
+
} = state.root;
|
23
|
+
const [checkedValue, setCheckedValue] = react_utilities_1.useControllableState({
|
24
|
+
state: checked,
|
25
|
+
defaultState: defaultChecked,
|
26
|
+
initialState: false
|
27
|
+
});
|
28
|
+
const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';
|
29
|
+
const onToggleClick = React.useCallback(ev => {
|
30
|
+
if (!disabled && !disabledFocusable) {
|
31
|
+
if (ev.defaultPrevented) {
|
32
|
+
return;
|
33
|
+
}
|
34
|
+
|
35
|
+
setCheckedValue(!checkedValue);
|
36
|
+
}
|
37
|
+
}, [checkedValue, disabled, disabledFocusable, setCheckedValue]);
|
38
|
+
return { ...state,
|
39
|
+
checked: checkedValue,
|
40
|
+
root: { ...state.root,
|
41
|
+
[isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed']: checkedValue,
|
42
|
+
onClick: react_utilities_1.useMergedEventCallbacks(onClick, onToggleClick)
|
43
|
+
}
|
44
|
+
};
|
45
|
+
}
|
46
|
+
|
47
|
+
exports.useToggleState = useToggleState;
|
48
|
+
//# sourceMappingURL=useToggleState.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["utils/useToggleState.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAIA,SAAgB,cAAhB,CAIE,KAJF,EAI6B,KAJ7B,EAIgD;AAC9C,QAAM;AAAE,IAAA,OAAF;AAAW,IAAA,cAAX;AAA2B,IAAA,QAA3B;AAAqC,IAAA;AAArC,MAA2D,KAAjE;AACA,QAAM;AAAE,IAAA,OAAF;AAAW,IAAA;AAAX,MAAoB,KAAK,CAAC,IAAhC;AAEA,QAAM,CAAC,YAAD,EAAe,eAAf,IAAkC,iBAAA,CAAA,oBAAA,CAAqB;AAC3D,IAAA,KAAK,EAAE,OADoD;AAE3D,IAAA,YAAY,EAAE,cAF6C;AAG3D,IAAA,YAAY,EAAE;AAH6C,GAArB,CAAxC;AAMA,QAAM,kBAAkB,GAAG,IAAI,KAAK,kBAAT,IAA+B,IAAI,KAAK,UAAnE;AAEA,QAAM,aAAa,GAAG,KAAK,CAAC,WAAN,CACpB,EAAE,IAAG;AACH,QAAI,CAAC,QAAD,IAAa,CAAC,iBAAlB,EAAqC;AACnC,UAAI,EAAE,CAAC,gBAAP,EAAyB;AACvB;AACD;;AAED,MAAA,eAAe,CAAC,CAAC,YAAF,CAAf;AACD;AACF,GATmB,EAUpB,CAAC,YAAD,EAAe,QAAf,EAAyB,iBAAzB,EAA4C,eAA5C,CAVoB,CAAtB;AAaA,SAAO,EACL,GAAG,KADE;AAGL,IAAA,OAAO,EAAE,YAHJ;AAKL,IAAA,IAAI,EAAE,EACJ,GAAG,KAAK,CAAC,IADL;AAEJ,OAAC,kBAAkB,GAAG,cAAH,GAAoB,cAAvC,GAAwD,YAFpD;AAGJ,MAAA,OAAO,EAAE,iBAAA,CAAA,uBAAA,CACP,OADO,EAEP,aAFO;AAHL;AALD,GAAP;AAcD;;AA3CD,OAAA,CAAA,cAAA,GAAA,cAAA","sourcesContent":["import * as React from 'react';\nimport { useControllableState, useMergedEventCallbacks } from '@fluentui/react-utilities';\nimport type { ButtonState } from '../Button';\nimport type { ToggleButtonProps, ToggleButtonState } from '../ToggleButton';\n\nexport function useToggleState<\n TToggleButtonProps extends Pick<ToggleButtonProps, 'checked' | 'defaultChecked' | 'disabled' | 'disabledFocusable'>,\n TButtonState extends Pick<ButtonState, 'root'>,\n TToggleButtonState extends Pick<ToggleButtonState, 'checked' | 'root'>\n>(props: TToggleButtonProps, state: TButtonState): TToggleButtonState {\n const { checked, defaultChecked, disabled, disabledFocusable } = props;\n const { onClick, role } = state.root;\n\n const [checkedValue, setCheckedValue] = useControllableState({\n state: checked,\n defaultState: defaultChecked,\n initialState: false,\n });\n\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n const onToggleClick = React.useCallback(\n ev => {\n if (!disabled && !disabledFocusable) {\n if (ev.defaultPrevented) {\n return;\n }\n\n setCheckedValue(!checkedValue);\n }\n },\n [checkedValue, disabled, disabledFocusable, setCheckedValue],\n );\n\n return {\n ...state,\n\n checked: checkedValue,\n\n root: {\n ...state.root,\n [isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed']: checkedValue,\n onClick: useMergedEventCallbacks(\n onClick as React.MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>,\n onToggleClick,\n ),\n },\n } as TToggleButtonState;\n}\n"],"sourceRoot":"../src/"}
|