@fluentui/react-button 0.0.0-nightly-20250702-0405.1 → 0.0.0-nightly-20250703-1103.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.md +13 -13
- package/lib/components/Button/useButtonStyles.styles.raw.js +488 -0
- package/lib/components/Button/useButtonStyles.styles.raw.js.map +1 -0
- package/lib/components/CompoundButton/useCompoundButtonStyles.styles.raw.js +241 -0
- package/lib/components/CompoundButton/useCompoundButtonStyles.styles.raw.js.map +1 -0
- package/lib/components/MenuButton/useMenuButtonStyles.styles.raw.js +112 -0
- package/lib/components/MenuButton/useMenuButtonStyles.styles.raw.js.map +1 -0
- package/lib/components/SplitButton/useSplitButtonStyles.styles.raw.js +158 -0
- package/lib/components/SplitButton/useSplitButtonStyles.styles.raw.js.map +1 -0
- package/lib/components/ToggleButton/useToggleButtonStyles.styles.raw.js +226 -0
- package/lib/components/ToggleButton/useToggleButtonStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/Button/useButtonStyles.styles.raw.js +495 -0
- package/lib-commonjs/components/Button/useButtonStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.styles.raw.js +253 -0
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.styles.raw.js +129 -0
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.styles.raw.js +174 -0
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.styles.raw.js +237 -0
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.styles.raw.js.map +1 -0
- package/package.json +10 -10
@@ -0,0 +1,495 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
function _export(target, all) {
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
7
|
+
enumerable: true,
|
8
|
+
get: all[name]
|
9
|
+
});
|
10
|
+
}
|
11
|
+
_export(exports, {
|
12
|
+
buttonClassNames: function() {
|
13
|
+
return buttonClassNames;
|
14
|
+
},
|
15
|
+
useButtonStyles_unstable: function() {
|
16
|
+
return useButtonStyles_unstable;
|
17
|
+
}
|
18
|
+
});
|
19
|
+
const _reacticons = require("@fluentui/react-icons");
|
20
|
+
const _reacttabster = require("@fluentui/react-tabster");
|
21
|
+
const _reacttheme = require("@fluentui/react-theme");
|
22
|
+
const _react = require("@griffel/react");
|
23
|
+
const buttonClassNames = {
|
24
|
+
root: 'fui-Button',
|
25
|
+
icon: 'fui-Button__icon'
|
26
|
+
};
|
27
|
+
const iconSpacingVar = '--fui-Button__icon--spacing';
|
28
|
+
const buttonSpacingSmall = '3px';
|
29
|
+
const buttonSpacingSmallWithIcon = '1px';
|
30
|
+
const buttonSpacingMedium = '5px';
|
31
|
+
const buttonSpacingLarge = '8px';
|
32
|
+
const buttonSpacingLargeWithIcon = '7px';
|
33
|
+
/* Firefox has box shadow sizing issue at some zoom levels
|
34
|
+
* this will ensure the inset boxShadow is always uniform
|
35
|
+
* without affecting other browser platforms
|
36
|
+
*/ const boxShadowStrokeWidthThinMoz = `calc(${_reacttheme.tokens.strokeWidthThin} + 0.25px)`;
|
37
|
+
const useRootBaseClassName = (0, _react.makeResetStyles)({
|
38
|
+
alignItems: 'center',
|
39
|
+
boxSizing: 'border-box',
|
40
|
+
display: 'inline-flex',
|
41
|
+
justifyContent: 'center',
|
42
|
+
textDecorationLine: 'none',
|
43
|
+
verticalAlign: 'middle',
|
44
|
+
margin: 0,
|
45
|
+
overflow: 'hidden',
|
46
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackground1,
|
47
|
+
color: _reacttheme.tokens.colorNeutralForeground1,
|
48
|
+
border: `${_reacttheme.tokens.strokeWidthThin} solid ${_reacttheme.tokens.colorNeutralStroke1}`,
|
49
|
+
fontFamily: _reacttheme.tokens.fontFamilyBase,
|
50
|
+
outlineStyle: 'none',
|
51
|
+
':hover': {
|
52
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackground1Hover,
|
53
|
+
borderColor: _reacttheme.tokens.colorNeutralStroke1Hover,
|
54
|
+
color: _reacttheme.tokens.colorNeutralForeground1Hover,
|
55
|
+
cursor: 'pointer'
|
56
|
+
},
|
57
|
+
':hover:active': {
|
58
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackground1Pressed,
|
59
|
+
borderColor: _reacttheme.tokens.colorNeutralStroke1Pressed,
|
60
|
+
color: _reacttheme.tokens.colorNeutralForeground1Pressed,
|
61
|
+
outlineStyle: 'none'
|
62
|
+
},
|
63
|
+
padding: `${buttonSpacingMedium} ${_reacttheme.tokens.spacingHorizontalM}`,
|
64
|
+
minWidth: '96px',
|
65
|
+
borderRadius: _reacttheme.tokens.borderRadiusMedium,
|
66
|
+
fontSize: _reacttheme.tokens.fontSizeBase300,
|
67
|
+
fontWeight: _reacttheme.tokens.fontWeightSemibold,
|
68
|
+
lineHeight: _reacttheme.tokens.lineHeightBase300,
|
69
|
+
// Transition styles
|
70
|
+
transitionDuration: _reacttheme.tokens.durationFaster,
|
71
|
+
transitionProperty: 'background, border, color',
|
72
|
+
transitionTimingFunction: _reacttheme.tokens.curveEasyEase,
|
73
|
+
'@media screen and (prefers-reduced-motion: reduce)': {
|
74
|
+
transitionDuration: '0.01ms'
|
75
|
+
},
|
76
|
+
// High contrast styles
|
77
|
+
'@media (forced-colors: active)': {
|
78
|
+
':focus': {
|
79
|
+
borderColor: 'ButtonText'
|
80
|
+
},
|
81
|
+
':hover': {
|
82
|
+
backgroundColor: 'HighlightText',
|
83
|
+
borderColor: 'Highlight',
|
84
|
+
color: 'Highlight',
|
85
|
+
forcedColorAdjust: 'none'
|
86
|
+
},
|
87
|
+
':hover:active': {
|
88
|
+
backgroundColor: 'HighlightText',
|
89
|
+
borderColor: 'Highlight',
|
90
|
+
color: 'Highlight',
|
91
|
+
forcedColorAdjust: 'none'
|
92
|
+
}
|
93
|
+
},
|
94
|
+
// Focus styles
|
95
|
+
...(0, _reacttabster.createCustomFocusIndicatorStyle)({
|
96
|
+
borderColor: _reacttheme.tokens.colorStrokeFocus2,
|
97
|
+
borderRadius: _reacttheme.tokens.borderRadiusMedium,
|
98
|
+
borderWidth: '1px',
|
99
|
+
outline: `${_reacttheme.tokens.strokeWidthThick} solid ${_reacttheme.tokens.colorTransparentStroke}`,
|
100
|
+
boxShadow: `0 0 0 ${_reacttheme.tokens.strokeWidthThin} ${_reacttheme.tokens.colorStrokeFocus2}
|
101
|
+
inset
|
102
|
+
`,
|
103
|
+
zIndex: 1
|
104
|
+
}),
|
105
|
+
// BUGFIX: Mozilla specific styles (Mozilla BugID: 1857642)
|
106
|
+
'@supports (-moz-appearance:button)': {
|
107
|
+
...(0, _reacttabster.createCustomFocusIndicatorStyle)({
|
108
|
+
boxShadow: `0 0 0 ${boxShadowStrokeWidthThinMoz} ${_reacttheme.tokens.colorStrokeFocus2}
|
109
|
+
inset
|
110
|
+
`
|
111
|
+
})
|
112
|
+
}
|
113
|
+
});
|
114
|
+
const useIconBaseClassName = (0, _react.makeResetStyles)({
|
115
|
+
alignItems: 'center',
|
116
|
+
display: 'inline-flex',
|
117
|
+
justifyContent: 'center',
|
118
|
+
fontSize: '20px',
|
119
|
+
height: '20px',
|
120
|
+
width: '20px',
|
121
|
+
[iconSpacingVar]: _reacttheme.tokens.spacingHorizontalSNudge
|
122
|
+
});
|
123
|
+
const useRootStyles = (0, _react.makeStyles)({
|
124
|
+
// Appearance variations
|
125
|
+
outline: {
|
126
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
127
|
+
':hover': {
|
128
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackgroundHover
|
129
|
+
},
|
130
|
+
':hover:active': {
|
131
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackgroundPressed
|
132
|
+
}
|
133
|
+
},
|
134
|
+
primary: {
|
135
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackground,
|
136
|
+
..._react.shorthands.borderColor('transparent'),
|
137
|
+
color: _reacttheme.tokens.colorNeutralForegroundOnBrand,
|
138
|
+
':hover': {
|
139
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundHover,
|
140
|
+
..._react.shorthands.borderColor('transparent'),
|
141
|
+
color: _reacttheme.tokens.colorNeutralForegroundOnBrand
|
142
|
+
},
|
143
|
+
':hover:active': {
|
144
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundPressed,
|
145
|
+
..._react.shorthands.borderColor('transparent'),
|
146
|
+
color: _reacttheme.tokens.colorNeutralForegroundOnBrand
|
147
|
+
},
|
148
|
+
'@media (forced-colors: active)': {
|
149
|
+
backgroundColor: 'Highlight',
|
150
|
+
..._react.shorthands.borderColor('HighlightText'),
|
151
|
+
color: 'HighlightText',
|
152
|
+
forcedColorAdjust: 'none',
|
153
|
+
':hover': {
|
154
|
+
backgroundColor: 'HighlightText',
|
155
|
+
..._react.shorthands.borderColor('Highlight'),
|
156
|
+
color: 'Highlight'
|
157
|
+
},
|
158
|
+
':hover:active': {
|
159
|
+
backgroundColor: 'HighlightText',
|
160
|
+
..._react.shorthands.borderColor('Highlight'),
|
161
|
+
color: 'Highlight'
|
162
|
+
}
|
163
|
+
}
|
164
|
+
},
|
165
|
+
secondary: {},
|
166
|
+
subtle: {
|
167
|
+
backgroundColor: _reacttheme.tokens.colorSubtleBackground,
|
168
|
+
..._react.shorthands.borderColor('transparent'),
|
169
|
+
color: _reacttheme.tokens.colorNeutralForeground2,
|
170
|
+
':hover': {
|
171
|
+
backgroundColor: _reacttheme.tokens.colorSubtleBackgroundHover,
|
172
|
+
..._react.shorthands.borderColor('transparent'),
|
173
|
+
color: _reacttheme.tokens.colorNeutralForeground2Hover,
|
174
|
+
[`& .${_reacticons.iconFilledClassName}`]: {
|
175
|
+
display: 'inline'
|
176
|
+
},
|
177
|
+
[`& .${_reacticons.iconRegularClassName}`]: {
|
178
|
+
display: 'none'
|
179
|
+
},
|
180
|
+
[`& .${buttonClassNames.icon}`]: {
|
181
|
+
color: _reacttheme.tokens.colorNeutralForeground2BrandHover
|
182
|
+
}
|
183
|
+
},
|
184
|
+
':hover:active': {
|
185
|
+
backgroundColor: _reacttheme.tokens.colorSubtleBackgroundPressed,
|
186
|
+
..._react.shorthands.borderColor('transparent'),
|
187
|
+
color: _reacttheme.tokens.colorNeutralForeground2Pressed,
|
188
|
+
[`& .${_reacticons.iconFilledClassName}`]: {
|
189
|
+
display: 'inline'
|
190
|
+
},
|
191
|
+
[`& .${_reacticons.iconRegularClassName}`]: {
|
192
|
+
display: 'none'
|
193
|
+
},
|
194
|
+
[`& .${buttonClassNames.icon}`]: {
|
195
|
+
color: _reacttheme.tokens.colorNeutralForeground2BrandPressed
|
196
|
+
}
|
197
|
+
},
|
198
|
+
'@media (forced-colors: active)': {
|
199
|
+
':hover': {
|
200
|
+
color: 'Highlight',
|
201
|
+
[`& .${buttonClassNames.icon}`]: {
|
202
|
+
color: 'Highlight'
|
203
|
+
}
|
204
|
+
},
|
205
|
+
':hover:active': {
|
206
|
+
color: 'Highlight',
|
207
|
+
[`& .${buttonClassNames.icon}`]: {
|
208
|
+
color: 'Highlight'
|
209
|
+
}
|
210
|
+
}
|
211
|
+
}
|
212
|
+
},
|
213
|
+
transparent: {
|
214
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
215
|
+
..._react.shorthands.borderColor('transparent'),
|
216
|
+
color: _reacttheme.tokens.colorNeutralForeground2,
|
217
|
+
':hover': {
|
218
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackgroundHover,
|
219
|
+
..._react.shorthands.borderColor('transparent'),
|
220
|
+
color: _reacttheme.tokens.colorNeutralForeground2BrandHover,
|
221
|
+
[`& .${_reacticons.iconFilledClassName}`]: {
|
222
|
+
display: 'inline'
|
223
|
+
},
|
224
|
+
[`& .${_reacticons.iconRegularClassName}`]: {
|
225
|
+
display: 'none'
|
226
|
+
}
|
227
|
+
},
|
228
|
+
':hover:active': {
|
229
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackgroundPressed,
|
230
|
+
..._react.shorthands.borderColor('transparent'),
|
231
|
+
color: _reacttheme.tokens.colorNeutralForeground2BrandPressed,
|
232
|
+
[`& .${_reacticons.iconFilledClassName}`]: {
|
233
|
+
display: 'inline'
|
234
|
+
},
|
235
|
+
[`& .${_reacticons.iconRegularClassName}`]: {
|
236
|
+
display: 'none'
|
237
|
+
}
|
238
|
+
},
|
239
|
+
'@media (forced-colors: active)': {
|
240
|
+
':hover': {
|
241
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
242
|
+
color: 'Highlight'
|
243
|
+
},
|
244
|
+
':hover:active': {
|
245
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
246
|
+
color: 'Highlight'
|
247
|
+
}
|
248
|
+
}
|
249
|
+
},
|
250
|
+
// Shape variations
|
251
|
+
circular: {
|
252
|
+
borderRadius: _reacttheme.tokens.borderRadiusCircular
|
253
|
+
},
|
254
|
+
rounded: {},
|
255
|
+
square: {
|
256
|
+
borderRadius: _reacttheme.tokens.borderRadiusNone
|
257
|
+
},
|
258
|
+
// Size variations
|
259
|
+
small: {
|
260
|
+
minWidth: '64px',
|
261
|
+
padding: `${buttonSpacingSmall} ${_reacttheme.tokens.spacingHorizontalS}`,
|
262
|
+
borderRadius: _reacttheme.tokens.borderRadiusMedium,
|
263
|
+
fontSize: _reacttheme.tokens.fontSizeBase200,
|
264
|
+
fontWeight: _reacttheme.tokens.fontWeightRegular,
|
265
|
+
lineHeight: _reacttheme.tokens.lineHeightBase200
|
266
|
+
},
|
267
|
+
smallWithIcon: {
|
268
|
+
paddingBottom: buttonSpacingSmallWithIcon,
|
269
|
+
paddingTop: buttonSpacingSmallWithIcon
|
270
|
+
},
|
271
|
+
medium: {},
|
272
|
+
large: {
|
273
|
+
minWidth: '96px',
|
274
|
+
padding: `${buttonSpacingLarge} ${_reacttheme.tokens.spacingHorizontalL}`,
|
275
|
+
borderRadius: _reacttheme.tokens.borderRadiusMedium,
|
276
|
+
fontSize: _reacttheme.tokens.fontSizeBase400,
|
277
|
+
fontWeight: _reacttheme.tokens.fontWeightSemibold,
|
278
|
+
lineHeight: _reacttheme.tokens.lineHeightBase400
|
279
|
+
},
|
280
|
+
largeWithIcon: {
|
281
|
+
paddingBottom: buttonSpacingLargeWithIcon,
|
282
|
+
paddingTop: buttonSpacingLargeWithIcon
|
283
|
+
}
|
284
|
+
});
|
285
|
+
const useRootDisabledStyles = (0, _react.makeStyles)({
|
286
|
+
// Base styles
|
287
|
+
base: {
|
288
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackgroundDisabled,
|
289
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorNeutralStrokeDisabled),
|
290
|
+
color: _reacttheme.tokens.colorNeutralForegroundDisabled,
|
291
|
+
cursor: 'not-allowed',
|
292
|
+
[`& .${buttonClassNames.icon}`]: {
|
293
|
+
color: _reacttheme.tokens.colorNeutralForegroundDisabled
|
294
|
+
},
|
295
|
+
':hover': {
|
296
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackgroundDisabled,
|
297
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorNeutralStrokeDisabled),
|
298
|
+
color: _reacttheme.tokens.colorNeutralForegroundDisabled,
|
299
|
+
cursor: 'not-allowed',
|
300
|
+
[`& .${_reacticons.iconFilledClassName}`]: {
|
301
|
+
display: 'none'
|
302
|
+
},
|
303
|
+
[`& .${_reacticons.iconRegularClassName}`]: {
|
304
|
+
display: 'inline'
|
305
|
+
},
|
306
|
+
[`& .${buttonClassNames.icon}`]: {
|
307
|
+
color: _reacttheme.tokens.colorNeutralForegroundDisabled
|
308
|
+
}
|
309
|
+
},
|
310
|
+
':hover:active': {
|
311
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackgroundDisabled,
|
312
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorNeutralStrokeDisabled),
|
313
|
+
color: _reacttheme.tokens.colorNeutralForegroundDisabled,
|
314
|
+
cursor: 'not-allowed',
|
315
|
+
[`& .${_reacticons.iconFilledClassName}`]: {
|
316
|
+
display: 'none'
|
317
|
+
},
|
318
|
+
[`& .${_reacticons.iconRegularClassName}`]: {
|
319
|
+
display: 'inline'
|
320
|
+
},
|
321
|
+
[`& .${buttonClassNames.icon}`]: {
|
322
|
+
color: _reacttheme.tokens.colorNeutralForegroundDisabled
|
323
|
+
}
|
324
|
+
}
|
325
|
+
},
|
326
|
+
// High contrast styles
|
327
|
+
highContrast: {
|
328
|
+
'@media (forced-colors: active)': {
|
329
|
+
backgroundColor: 'ButtonFace',
|
330
|
+
..._react.shorthands.borderColor('GrayText'),
|
331
|
+
color: 'GrayText',
|
332
|
+
[`& .${buttonClassNames.icon}`]: {
|
333
|
+
color: 'GrayText'
|
334
|
+
},
|
335
|
+
':focus': {
|
336
|
+
..._react.shorthands.borderColor('GrayText')
|
337
|
+
},
|
338
|
+
':hover': {
|
339
|
+
backgroundColor: 'ButtonFace',
|
340
|
+
..._react.shorthands.borderColor('GrayText'),
|
341
|
+
color: 'GrayText',
|
342
|
+
[`& .${buttonClassNames.icon}`]: {
|
343
|
+
color: 'GrayText'
|
344
|
+
}
|
345
|
+
},
|
346
|
+
':hover:active': {
|
347
|
+
backgroundColor: 'ButtonFace',
|
348
|
+
..._react.shorthands.borderColor('GrayText'),
|
349
|
+
color: 'GrayText',
|
350
|
+
[`& .${buttonClassNames.icon}`]: {
|
351
|
+
color: 'GrayText'
|
352
|
+
}
|
353
|
+
}
|
354
|
+
}
|
355
|
+
},
|
356
|
+
// Appearance variations
|
357
|
+
outline: {
|
358
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
359
|
+
':hover': {
|
360
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground
|
361
|
+
},
|
362
|
+
':hover:active': {
|
363
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground
|
364
|
+
}
|
365
|
+
},
|
366
|
+
primary: {
|
367
|
+
..._react.shorthands.borderColor('transparent'),
|
368
|
+
':hover': {
|
369
|
+
..._react.shorthands.borderColor('transparent')
|
370
|
+
},
|
371
|
+
':hover:active': {
|
372
|
+
..._react.shorthands.borderColor('transparent')
|
373
|
+
}
|
374
|
+
},
|
375
|
+
secondary: {},
|
376
|
+
subtle: {
|
377
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
378
|
+
..._react.shorthands.borderColor('transparent'),
|
379
|
+
':hover': {
|
380
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
381
|
+
..._react.shorthands.borderColor('transparent')
|
382
|
+
},
|
383
|
+
':hover:active': {
|
384
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
385
|
+
..._react.shorthands.borderColor('transparent')
|
386
|
+
}
|
387
|
+
},
|
388
|
+
transparent: {
|
389
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
390
|
+
..._react.shorthands.borderColor('transparent'),
|
391
|
+
':hover': {
|
392
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
393
|
+
..._react.shorthands.borderColor('transparent')
|
394
|
+
},
|
395
|
+
':hover:active': {
|
396
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
397
|
+
..._react.shorthands.borderColor('transparent')
|
398
|
+
}
|
399
|
+
}
|
400
|
+
});
|
401
|
+
const useRootFocusStyles = (0, _react.makeStyles)({
|
402
|
+
// Shape variations
|
403
|
+
circular: (0, _reacttabster.createCustomFocusIndicatorStyle)({
|
404
|
+
borderRadius: _reacttheme.tokens.borderRadiusCircular
|
405
|
+
}),
|
406
|
+
rounded: {},
|
407
|
+
square: (0, _reacttabster.createCustomFocusIndicatorStyle)({
|
408
|
+
borderRadius: _reacttheme.tokens.borderRadiusNone
|
409
|
+
}),
|
410
|
+
// Primary styles
|
411
|
+
primary: {
|
412
|
+
...(0, _reacttabster.createCustomFocusIndicatorStyle)({
|
413
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorStrokeFocus2),
|
414
|
+
boxShadow: `${_reacttheme.tokens.shadow2}, 0 0 0 ${_reacttheme.tokens.strokeWidthThin} ${_reacttheme.tokens.colorStrokeFocus2} inset, 0 0 0 ${_reacttheme.tokens.strokeWidthThick} ${_reacttheme.tokens.colorNeutralForegroundOnBrand} inset`,
|
415
|
+
':hover': {
|
416
|
+
boxShadow: `${_reacttheme.tokens.shadow2}, 0 0 0 ${_reacttheme.tokens.strokeWidthThin} ${_reacttheme.tokens.colorStrokeFocus2} inset`,
|
417
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorStrokeFocus2)
|
418
|
+
}
|
419
|
+
}),
|
420
|
+
// BUGFIX: Mozilla specific styles (Mozilla BugID: 1857642)
|
421
|
+
'@supports (-moz-appearance:button)': {
|
422
|
+
...(0, _reacttabster.createCustomFocusIndicatorStyle)({
|
423
|
+
boxShadow: `${_reacttheme.tokens.shadow2}, 0 0 0 ${boxShadowStrokeWidthThinMoz} ${_reacttheme.tokens.colorStrokeFocus2} inset, 0 0 0 ${_reacttheme.tokens.strokeWidthThick} ${_reacttheme.tokens.colorNeutralForegroundOnBrand} inset`,
|
424
|
+
':hover': {
|
425
|
+
boxShadow: `${_reacttheme.tokens.shadow2}, 0 0 0 ${boxShadowStrokeWidthThinMoz} ${_reacttheme.tokens.colorStrokeFocus2} inset`
|
426
|
+
}
|
427
|
+
})
|
428
|
+
}
|
429
|
+
},
|
430
|
+
// Size variations
|
431
|
+
small: (0, _reacttabster.createCustomFocusIndicatorStyle)({
|
432
|
+
borderRadius: _reacttheme.tokens.borderRadiusSmall
|
433
|
+
}),
|
434
|
+
medium: {},
|
435
|
+
large: (0, _reacttabster.createCustomFocusIndicatorStyle)({
|
436
|
+
borderRadius: _reacttheme.tokens.borderRadiusLarge
|
437
|
+
})
|
438
|
+
});
|
439
|
+
const useRootIconOnlyStyles = (0, _react.makeStyles)({
|
440
|
+
// Size variations
|
441
|
+
small: {
|
442
|
+
padding: buttonSpacingSmallWithIcon,
|
443
|
+
minWidth: '24px',
|
444
|
+
maxWidth: '24px'
|
445
|
+
},
|
446
|
+
medium: {
|
447
|
+
padding: buttonSpacingMedium,
|
448
|
+
minWidth: '32px',
|
449
|
+
maxWidth: '32px'
|
450
|
+
},
|
451
|
+
large: {
|
452
|
+
padding: buttonSpacingLargeWithIcon,
|
453
|
+
minWidth: '40px',
|
454
|
+
maxWidth: '40px'
|
455
|
+
}
|
456
|
+
});
|
457
|
+
const useIconStyles = (0, _react.makeStyles)({
|
458
|
+
// Size variations
|
459
|
+
small: {
|
460
|
+
fontSize: '20px',
|
461
|
+
height: '20px',
|
462
|
+
width: '20px',
|
463
|
+
[iconSpacingVar]: _reacttheme.tokens.spacingHorizontalXS
|
464
|
+
},
|
465
|
+
medium: {},
|
466
|
+
large: {
|
467
|
+
fontSize: '24px',
|
468
|
+
height: '24px',
|
469
|
+
width: '24px',
|
470
|
+
[iconSpacingVar]: _reacttheme.tokens.spacingHorizontalSNudge
|
471
|
+
},
|
472
|
+
// Icon position variations
|
473
|
+
before: {
|
474
|
+
marginRight: `var(${iconSpacingVar})`
|
475
|
+
},
|
476
|
+
after: {
|
477
|
+
marginLeft: `var(${iconSpacingVar})`
|
478
|
+
}
|
479
|
+
});
|
480
|
+
const useButtonStyles_unstable = (state)=>{
|
481
|
+
'use no memo';
|
482
|
+
const rootBaseClassName = useRootBaseClassName();
|
483
|
+
const iconBaseClassName = useIconBaseClassName();
|
484
|
+
const rootStyles = useRootStyles();
|
485
|
+
const rootDisabledStyles = useRootDisabledStyles();
|
486
|
+
const rootFocusStyles = useRootFocusStyles();
|
487
|
+
const rootIconOnlyStyles = useRootIconOnlyStyles();
|
488
|
+
const iconStyles = useIconStyles();
|
489
|
+
const { appearance, disabled, disabledFocusable, icon, iconOnly, iconPosition, shape, size } = state;
|
490
|
+
state.root.className = (0, _react.mergeClasses)(buttonClassNames.root, rootBaseClassName, appearance && rootStyles[appearance], rootStyles[size], icon && size === 'small' && rootStyles.smallWithIcon, icon && size === 'large' && rootStyles.largeWithIcon, rootStyles[shape], (disabled || disabledFocusable) && rootDisabledStyles.base, (disabled || disabledFocusable) && rootDisabledStyles.highContrast, appearance && (disabled || disabledFocusable) && rootDisabledStyles[appearance], appearance === 'primary' && rootFocusStyles.primary, rootFocusStyles[size], rootFocusStyles[shape], iconOnly && rootIconOnlyStyles[size], state.root.className);
|
491
|
+
if (state.icon) {
|
492
|
+
state.icon.className = (0, _react.mergeClasses)(buttonClassNames.icon, iconBaseClassName, !!state.root.children && iconStyles[iconPosition], iconStyles[size], state.icon.className);
|
493
|
+
}
|
494
|
+
return state;
|
495
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/useButtonStyles.styles.ts"],"sourcesContent":["import { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { shorthands, makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ButtonSlots, ButtonState } from './Button.types';\n\nexport const buttonClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fui-Button',\n icon: 'fui-Button__icon',\n};\n\nconst iconSpacingVar = '--fui-Button__icon--spacing';\n\nconst buttonSpacingSmall = '3px';\nconst buttonSpacingSmallWithIcon = '1px';\nconst buttonSpacingMedium = '5px';\nconst buttonSpacingLarge = '8px';\nconst buttonSpacingLargeWithIcon = '7px';\n\n/* Firefox has box shadow sizing issue at some zoom levels\n * this will ensure the inset boxShadow is always uniform\n * without affecting other browser platforms\n */\nconst boxShadowStrokeWidthThinMoz = `calc(${tokens.strokeWidthThin} + 0.25px)`;\n\nconst useRootBaseClassName = makeResetStyles({\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'inline-flex',\n justifyContent: 'center',\n textDecorationLine: 'none',\n verticalAlign: 'middle',\n\n margin: 0,\n overflow: 'hidden',\n\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n\n fontFamily: tokens.fontFamilyBase,\n outlineStyle: 'none',\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n borderColor: tokens.colorNeutralStroke1Hover,\n color: tokens.colorNeutralForeground1Hover,\n\n cursor: 'pointer',\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n borderColor: tokens.colorNeutralStroke1Pressed,\n color: tokens.colorNeutralForeground1Pressed,\n\n outlineStyle: 'none',\n },\n\n padding: `${buttonSpacingMedium} ${tokens.spacingHorizontalM}`,\n minWidth: '96px',\n borderRadius: tokens.borderRadiusMedium,\n\n fontSize: tokens.fontSizeBase300,\n fontWeight: tokens.fontWeightSemibold,\n lineHeight: tokens.lineHeightBase300,\n\n // Transition styles\n\n transitionDuration: tokens.durationFaster,\n transitionProperty: 'background, border, color',\n transitionTimingFunction: tokens.curveEasyEase,\n\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n },\n\n // High contrast styles\n\n '@media (forced-colors: active)': {\n ':focus': {\n borderColor: 'ButtonText',\n },\n\n ':hover': {\n backgroundColor: 'HighlightText',\n borderColor: 'Highlight',\n color: 'Highlight',\n forcedColorAdjust: 'none',\n },\n\n ':hover:active': {\n backgroundColor: 'HighlightText',\n borderColor: 'Highlight',\n color: 'Highlight',\n forcedColorAdjust: 'none',\n },\n },\n\n // Focus styles\n\n ...createCustomFocusIndicatorStyle({\n borderColor: tokens.colorStrokeFocus2,\n borderRadius: tokens.borderRadiusMedium,\n borderWidth: '1px',\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorTransparentStroke}`,\n boxShadow: `0 0 0 ${tokens.strokeWidthThin} ${tokens.colorStrokeFocus2}\n inset\n `,\n zIndex: 1,\n }),\n\n // BUGFIX: Mozilla specific styles (Mozilla BugID: 1857642)\n '@supports (-moz-appearance:button)': {\n ...createCustomFocusIndicatorStyle({\n boxShadow: `0 0 0 ${boxShadowStrokeWidthThinMoz} ${tokens.colorStrokeFocus2}\n inset\n `,\n }),\n },\n});\n\nconst useIconBaseClassName = makeResetStyles({\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n\n fontSize: '20px',\n height: '20px',\n width: '20px',\n\n [iconSpacingVar]: tokens.spacingHorizontalSNudge,\n});\n\nconst useRootStyles = makeStyles({\n // Appearance variations\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n },\n },\n primary: {\n backgroundColor: tokens.colorBrandBackground,\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 '@media (forced-colors: active)': {\n backgroundColor: 'Highlight',\n ...shorthands.borderColor('HighlightText'),\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 },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2,\n\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Hover,\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n [`& .${buttonClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2BrandHover,\n },\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Pressed,\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n [`& .${buttonClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n\n '@media (forced-colors: active)': {\n ':hover': {\n color: 'Highlight',\n\n [`& .${buttonClassNames.icon}`]: {\n color: 'Highlight',\n },\n },\n ':hover:active': {\n color: 'Highlight',\n\n [`& .${buttonClassNames.icon}`]: {\n color: 'Highlight',\n },\n },\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandHover,\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandPressed,\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n },\n\n '@media (forced-colors: active)': {\n ':hover': {\n backgroundColor: tokens.colorTransparentBackground,\n color: 'Highlight',\n },\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackground,\n color: 'Highlight',\n },\n },\n },\n\n // Shape variations\n circular: { borderRadius: tokens.borderRadiusCircular },\n rounded: {\n /* The borderRadius rounded styles are handled in the size variations */\n },\n square: { borderRadius: tokens.borderRadiusNone },\n\n // Size variations\n small: {\n minWidth: '64px',\n padding: `${buttonSpacingSmall} ${tokens.spacingHorizontalS}`,\n borderRadius: tokens.borderRadiusMedium,\n\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n },\n smallWithIcon: {\n paddingBottom: buttonSpacingSmallWithIcon,\n paddingTop: buttonSpacingSmallWithIcon,\n },\n medium: {\n /* defined in base styles */\n },\n large: {\n minWidth: '96px',\n padding: `${buttonSpacingLarge} ${tokens.spacingHorizontalL}`,\n borderRadius: tokens.borderRadiusMedium,\n\n fontSize: tokens.fontSizeBase400,\n fontWeight: tokens.fontWeightSemibold,\n lineHeight: tokens.lineHeightBase400,\n },\n largeWithIcon: {\n paddingBottom: buttonSpacingLargeWithIcon,\n paddingTop: buttonSpacingLargeWithIcon,\n },\n});\n\nconst useRootDisabledStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n cursor: 'not-allowed',\n [`& .${buttonClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n cursor: 'not-allowed',\n\n [`& .${iconFilledClassName}`]: {\n display: 'none',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'inline',\n },\n [`& .${buttonClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n cursor: 'not-allowed',\n\n [`& .${iconFilledClassName}`]: {\n display: 'none',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'inline',\n },\n [`& .${buttonClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n },\n\n // High contrast styles\n highContrast: {\n '@media (forced-colors: active)': {\n backgroundColor: 'ButtonFace',\n ...shorthands.borderColor('GrayText'),\n color: 'GrayText',\n\n [`& .${buttonClassNames.icon}`]: {\n color: 'GrayText',\n },\n\n ':focus': {\n ...shorthands.borderColor('GrayText'),\n },\n\n ':hover': {\n backgroundColor: 'ButtonFace',\n ...shorthands.borderColor('GrayText'),\n color: 'GrayText',\n\n [`& .${buttonClassNames.icon}`]: {\n color: 'GrayText',\n },\n },\n\n ':hover:active': {\n backgroundColor: 'ButtonFace',\n ...shorthands.borderColor('GrayText'),\n color: 'GrayText',\n\n [`& .${buttonClassNames.icon}`]: {\n color: 'GrayText',\n },\n },\n },\n },\n\n // Appearance variations\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackground,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackground,\n },\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: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n },\n },\n});\n\nconst useRootFocusStyles = makeStyles({\n // Shape variations\n circular: createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusCircular }),\n rounded: {\n /* The rounded styles are exactly the same as the base styles. */\n },\n square: createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusNone }),\n\n // Primary styles\n primary: {\n ...createCustomFocusIndicatorStyle({\n ...shorthands.borderColor(tokens.colorStrokeFocus2),\n boxShadow: `${tokens.shadow2}, 0 0 0 ${tokens.strokeWidthThin} ${tokens.colorStrokeFocus2} inset, 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorNeutralForegroundOnBrand} inset`,\n ':hover': {\n boxShadow: `${tokens.shadow2}, 0 0 0 ${tokens.strokeWidthThin} ${tokens.colorStrokeFocus2} inset`,\n ...shorthands.borderColor(tokens.colorStrokeFocus2),\n },\n }),\n\n // BUGFIX: Mozilla specific styles (Mozilla BugID: 1857642)\n '@supports (-moz-appearance:button)': {\n ...createCustomFocusIndicatorStyle({\n boxShadow: `${tokens.shadow2}, 0 0 0 ${boxShadowStrokeWidthThinMoz} ${tokens.colorStrokeFocus2} inset, 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorNeutralForegroundOnBrand} inset`,\n ':hover': {\n boxShadow: `${tokens.shadow2}, 0 0 0 ${boxShadowStrokeWidthThinMoz} ${tokens.colorStrokeFocus2} inset`,\n },\n }),\n },\n },\n\n // Size variations\n small: createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusSmall }),\n medium: {\n /* defined in base styles */\n },\n large: createCustomFocusIndicatorStyle({ borderRadius: tokens.borderRadiusLarge }),\n});\n\nconst useRootIconOnlyStyles = makeStyles({\n // Size variations\n small: {\n padding: buttonSpacingSmallWithIcon,\n\n minWidth: '24px',\n maxWidth: '24px',\n },\n medium: {\n padding: buttonSpacingMedium,\n\n minWidth: '32px',\n maxWidth: '32px',\n },\n large: {\n padding: buttonSpacingLargeWithIcon,\n\n minWidth: '40px',\n maxWidth: '40px',\n },\n});\n\nconst useIconStyles = makeStyles({\n // Size variations\n small: {\n fontSize: '20px',\n height: '20px',\n width: '20px',\n\n [iconSpacingVar]: tokens.spacingHorizontalXS,\n },\n medium: {\n /* defined in base styles */\n },\n large: {\n fontSize: '24px',\n height: '24px',\n width: '24px',\n\n [iconSpacingVar]: tokens.spacingHorizontalSNudge,\n },\n\n // Icon position variations\n before: {\n marginRight: `var(${iconSpacingVar})`,\n },\n after: {\n marginLeft: `var(${iconSpacingVar})`,\n },\n});\n\nexport const useButtonStyles_unstable = (state: ButtonState): ButtonState => {\n 'use no memo';\n\n const rootBaseClassName = useRootBaseClassName();\n const iconBaseClassName = useIconBaseClassName();\n\n const rootStyles = useRootStyles();\n const rootDisabledStyles = useRootDisabledStyles();\n const rootFocusStyles = useRootFocusStyles();\n const rootIconOnlyStyles = useRootIconOnlyStyles();\n const iconStyles = useIconStyles();\n\n const { appearance, disabled, disabledFocusable, icon, iconOnly, iconPosition, shape, size } = state;\n\n state.root.className = mergeClasses(\n buttonClassNames.root,\n rootBaseClassName,\n\n appearance && rootStyles[appearance],\n\n rootStyles[size],\n icon && size === 'small' && rootStyles.smallWithIcon,\n icon && size === 'large' && rootStyles.largeWithIcon,\n rootStyles[shape],\n\n // Disabled styles\n (disabled || disabledFocusable) && rootDisabledStyles.base,\n (disabled || disabledFocusable) && rootDisabledStyles.highContrast,\n appearance && (disabled || disabledFocusable) && rootDisabledStyles[appearance],\n\n // Focus styles\n appearance === 'primary' && rootFocusStyles.primary,\n rootFocusStyles[size],\n rootFocusStyles[shape],\n\n // Icon-only styles\n iconOnly && rootIconOnlyStyles[size],\n\n // User provided class name\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n buttonClassNames.icon,\n iconBaseClassName,\n !!state.root.children && iconStyles[iconPosition],\n iconStyles[size],\n state.icon.className,\n );\n }\n\n return state;\n};\n"],"names":["buttonClassNames","useButtonStyles_unstable","root","icon","iconSpacingVar","buttonSpacingSmall","buttonSpacingSmallWithIcon","buttonSpacingMedium","buttonSpacingLarge","buttonSpacingLargeWithIcon","boxShadowStrokeWidthThinMoz","tokens","strokeWidthThin","useRootBaseClassName","makeResetStyles","alignItems","boxSizing","display","justifyContent","textDecorationLine","verticalAlign","margin","overflow","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","border","colorNeutralStroke1","fontFamily","fontFamilyBase","outlineStyle","colorNeutralBackground1Hover","borderColor","colorNeutralStroke1Hover","colorNeutralForeground1Hover","cursor","colorNeutralBackground1Pressed","colorNeutralStroke1Pressed","colorNeutralForeground1Pressed","padding","spacingHorizontalM","minWidth","borderRadius","borderRadiusMedium","fontSize","fontSizeBase300","fontWeight","fontWeightSemibold","lineHeight","lineHeightBase300","transitionDuration","durationFaster","transitionProperty","transitionTimingFunction","curveEasyEase","forcedColorAdjust","createCustomFocusIndicatorStyle","colorStrokeFocus2","borderWidth","outline","strokeWidthThick","colorTransparentStroke","boxShadow","zIndex","useIconBaseClassName","height","width","spacingHorizontalSNudge","useRootStyles","makeStyles","colorTransparentBackground","colorTransparentBackgroundHover","colorTransparentBackgroundPressed","primary","colorBrandBackground","shorthands","colorNeutralForegroundOnBrand","colorBrandBackgroundHover","colorBrandBackgroundPressed","secondary","subtle","colorSubtleBackground","colorNeutralForeground2","colorSubtleBackgroundHover","colorNeutralForeground2Hover","iconFilledClassName","iconRegularClassName","colorNeutralForeground2BrandHover","colorSubtleBackgroundPressed","colorNeutralForeground2Pressed","colorNeutralForeground2BrandPressed","transparent","circular","borderRadiusCircular","rounded","square","borderRadiusNone","small","spacingHorizontalS","fontSizeBase200","fontWeightRegular","lineHeightBase200","smallWithIcon","paddingBottom","paddingTop","medium","large","spacingHorizontalL","fontSizeBase400","lineHeightBase400","largeWithIcon","useRootDisabledStyles","base","colorNeutralBackgroundDisabled","colorNeutralStrokeDisabled","colorNeutralForegroundDisabled","highContrast","useRootFocusStyles","shadow2","borderRadiusSmall","borderRadiusLarge","useRootIconOnlyStyles","maxWidth","useIconStyles","spacingHorizontalXS","before","marginRight","after","marginLeft","state","rootBaseClassName","iconBaseClassName","rootStyles","rootDisabledStyles","rootFocusStyles","rootIconOnlyStyles","iconStyles","appearance","disabled","disabledFocusable","iconOnly","iconPosition","shape","size","className","mergeClasses","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|