@fluentui/react-tag-picker 0.0.0-nightly-20240823-1802.1 → 0.0.0-nightly-20240826-0407.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 +51 -22
- package/lib/components/TagPickerButton/useTagPickerButtonStyles.styles.js +26 -26
- package/lib/components/TagPickerButton/useTagPickerButtonStyles.styles.js.map +1 -1
- package/lib/components/TagPickerControl/useTagPickerControlStyles.styles.js +40 -40
- package/lib/components/TagPickerControl/useTagPickerControlStyles.styles.js.map +1 -1
- package/lib/components/TagPickerGroup/useTagPickerGroup.js +2 -0
- package/lib/components/TagPickerGroup/useTagPickerGroup.js.map +1 -1
- package/lib/components/TagPickerGroup/useTagPickerGroupStyles.styles.js +6 -6
- package/lib/components/TagPickerGroup/useTagPickerGroupStyles.styles.js.map +1 -1
- package/lib/components/TagPickerInput/useTagPickerInput.js +1 -1
- package/lib/components/TagPickerInput/useTagPickerInput.js.map +1 -1
- package/lib/components/TagPickerInput/useTagPickerInputStyles.styles.js +5 -5
- package/lib/components/TagPickerInput/useTagPickerInputStyles.styles.js.map +1 -1
- package/lib/components/TagPickerList/useTagPickerListStyles.styles.js +2 -2
- package/lib/components/TagPickerList/useTagPickerListStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TagPickerButton/useTagPickerButtonStyles.styles.js +28 -33
- package/lib-commonjs/components/TagPickerButton/useTagPickerButtonStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TagPickerControl/useTagPickerControlStyles.styles.js +61 -68
- package/lib-commonjs/components/TagPickerControl/useTagPickerControlStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TagPickerGroup/useTagPickerGroup.js +2 -0
- package/lib-commonjs/components/TagPickerGroup/useTagPickerGroup.js.map +1 -1
- package/lib-commonjs/components/TagPickerGroup/useTagPickerGroupStyles.styles.js +6 -6
- package/lib-commonjs/components/TagPickerGroup/useTagPickerGroupStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TagPickerInput/useTagPickerInput.js +1 -1
- package/lib-commonjs/components/TagPickerInput/useTagPickerInput.js.map +1 -1
- package/lib-commonjs/components/TagPickerInput/useTagPickerInputStyles.styles.js +14 -14
- package/lib-commonjs/components/TagPickerInput/useTagPickerInputStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TagPickerList/useTagPickerListStyles.styles.js +2 -2
- package/lib-commonjs/components/TagPickerList/useTagPickerListStyles.styles.js.map +1 -1
- package/package.json +19 -19
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTagPickerButtonStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const tagPickerButtonClassNames = {\n root: 'fui-TagPickerButton'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n button: {\n alignItems: 'center',\n minHeight: '32px',\n backgroundColor:
|
|
1
|
+
{"version":3,"sources":["useTagPickerButtonStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const tagPickerButtonClassNames = {\n root: 'fui-TagPickerButton'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n button: {\n alignItems: 'center',\n minHeight: '32px',\n backgroundColor: tokens.colorTransparentBackground,\n border: 'none',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground1,\n columnGap: tokens.spacingHorizontalXXS,\n cursor: 'pointer',\n fontFamily: tokens.fontFamilyBase,\n textAlign: 'left',\n flexGrow: 1,\n '&:focus': {\n outlineStyle: 'none'\n }\n },\n placeholder: {\n color: tokens.colorNeutralForeground4\n },\n // size variants\n medium: {\n ...typographyStyles.caption1,\n padding: `3px ${tokens.spacingHorizontalSNudge} 3px ${`calc(${tokens.spacingHorizontalSNudge} + ${tokens.spacingHorizontalXXS})`}`\n },\n large: {\n ...typographyStyles.body1,\n padding: `5px ${tokens.spacingHorizontalMNudge} 5px ${`calc(${tokens.spacingHorizontalMNudge} + ${tokens.spacingHorizontalXXS})`}`\n },\n 'extra-large': {\n columnGap: tokens.spacingHorizontalSNudge,\n ...typographyStyles.body2,\n padding: `7px ${tokens.spacingHorizontalM} 7px ${`calc(${tokens.spacingHorizontalM} + ${tokens.spacingHorizontalSNudge})`}`\n },\n // appearance variants\n outline: {\n backgroundColor: tokens.colorNeutralBackground1,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n borderBottomColor: tokens.colorNeutralStrokeAccessible\n },\n outlineInteractive: {\n '&:hover': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n borderBottomColor: tokens.colorNeutralStrokeAccessible\n },\n '&:active': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n borderBottomColor: tokens.colorNeutralStrokeAccessible\n }\n },\n underline: {\n backgroundColor: tokens.colorTransparentBackground,\n borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n borderRadius: '0'\n },\n 'filled-lighter': {\n backgroundColor: tokens.colorNeutralBackground1,\n border: `${tokens.strokeWidthThin} solid transparent`\n },\n 'filled-darker': {\n backgroundColor: tokens.colorNeutralBackground3,\n border: `${tokens.strokeWidthThin} solid transparent`\n },\n invalid: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n }\n },\n invalidUnderline: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n borderBottomColor: tokens.colorPaletteRedBorder2\n }\n },\n disabled: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText')\n }\n },\n disabledText: {\n color: tokens.colorNeutralForegroundDisabled,\n cursor: 'not-allowed'\n },\n hidden: {\n display: 'none'\n },\n visuallyHidden: {\n clip: 'rect(0px, 0px, 0px, 0px)',\n height: '1px',\n margin: '-1px',\n overflow: 'hidden',\n padding: '0px',\n width: '1px',\n position: 'absolute'\n }\n});\n/**\n * Apply styling to the PickerButton slots based on the state\n */ export const useTagPickerButtonStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(tagPickerButtonClassNames.root, styles.button, styles[state.size], state.hasSelectedOption && styles.visuallyHidden, state.root.className);\n return state;\n};\n"],"names":["tagPickerButtonClassNames","useTagPickerButtonStyles_unstable","root","useStyles","__styles","button","Bt984gj","sshi5w","De3pzq","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","B7ck84d","sj55zd","i8kkvl","Bceei9c","Bahqtrf","fsow6f","Bh6795r","Brovlpu","placeholder","medium","Be2twd7","Bhrd7zp","Bg96gwp","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","large","outline","outlineInteractive","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","B6oc9vd","ak43y8","wmxk5l","B50zh58","underline","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","invalid","tvckwq","gk2u95","hhx65j","Bxowmz0","invalidUnderline","disabled","Bjwas2f","Bn1d65q","Bxeuatn","n51gp8","disabledText","hidden","mc9l5x","visuallyHidden","Bh84pgu","Bqenvij","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","B68tc82","Bmxbyg5","Bpg54ce","a9b677","qhf8xq","d","p","f","h","a","m","state","styles","className","mergeClasses","size","hasSelectedOption"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -38,17 +38,17 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
38
38
|
Bbmb7ep: 0,
|
|
39
39
|
Btl43ni: 0,
|
|
40
40
|
B7oj6ja: 0,
|
|
41
|
-
Dimara: "
|
|
41
|
+
Dimara: "ft85np5",
|
|
42
42
|
z189sj: [
|
|
43
43
|
"f1d8q41i",
|
|
44
44
|
"f8lqu5g"
|
|
45
45
|
],
|
|
46
46
|
uwmqm3: [
|
|
47
|
-
"
|
|
48
|
-
"
|
|
47
|
+
"f1uw59to",
|
|
48
|
+
"fw5db7e"
|
|
49
49
|
],
|
|
50
50
|
Bt984gj: "f122n59",
|
|
51
|
-
i8kkvl: "
|
|
51
|
+
i8kkvl: "f14mj54c",
|
|
52
52
|
B7ck84d: "f1ewtqcl",
|
|
53
53
|
mc9l5x: "f22iagw",
|
|
54
54
|
Bf4jedk: "f1exfvgq",
|
|
@@ -71,12 +71,12 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
71
71
|
],
|
|
72
72
|
Dlnsje: "f145g4dw",
|
|
73
73
|
d9w3h3: [
|
|
74
|
-
"
|
|
75
|
-
"
|
|
74
|
+
"f1kp91vd",
|
|
75
|
+
"f1ibwz09"
|
|
76
76
|
],
|
|
77
77
|
B3778ie: [
|
|
78
|
-
"
|
|
79
|
-
"
|
|
78
|
+
"f1ibwz09",
|
|
79
|
+
"f1kp91vd"
|
|
80
80
|
],
|
|
81
81
|
B1q35kw: 0,
|
|
82
82
|
Bw17bha: 0,
|
|
@@ -85,17 +85,17 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
85
85
|
Gjdm7m: "f13evtba",
|
|
86
86
|
b1kco5: "f1yk9hq",
|
|
87
87
|
Ba2ppi3: "fhwpy7i",
|
|
88
|
-
F2fol1: "
|
|
89
|
-
lck23g: "
|
|
88
|
+
F2fol1: "f14ee0xe",
|
|
89
|
+
lck23g: "f1xhbsuh",
|
|
90
90
|
df92cz: "fv8e3ye",
|
|
91
91
|
I188md: "ftb5wc6",
|
|
92
92
|
umuwi5: "fjw5xc1",
|
|
93
93
|
Blcqepd: "f1xdyd5c",
|
|
94
|
-
nplu4u: "
|
|
95
|
-
Bioka5o: "
|
|
94
|
+
nplu4u: "fatpbeo",
|
|
95
|
+
Bioka5o: "fb7uyps",
|
|
96
96
|
H713fs: "f1cmft4k",
|
|
97
97
|
B9ooomg: "f1x58t8o",
|
|
98
|
-
Bercvud: "
|
|
98
|
+
Bercvud: "f1ibeo51"
|
|
99
99
|
},
|
|
100
100
|
listbox: {
|
|
101
101
|
E5pizo: "f1hg901r",
|
|
@@ -103,7 +103,7 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
103
103
|
Bbmb7ep: 0,
|
|
104
104
|
Btl43ni: 0,
|
|
105
105
|
B7oj6ja: 0,
|
|
106
|
-
Dimara: "
|
|
106
|
+
Dimara: "ft85np5",
|
|
107
107
|
Bxyxcbc: "fmmk62d",
|
|
108
108
|
B7ck84d: "f1ewtqcl"
|
|
109
109
|
},
|
|
@@ -120,9 +120,9 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
120
120
|
sshi5w: "f5pgtk9"
|
|
121
121
|
},
|
|
122
122
|
outline: {
|
|
123
|
-
De3pzq: "
|
|
123
|
+
De3pzq: "fxugw4r",
|
|
124
124
|
Bgfg5da: 0,
|
|
125
|
-
B9xav0g: "
|
|
125
|
+
B9xav0g: "f1c1zstj",
|
|
126
126
|
oivjwe: 0,
|
|
127
127
|
Bn0qgzm: 0,
|
|
128
128
|
B4g9neb: 0,
|
|
@@ -145,7 +145,7 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
145
145
|
"f1ub3y4t",
|
|
146
146
|
"f1m52nbi"
|
|
147
147
|
],
|
|
148
|
-
oetu4i: "
|
|
148
|
+
oetu4i: "flmw63s",
|
|
149
149
|
gg5e9n: [
|
|
150
150
|
"f1m52nbi",
|
|
151
151
|
"f1ub3y4t"
|
|
@@ -155,14 +155,14 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
155
155
|
"f1assf6x",
|
|
156
156
|
"f4ruux4"
|
|
157
157
|
],
|
|
158
|
-
wmxk5l: "
|
|
158
|
+
wmxk5l: "fqhmt4z",
|
|
159
159
|
B50zh58: [
|
|
160
160
|
"f4ruux4",
|
|
161
161
|
"f1assf6x"
|
|
162
162
|
]
|
|
163
163
|
},
|
|
164
164
|
underline: {
|
|
165
|
-
De3pzq: "
|
|
165
|
+
De3pzq: "f1c21dwh",
|
|
166
166
|
B9xav0g: 0,
|
|
167
167
|
oivjwe: 0,
|
|
168
168
|
Bn0qgzm: 0,
|
|
@@ -174,7 +174,7 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
174
174
|
Dimara: "fokr779"
|
|
175
175
|
},
|
|
176
176
|
"filled-lighter": {
|
|
177
|
-
De3pzq: "
|
|
177
|
+
De3pzq: "fxugw4r",
|
|
178
178
|
Bgfg5da: 0,
|
|
179
179
|
B9xav0g: 0,
|
|
180
180
|
oivjwe: 0,
|
|
@@ -194,7 +194,7 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
194
194
|
irswps: "f88035w"
|
|
195
195
|
},
|
|
196
196
|
"filled-darker": {
|
|
197
|
-
De3pzq: "
|
|
197
|
+
De3pzq: "f16xq7d1",
|
|
198
198
|
Bgfg5da: 0,
|
|
199
199
|
B9xav0g: 0,
|
|
200
200
|
oivjwe: 0,
|
|
@@ -226,11 +226,11 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
226
226
|
]
|
|
227
227
|
},
|
|
228
228
|
invalidUnderline: {
|
|
229
|
-
hhx65j: "
|
|
229
|
+
hhx65j: "f1fgmyf4"
|
|
230
230
|
},
|
|
231
231
|
disabled: {
|
|
232
232
|
Bceei9c: "fdrzuqr",
|
|
233
|
-
De3pzq: "
|
|
233
|
+
De3pzq: "f1c21dwh",
|
|
234
234
|
g2u3we: "f1jj8ep1",
|
|
235
235
|
h3c5rm: [
|
|
236
236
|
"f15xbau",
|
|
@@ -255,17 +255,17 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
255
255
|
}, {
|
|
256
256
|
d: [
|
|
257
257
|
[
|
|
258
|
-
".
|
|
258
|
+
".ft85np5{border-radius:var(--borderRadiusMedium);}",
|
|
259
259
|
{
|
|
260
260
|
p: -1
|
|
261
261
|
}
|
|
262
262
|
],
|
|
263
263
|
".f1d8q41i{padding-right:calc(var(--spacingHorizontalM) + var(--fui-TagPickerControl-aside-width, 0px));}",
|
|
264
264
|
".f8lqu5g{padding-left:calc(var(--spacingHorizontalM) + var(--fui-TagPickerControl-aside-width, 0px));}",
|
|
265
|
-
".
|
|
266
|
-
".
|
|
265
|
+
".f1uw59to{padding-left:var(--spacingHorizontalM);}",
|
|
266
|
+
".fw5db7e{padding-right:var(--spacingHorizontalM);}",
|
|
267
267
|
".f122n59{align-items:center;}",
|
|
268
|
-
".
|
|
268
|
+
".f14mj54c{column-gap:var(--spacingHorizontalXXS);}",
|
|
269
269
|
".f1ewtqcl{box-sizing:border-box;}",
|
|
270
270
|
".f22iagw{display:flex;}",
|
|
271
271
|
".f1exfvgq{min-width:250px;}",
|
|
@@ -278,10 +278,8 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
278
278
|
".f1cjjd47::after{right:-1px;}",
|
|
279
279
|
".f1gboi2j::after{bottom:-1px;}",
|
|
280
280
|
".f145g4dw::after{height:max(2px, var(--borderRadiusMedium));}",
|
|
281
|
-
".
|
|
282
|
-
".
|
|
283
|
-
".f16vujjb::after{border-bottom-right-radius:var(--2221, var(--2222, var(--borderRadiusMedium)));}",
|
|
284
|
-
".f16bc2xy::after{border-bottom-left-radius:var(--2221, var(--2222, var(--borderRadiusMedium)));}",
|
|
281
|
+
".f1kp91vd::after{border-bottom-left-radius:var(--borderRadiusMedium);}",
|
|
282
|
+
".f1ibwz09::after{border-bottom-right-radius:var(--borderRadiusMedium);}",
|
|
285
283
|
[
|
|
286
284
|
".f1mnjydx::after{border-bottom:var(--strokeWidthThick) solid var(--colorCompoundBrandStroke);}",
|
|
287
285
|
{
|
|
@@ -291,11 +289,11 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
291
289
|
".f13evtba::after{clip-path:inset(calc(100% - 2px) 0 0 0);}",
|
|
292
290
|
".f1yk9hq::after{transform:scaleX(0);}",
|
|
293
291
|
".fhwpy7i::after{transition-property:transform;}",
|
|
294
|
-
".
|
|
295
|
-
".
|
|
292
|
+
".f14ee0xe::after{transition-duration:var(--durationUltraFast);}",
|
|
293
|
+
".f1xhbsuh::after{transition-delay:var(--curveAccelerateMid);}",
|
|
296
294
|
".f1hg901r{box-shadow:var(--shadow16);}",
|
|
297
295
|
[
|
|
298
|
-
".
|
|
296
|
+
".ft85np5{border-radius:var(--borderRadiusMedium);}",
|
|
299
297
|
{
|
|
300
298
|
p: -1
|
|
301
299
|
}
|
|
@@ -305,15 +303,15 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
305
303
|
".f1nxs5xn{min-height:32px;}",
|
|
306
304
|
".f1w5jphr{min-height:40px;}",
|
|
307
305
|
".f5pgtk9{min-height:44px;}",
|
|
308
|
-
".
|
|
306
|
+
".fxugw4r{background-color:var(--colorNeutralBackground1);}",
|
|
309
307
|
[
|
|
310
308
|
".fhz96rm{border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);}",
|
|
311
309
|
{
|
|
312
310
|
p: -2
|
|
313
311
|
}
|
|
314
312
|
],
|
|
315
|
-
".
|
|
316
|
-
".
|
|
313
|
+
".f1c1zstj{border-bottom-color:var(--colorNeutralStrokeAccessible);}",
|
|
314
|
+
".f1c21dwh{background-color:var(--colorTransparentBackground);}",
|
|
317
315
|
[
|
|
318
316
|
".f9ez7ne{border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStrokeAccessible);}",
|
|
319
317
|
{
|
|
@@ -326,14 +324,13 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
326
324
|
p: -1
|
|
327
325
|
}
|
|
328
326
|
],
|
|
329
|
-
".f1t525bv{background-color:var(--2245, var(--2246, var(--colorNeutralBackground1)));}",
|
|
330
327
|
[
|
|
331
328
|
".f88035w{border:var(--strokeWidthThin) solid var(--colorTransparentStroke);}",
|
|
332
329
|
{
|
|
333
330
|
p: -2
|
|
334
331
|
}
|
|
335
332
|
],
|
|
336
|
-
".
|
|
333
|
+
".f16xq7d1{background-color:var(--colorNeutralBackground3);}",
|
|
337
334
|
[
|
|
338
335
|
".f88035w{border:var(--strokeWidthThin) solid var(--colorTransparentStroke);}",
|
|
339
336
|
{
|
|
@@ -344,9 +341,7 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
344
341
|
".fcee079:not(:focus-within),.fcee079:hover:not(:focus-within){border-right-color:var(--colorPaletteRedBorder2);}",
|
|
345
342
|
".fmyw78r:not(:focus-within),.fmyw78r:hover:not(:focus-within){border-left-color:var(--colorPaletteRedBorder2);}",
|
|
346
343
|
".f1fgmyf4:not(:focus-within),.f1fgmyf4:hover:not(:focus-within){border-bottom-color:var(--colorPaletteRedBorder2);}",
|
|
347
|
-
".fd8qj9j:not(:focus-within),.fd8qj9j:hover:not(:focus-within){border-bottom-color:var(--2249, var(--2250, var(--colorPaletteRedBorder2)));}",
|
|
348
344
|
".fdrzuqr{cursor:not-allowed;}",
|
|
349
|
-
".f4pjzkx{background-color:var(--2251, var(--2252, var(--colorTransparentBackground)));}",
|
|
350
345
|
".f1jj8ep1{border-top-color:var(--colorNeutralStrokeDisabled);}",
|
|
351
346
|
".f15xbau{border-right-color:var(--colorNeutralStrokeDisabled);}",
|
|
352
347
|
".fy0fskl{border-left-color:var(--colorNeutralStrokeDisabled);}",
|
|
@@ -358,9 +353,9 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
358
353
|
".fhljsf7:focus-within{outline-color:transparent;}",
|
|
359
354
|
".fjw5xc1:focus-within::after{transform:scaleX(1);}",
|
|
360
355
|
".f1xdyd5c:focus-within::after{transition-property:transform;}",
|
|
361
|
-
".
|
|
362
|
-
".
|
|
363
|
-
".
|
|
356
|
+
".fatpbeo:focus-within::after{transition-duration:var(--durationNormal);}",
|
|
357
|
+
".fb7uyps:focus-within::after{transition-delay:var(--curveDecelerateMid);}",
|
|
358
|
+
".f1ibeo51:focus-within:active::after{border-bottom-color:var(--colorCompoundBrandStrokePressed);}"
|
|
364
359
|
],
|
|
365
360
|
m: [
|
|
366
361
|
[
|
|
@@ -410,13 +405,13 @@ const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';
|
|
|
410
405
|
".fvcxoqz:hover{border-top-color:var(--colorNeutralStroke1Hover);}",
|
|
411
406
|
".f1ub3y4t:hover{border-right-color:var(--colorNeutralStroke1Hover);}",
|
|
412
407
|
".f1m52nbi:hover{border-left-color:var(--colorNeutralStroke1Hover);}",
|
|
413
|
-
".
|
|
408
|
+
".flmw63s:hover{border-bottom-color:var(--colorNeutralStrokeAccessible);}"
|
|
414
409
|
],
|
|
415
410
|
a: [
|
|
416
411
|
".fvs00aa:active{border-top-color:var(--colorNeutralStroke1Pressed);}",
|
|
417
412
|
".f1assf6x:active{border-right-color:var(--colorNeutralStroke1Pressed);}",
|
|
418
413
|
".f4ruux4:active{border-left-color:var(--colorNeutralStroke1Pressed);}",
|
|
419
|
-
".
|
|
414
|
+
".fqhmt4z:active{border-bottom-color:var(--colorNeutralStrokeAccessible);}"
|
|
420
415
|
]
|
|
421
416
|
});
|
|
422
417
|
const useAsideStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
@@ -426,8 +421,8 @@ const useAsideStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
|
426
421
|
qhf8xq: "f1euv43f",
|
|
427
422
|
Bhzewxz: "f15twtuk",
|
|
428
423
|
j35jbq: [
|
|
429
|
-
"
|
|
430
|
-
"
|
|
424
|
+
"f8b87gs",
|
|
425
|
+
"fedtrts"
|
|
431
426
|
],
|
|
432
427
|
Budl1dq: "f13p5kfd",
|
|
433
428
|
wkccdc: "fjg31ve",
|
|
@@ -449,8 +444,8 @@ const useAsideStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
|
449
444
|
".f122n59{align-items:center;}",
|
|
450
445
|
".f1euv43f{position:absolute;}",
|
|
451
446
|
".f15twtuk{top:0;}",
|
|
452
|
-
".
|
|
453
|
-
".
|
|
447
|
+
".f8b87gs{right:var(--spacingHorizontalM);}",
|
|
448
|
+
".fedtrts{left:var(--spacingHorizontalM);}",
|
|
454
449
|
".f13p5kfd{grid-template-columns:repeat(2, auto);}",
|
|
455
450
|
".fjg31ve{grid-template-rows:minmax(32px, auto) 1fr;}",
|
|
456
451
|
".f1l02sjl{height:100%;}",
|
|
@@ -468,55 +463,53 @@ const iconSizes = {
|
|
|
468
463
|
const useIconStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
469
464
|
icon: {
|
|
470
465
|
B7ck84d: "f1ewtqcl",
|
|
471
|
-
sj55zd: "
|
|
466
|
+
sj55zd: "fxkbij4",
|
|
472
467
|
Bceei9c: "f1k6fduh",
|
|
473
468
|
mc9l5x: "ftgm304",
|
|
474
|
-
Be2twd7: "
|
|
469
|
+
Be2twd7: "f1pp30po",
|
|
475
470
|
Bo70h7d: "fvc9v3g"
|
|
476
471
|
},
|
|
477
472
|
medium: {
|
|
478
473
|
Be2twd7: "f4ybsrx",
|
|
479
474
|
Frg6f3: [
|
|
480
|
-
"
|
|
481
|
-
"
|
|
475
|
+
"f1h9en5y",
|
|
476
|
+
"f1xk557c"
|
|
482
477
|
]
|
|
483
478
|
},
|
|
484
479
|
large: {
|
|
485
480
|
Be2twd7: "fe5j1ua",
|
|
486
481
|
Frg6f3: [
|
|
487
|
-
"
|
|
488
|
-
"
|
|
482
|
+
"f1h9en5y",
|
|
483
|
+
"f1xk557c"
|
|
489
484
|
]
|
|
490
485
|
},
|
|
491
486
|
"extra-large": {
|
|
492
487
|
Be2twd7: "f1rt2boy",
|
|
493
488
|
Frg6f3: [
|
|
494
|
-
"
|
|
495
|
-
"
|
|
489
|
+
"f1t5qyk5",
|
|
490
|
+
"f1ikr372"
|
|
496
491
|
]
|
|
497
492
|
},
|
|
498
493
|
disabled: {
|
|
499
|
-
sj55zd: "
|
|
494
|
+
sj55zd: "f1s2aq7o",
|
|
500
495
|
Bceei9c: "fdrzuqr"
|
|
501
496
|
}
|
|
502
497
|
}, {
|
|
503
498
|
d: [
|
|
504
499
|
".f1ewtqcl{box-sizing:border-box;}",
|
|
505
|
-
".
|
|
500
|
+
".fxkbij4{color:var(--colorNeutralStrokeAccessible);}",
|
|
506
501
|
".f1k6fduh{cursor:pointer;}",
|
|
507
502
|
".ftgm304{display:block;}",
|
|
508
|
-
".
|
|
503
|
+
".f1pp30po{font-size:var(--fontSizeBase500);}",
|
|
509
504
|
".fvc9v3g svg{display:block;}",
|
|
510
505
|
".f4ybsrx{font-size:16px;}",
|
|
511
|
-
".
|
|
512
|
-
".
|
|
506
|
+
".f1h9en5y{margin-left:var(--spacingHorizontalXXS);}",
|
|
507
|
+
".f1xk557c{margin-right:var(--spacingHorizontalXXS);}",
|
|
513
508
|
".fe5j1ua{font-size:20px;}",
|
|
514
|
-
".fztc325{margin-left:var(--2261, var(--2262, var(--spacingHorizontalXXS)));}",
|
|
515
|
-
".f15v1zk3{margin-right:var(--2261, var(--2262, var(--spacingHorizontalXXS)));}",
|
|
516
509
|
".f1rt2boy{font-size:24px;}",
|
|
517
|
-
".
|
|
518
|
-
".
|
|
519
|
-
".
|
|
510
|
+
".f1t5qyk5{margin-left:var(--spacingHorizontalSNudge);}",
|
|
511
|
+
".f1ikr372{margin-right:var(--spacingHorizontalSNudge);}",
|
|
512
|
+
".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}",
|
|
520
513
|
".fdrzuqr{cursor:not-allowed;}"
|
|
521
514
|
]
|
|
522
515
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTagPickerControlStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const tagPickerControlClassNames = {\n root: 'fui-TagPickerControl',\n expandIcon: 'fui-TagPickerControl__expandIcon',\n secondaryAction: 'fui-TagPickerControl__secondaryAction',\n aside: 'fui-TagPickerControl__aside'\n};\nexport const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n borderRadius: `var(--2213, var(--2214, ${tokens.borderRadiusMedium}))`,\n paddingRight: `calc(${tokens.spacingHorizontalM} + var(${tagPickerControlAsideWidthToken}, 0px))`,\n paddingLeft: `var(--2215, var(--2216, ${tokens.spacingHorizontalM}))`,\n alignItems: 'center',\n columnGap: `var(--2217, var(--2218, ${tokens.spacingHorizontalXXS}))`,\n boxSizing: 'border-box',\n display: 'flex',\n minWidth: '250px',\n position: 'relative',\n flexWrap: 'wrap',\n // windows high contrast mode focus indicator\n ':focus-within': {\n outlineWidth: '2px',\n outlineStyle: 'solid',\n outlineColor: 'transparent'\n },\n // bottom focus border, shared with Input, Select, and SpinButton\n '::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n left: '-1px',\n bottom: '-1px',\n right: '-1px',\n height: `max(2px, ${tokens.borderRadiusMedium})`,\n borderBottomLeftRadius: `var(--2219, var(--2220, ${tokens.borderRadiusMedium}))`,\n borderBottomRightRadius: `var(--2221, var(--2222, ${tokens.borderRadiusMedium}))`,\n borderBottom: `${tokens.strokeWidthThick} solid ${tokens.colorCompoundBrandStroke}`,\n clipPath: 'inset(calc(100% - 2px) 0 0 0)',\n transform: 'scaleX(0)',\n transitionProperty: 'transform',\n transitionDuration: `var(--2223, var(--2224, ${tokens.durationUltraFast}))`,\n transitionDelay: `var(--2225, var(--2226, ${tokens.curveAccelerateMid}))`,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\n }\n },\n ':focus-within::after': {\n transform: 'scaleX(1)',\n transitionProperty: 'transform',\n transitionDuration: `var(--2227, var(--2228, ${tokens.durationNormal}))`,\n transitionDelay: `var(--2229, var(--2230, ${tokens.curveDecelerateMid}))`,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\n }\n },\n ':focus-within:active::after': {\n borderBottomColor: `var(--2231, var(--2232, ${tokens.colorCompoundBrandStrokePressed}))`\n }\n },\n listbox: {\n boxShadow: `${tokens.shadow16}`,\n borderRadius: `var(--2233, var(--2234, ${tokens.borderRadiusMedium}))`,\n maxHeight: '80vh',\n boxSizing: 'border-box'\n },\n listboxCollapsed: {\n display: 'none'\n },\n // size variants\n medium: {\n minHeight: '32px'\n },\n large: {\n minHeight: '40px'\n },\n 'extra-large': {\n minHeight: '44px'\n },\n // appearance variants\n outline: {\n backgroundColor: `var(--2235, var(--2236, ${tokens.colorNeutralBackground1}))`,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n borderBottomColor: `var(--2237, var(--2238, ${tokens.colorNeutralStrokeAccessible}))`\n },\n outlineInteractive: {\n '&:hover': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n borderBottomColor: `var(--2239, var(--2240, ${tokens.colorNeutralStrokeAccessible}))`\n },\n '&:active': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n borderBottomColor: `var(--2241, var(--2242, ${tokens.colorNeutralStrokeAccessible}))`\n }\n },\n underline: {\n backgroundColor: `var(--2243, var(--2244, ${tokens.colorTransparentBackground}))`,\n borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n borderRadius: '0'\n },\n 'filled-lighter': {\n backgroundColor: `var(--2245, var(--2246, ${tokens.colorNeutralBackground1}))`,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`\n },\n 'filled-darker': {\n backgroundColor: `var(--2247, var(--2248, ${tokens.colorNeutralBackground3}))`,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`\n },\n invalid: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n }\n },\n invalidUnderline: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n borderBottomColor: `var(--2249, var(--2250, ${tokens.colorPaletteRedBorder2}))`\n }\n },\n disabled: {\n cursor: 'not-allowed',\n backgroundColor: `var(--2251, var(--2252, ${tokens.colorTransparentBackground}))`,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText')\n }\n }\n});\nconst useAsideStyles = makeStyles({\n root: {\n display: 'grid',\n alignItems: 'center',\n position: 'absolute',\n top: '0',\n right: `var(--2253, var(--2254, ${tokens.spacingHorizontalM}))`,\n gridTemplateColumns: 'repeat(2, auto)',\n gridTemplateRows: 'minmax(32px, auto) 1fr',\n height: '100%',\n cursor: 'text'\n },\n // size variants\n medium: {\n minHeight: '32px'\n },\n large: {\n minHeight: '40px'\n },\n 'extra-large': {\n minHeight: '44px'\n }\n});\nexport const iconSizes = {\n small: '16px',\n medium: '20px',\n large: '24px'\n};\nconst useIconStyles = makeStyles({\n icon: {\n boxSizing: 'border-box',\n color: `var(--2255, var(--2256, ${tokens.colorNeutralStrokeAccessible}))`,\n cursor: 'pointer',\n display: 'block',\n fontSize: `var(--2257, var(--2258, ${tokens.fontSizeBase500}))`,\n // the SVG must have display: block for accurate positioning\n // otherwise an extra inline space is inserted after the svg element\n '& svg': {\n display: 'block'\n }\n },\n // icon size variants\n medium: {\n fontSize: iconSizes.small,\n marginLeft: `var(--2259, var(--2260, ${tokens.spacingHorizontalXXS}))`\n },\n large: {\n fontSize: iconSizes.medium,\n marginLeft: `var(--2261, var(--2262, ${tokens.spacingHorizontalXXS}))`\n },\n 'extra-large': {\n fontSize: iconSizes.large,\n marginLeft: `var(--2263, var(--2264, ${tokens.spacingHorizontalSNudge}))`\n },\n disabled: {\n color: `var(--2265, var(--2266, ${tokens.colorNeutralForegroundDisabled}))`,\n cursor: 'not-allowed'\n }\n});\n/**\n * Apply styling to the PickerControl slots based on the state\n */ export const useTagPickerControlStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const iconStyles = useIconStyles();\n const asideStyles = useAsideStyles();\n state.root.className = mergeClasses(tagPickerControlClassNames.root, styles.root, styles[state.size], styles[state.appearance], !state.disabled && state.appearance === 'outline' && styles.outlineInteractive, state.invalid && state.appearance !== 'underline' && styles.invalid, state.invalid && state.appearance === 'underline' && styles.invalidUnderline, state.disabled && styles.disabled, state.root.className);\n if (state.aside) {\n state.aside.className = mergeClasses(tagPickerControlClassNames.aside, asideStyles.root, asideStyles[state.size], state.aside.className);\n }\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(tagPickerControlClassNames.expandIcon, iconStyles.icon, iconStyles[state.size], state.disabled && iconStyles.disabled, state.expandIcon.className);\n }\n if (state.secondaryAction) {\n state.secondaryAction.className = mergeClasses(tagPickerControlClassNames.secondaryAction, state.secondaryAction.className);\n }\n return state;\n};\n"],"names":["iconSizes","tagPickerControlAsideWidthToken","tagPickerControlClassNames","useTagPickerControlStyles_unstable","root","expandIcon","secondaryAction","aside","useStyles","__styles","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","z189sj","uwmqm3","Bt984gj","i8kkvl","B7ck84d","mc9l5x","Bf4jedk","qhf8xq","Eh141a","Bbr2w1p","Bduesf4","Bpq79vn","li1rpt","Bsft5z2","E3zdtr","Eqx8gd","By385i5","B1piin3","Dlnsje","d9w3h3","B3778ie","B1q35kw","Bw17bha","Bcgy8vk","Bjuhk93","Gjdm7m","b1kco5","Ba2ppi3","F2fol1","lck23g","df92cz","I188md","umuwi5","Blcqepd","nplu4u","Bioka5o","H713fs","B9ooomg","Bercvud","listbox","E5pizo","Bxyxcbc","listboxCollapsed","medium","sshi5w","large","outline","De3pzq","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","outlineInteractive","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","B6oc9vd","ak43y8","wmxk5l","B50zh58","underline","invalid","tvckwq","gk2u95","hhx65j","Bxowmz0","invalidUnderline","disabled","Bceei9c","Bjwas2f","Bn1d65q","Bxeuatn","n51gp8","d","p","w","m","h","a","useAsideStyles","Bhzewxz","j35jbq","Budl1dq","wkccdc","Bqenvij","small","useIconStyles","icon","sj55zd","Be2twd7","Bo70h7d","Frg6f3","state","styles","iconStyles","asideStyles","className","mergeClasses","size","appearance"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["useTagPickerControlStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const tagPickerControlClassNames = {\n root: 'fui-TagPickerControl',\n expandIcon: 'fui-TagPickerControl__expandIcon',\n secondaryAction: 'fui-TagPickerControl__secondaryAction',\n aside: 'fui-TagPickerControl__aside'\n};\nexport const tagPickerControlAsideWidthToken = '--fui-TagPickerControl-aside-width';\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n borderRadius: tokens.borderRadiusMedium,\n paddingRight: `calc(${tokens.spacingHorizontalM} + var(${tagPickerControlAsideWidthToken}, 0px))`,\n paddingLeft: tokens.spacingHorizontalM,\n alignItems: 'center',\n columnGap: tokens.spacingHorizontalXXS,\n boxSizing: 'border-box',\n display: 'flex',\n minWidth: '250px',\n position: 'relative',\n flexWrap: 'wrap',\n // windows high contrast mode focus indicator\n ':focus-within': {\n outlineWidth: '2px',\n outlineStyle: 'solid',\n outlineColor: 'transparent'\n },\n // bottom focus border, shared with Input, Select, and SpinButton\n '::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n left: '-1px',\n bottom: '-1px',\n right: '-1px',\n height: `max(2px, ${tokens.borderRadiusMedium})`,\n borderBottomLeftRadius: tokens.borderRadiusMedium,\n borderBottomRightRadius: tokens.borderRadiusMedium,\n borderBottom: `${tokens.strokeWidthThick} solid ${tokens.colorCompoundBrandStroke}`,\n clipPath: 'inset(calc(100% - 2px) 0 0 0)',\n transform: 'scaleX(0)',\n transitionProperty: 'transform',\n transitionDuration: tokens.durationUltraFast,\n transitionDelay: tokens.curveAccelerateMid,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\n }\n },\n ':focus-within::after': {\n transform: 'scaleX(1)',\n transitionProperty: 'transform',\n transitionDuration: tokens.durationNormal,\n transitionDelay: tokens.curveDecelerateMid,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\n }\n },\n ':focus-within:active::after': {\n borderBottomColor: tokens.colorCompoundBrandStrokePressed\n }\n },\n listbox: {\n boxShadow: `${tokens.shadow16}`,\n borderRadius: tokens.borderRadiusMedium,\n maxHeight: '80vh',\n boxSizing: 'border-box'\n },\n listboxCollapsed: {\n display: 'none'\n },\n // size variants\n medium: {\n minHeight: '32px'\n },\n large: {\n minHeight: '40px'\n },\n 'extra-large': {\n minHeight: '44px'\n },\n // appearance variants\n outline: {\n backgroundColor: tokens.colorNeutralBackground1,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n borderBottomColor: tokens.colorNeutralStrokeAccessible\n },\n outlineInteractive: {\n '&:hover': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n borderBottomColor: tokens.colorNeutralStrokeAccessible\n },\n '&:active': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n borderBottomColor: tokens.colorNeutralStrokeAccessible\n }\n },\n underline: {\n backgroundColor: tokens.colorTransparentBackground,\n borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n borderRadius: '0'\n },\n 'filled-lighter': {\n backgroundColor: tokens.colorNeutralBackground1,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`\n },\n 'filled-darker': {\n backgroundColor: tokens.colorNeutralBackground3,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`\n },\n invalid: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n }\n },\n invalidUnderline: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n borderBottomColor: tokens.colorPaletteRedBorder2\n }\n },\n disabled: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText')\n }\n }\n});\nconst useAsideStyles = makeStyles({\n root: {\n display: 'grid',\n alignItems: 'center',\n position: 'absolute',\n top: '0',\n right: tokens.spacingHorizontalM,\n gridTemplateColumns: 'repeat(2, auto)',\n gridTemplateRows: 'minmax(32px, auto) 1fr',\n height: '100%',\n cursor: 'text'\n },\n // size variants\n medium: {\n minHeight: '32px'\n },\n large: {\n minHeight: '40px'\n },\n 'extra-large': {\n minHeight: '44px'\n }\n});\nexport const iconSizes = {\n small: '16px',\n medium: '20px',\n large: '24px'\n};\nconst useIconStyles = makeStyles({\n icon: {\n boxSizing: 'border-box',\n color: tokens.colorNeutralStrokeAccessible,\n cursor: 'pointer',\n display: 'block',\n fontSize: tokens.fontSizeBase500,\n // the SVG must have display: block for accurate positioning\n // otherwise an extra inline space is inserted after the svg element\n '& svg': {\n display: 'block'\n }\n },\n // icon size variants\n medium: {\n fontSize: iconSizes.small,\n marginLeft: tokens.spacingHorizontalXXS\n },\n large: {\n fontSize: iconSizes.medium,\n marginLeft: tokens.spacingHorizontalXXS\n },\n 'extra-large': {\n fontSize: iconSizes.large,\n marginLeft: tokens.spacingHorizontalSNudge\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n cursor: 'not-allowed'\n }\n});\n/**\n * Apply styling to the PickerControl slots based on the state\n */ export const useTagPickerControlStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const iconStyles = useIconStyles();\n const asideStyles = useAsideStyles();\n state.root.className = mergeClasses(tagPickerControlClassNames.root, styles.root, styles[state.size], styles[state.appearance], !state.disabled && state.appearance === 'outline' && styles.outlineInteractive, state.invalid && state.appearance !== 'underline' && styles.invalid, state.invalid && state.appearance === 'underline' && styles.invalidUnderline, state.disabled && styles.disabled, state.root.className);\n if (state.aside) {\n state.aside.className = mergeClasses(tagPickerControlClassNames.aside, asideStyles.root, asideStyles[state.size], state.aside.className);\n }\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(tagPickerControlClassNames.expandIcon, iconStyles.icon, iconStyles[state.size], state.disabled && iconStyles.disabled, state.expandIcon.className);\n }\n if (state.secondaryAction) {\n state.secondaryAction.className = mergeClasses(tagPickerControlClassNames.secondaryAction, state.secondaryAction.className);\n }\n return state;\n};\n"],"names":["iconSizes","tagPickerControlAsideWidthToken","tagPickerControlClassNames","useTagPickerControlStyles_unstable","root","expandIcon","secondaryAction","aside","useStyles","__styles","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","z189sj","uwmqm3","Bt984gj","i8kkvl","B7ck84d","mc9l5x","Bf4jedk","qhf8xq","Eh141a","Bbr2w1p","Bduesf4","Bpq79vn","li1rpt","Bsft5z2","E3zdtr","Eqx8gd","By385i5","B1piin3","Dlnsje","d9w3h3","B3778ie","B1q35kw","Bw17bha","Bcgy8vk","Bjuhk93","Gjdm7m","b1kco5","Ba2ppi3","F2fol1","lck23g","df92cz","I188md","umuwi5","Blcqepd","nplu4u","Bioka5o","H713fs","B9ooomg","Bercvud","listbox","E5pizo","Bxyxcbc","listboxCollapsed","medium","sshi5w","large","outline","De3pzq","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","outlineInteractive","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","B6oc9vd","ak43y8","wmxk5l","B50zh58","underline","invalid","tvckwq","gk2u95","hhx65j","Bxowmz0","invalidUnderline","disabled","Bceei9c","Bjwas2f","Bn1d65q","Bxeuatn","n51gp8","d","p","w","m","h","a","useAsideStyles","Bhzewxz","j35jbq","Budl1dq","wkccdc","Bqenvij","small","useIconStyles","icon","sj55zd","Be2twd7","Bo70h7d","Frg6f3","state","styles","iconStyles","asideStyles","className","mergeClasses","size","appearance"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -24,6 +24,7 @@ const useTagPickerGroup_unstable = (props, ref)=>{
|
|
|
24
24
|
const selectOption = (0, _TagPickerContext.useTagPickerContext_unstable)((ctx)=>ctx.selectOption);
|
|
25
25
|
const size = (0, _TagPickerContext.useTagPickerContext_unstable)((ctx)=>(0, _tagPicker2Tag.tagPickerSizeToTagSize)(ctx.size));
|
|
26
26
|
const appearance = (0, _TagPickerContext.useTagPickerContext_unstable)((ctx)=>ctx.appearance);
|
|
27
|
+
const disabled = (0, _TagPickerContext.useTagPickerContext_unstable)((ctx)=>ctx.disabled);
|
|
27
28
|
const arrowNavigationProps = (0, _reacttabster.useArrowNavigationGroup)({
|
|
28
29
|
circular: false,
|
|
29
30
|
axis: 'both',
|
|
@@ -31,6 +32,7 @@ const useTagPickerGroup_unstable = (props, ref)=>{
|
|
|
31
32
|
});
|
|
32
33
|
const state = (0, _reacttags.useTagGroup_unstable)({
|
|
33
34
|
role: 'listbox',
|
|
35
|
+
disabled,
|
|
34
36
|
...props,
|
|
35
37
|
...arrowNavigationProps,
|
|
36
38
|
size,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTagPickerGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport type { TagPickerGroupProps, TagPickerGroupState } from './TagPickerGroup.types';\nimport { useTagGroup_unstable } from '@fluentui/react-tags';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { isHTMLElement, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { tagPickerAppearanceToTagAppearance, tagPickerSizeToTagSize } from '../../utils/tagPicker2Tag';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { ArrowRight } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render TagPickerGroup.\n *\n * The returned state can be modified with hooks such as usePickerTagGroupStyles_unstable,\n * before being passed to renderPickerTagGroup_unstable.\n *\n * @param props - props from this instance of TagPickerGroup\n * @param ref - reference to root HTMLDivElement of TagPickerGroup\n */\nexport const useTagPickerGroup_unstable = (\n props: TagPickerGroupProps,\n ref: React.Ref<HTMLDivElement>,\n): TagPickerGroupState => {\n const hasSelectedOptions = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length > 0);\n const hasOneSelectedOption = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length === 1);\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef);\n const tagPickerGroupRef = useTagPickerContext_unstable(ctx => ctx.tagPickerGroupRef);\n const selectOption = useTagPickerContext_unstable(ctx => ctx.selectOption);\n const size = useTagPickerContext_unstable(ctx => tagPickerSizeToTagSize(ctx.size));\n const appearance = useTagPickerContext_unstable(ctx => ctx.appearance);\n\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: false,\n axis: 'both',\n memorizeCurrent: true,\n });\n\n const state = useTagGroup_unstable(\n {\n role: 'listbox',\n ...props,\n ...arrowNavigationProps,\n size,\n appearance: tagPickerAppearanceToTagAppearance(appearance),\n dismissible: true,\n onKeyDown: useEventCallback(event => {\n props.onKeyDown?.(event);\n if (isHTMLElement(event.target) && event.key === ArrowRight) {\n triggerRef.current?.focus();\n }\n }),\n onDismiss: useEventCallback((event, data) => {\n selectOption(event as React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>, {\n value: data.value,\n // These values no longer exist because the option has unregistered itself\n // for the purposes of selection - these values aren't actually used\n id: 'ERROR_DO_NOT_USE',\n text: 'ERROR_DO_NOT_USE',\n });\n if (hasOneSelectedOption && !event.isDefaultPrevented()) {\n triggerRef.current?.focus();\n }\n }),\n },\n useMergedRefs(ref, tagPickerGroupRef),\n );\n\n return {\n ...state,\n hasSelectedOptions,\n };\n};\n"],"names":["useTagPickerGroup_unstable","props","ref","hasSelectedOptions","useTagPickerContext_unstable","ctx","selectedOptions","length","hasOneSelectedOption","triggerRef","tagPickerGroupRef","selectOption","size","tagPickerSizeToTagSize","appearance","arrowNavigationProps","useArrowNavigationGroup","circular","axis","memorizeCurrent","state","useTagGroup_unstable","role","tagPickerAppearanceToTagAppearance","dismissible","onKeyDown","useEventCallback","event","isHTMLElement","target","key","ArrowRight","current","focus","onDismiss","data","value","id","text","isDefaultPrevented","useMergedRefs"],"rangeMappings":"
|
|
1
|
+
{"version":3,"sources":["useTagPickerGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport type { TagPickerGroupProps, TagPickerGroupState } from './TagPickerGroup.types';\nimport { useTagGroup_unstable } from '@fluentui/react-tags';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { isHTMLElement, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { tagPickerAppearanceToTagAppearance, tagPickerSizeToTagSize } from '../../utils/tagPicker2Tag';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { ArrowRight } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render TagPickerGroup.\n *\n * The returned state can be modified with hooks such as usePickerTagGroupStyles_unstable,\n * before being passed to renderPickerTagGroup_unstable.\n *\n * @param props - props from this instance of TagPickerGroup\n * @param ref - reference to root HTMLDivElement of TagPickerGroup\n */\nexport const useTagPickerGroup_unstable = (\n props: TagPickerGroupProps,\n ref: React.Ref<HTMLDivElement>,\n): TagPickerGroupState => {\n const hasSelectedOptions = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length > 0);\n const hasOneSelectedOption = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length === 1);\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef);\n const tagPickerGroupRef = useTagPickerContext_unstable(ctx => ctx.tagPickerGroupRef);\n const selectOption = useTagPickerContext_unstable(ctx => ctx.selectOption);\n const size = useTagPickerContext_unstable(ctx => tagPickerSizeToTagSize(ctx.size));\n const appearance = useTagPickerContext_unstable(ctx => ctx.appearance);\n const disabled = useTagPickerContext_unstable(ctx => ctx.disabled);\n\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: false,\n axis: 'both',\n memorizeCurrent: true,\n });\n\n const state = useTagGroup_unstable(\n {\n role: 'listbox',\n disabled,\n ...props,\n ...arrowNavigationProps,\n size,\n appearance: tagPickerAppearanceToTagAppearance(appearance),\n dismissible: true,\n onKeyDown: useEventCallback(event => {\n props.onKeyDown?.(event);\n if (isHTMLElement(event.target) && event.key === ArrowRight) {\n triggerRef.current?.focus();\n }\n }),\n onDismiss: useEventCallback((event, data) => {\n selectOption(event as React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>, {\n value: data.value,\n // These values no longer exist because the option has unregistered itself\n // for the purposes of selection - these values aren't actually used\n id: 'ERROR_DO_NOT_USE',\n text: 'ERROR_DO_NOT_USE',\n });\n if (hasOneSelectedOption && !event.isDefaultPrevented()) {\n triggerRef.current?.focus();\n }\n }),\n },\n useMergedRefs(ref, tagPickerGroupRef),\n );\n\n return {\n ...state,\n hasSelectedOptions,\n };\n};\n"],"names":["useTagPickerGroup_unstable","props","ref","hasSelectedOptions","useTagPickerContext_unstable","ctx","selectedOptions","length","hasOneSelectedOption","triggerRef","tagPickerGroupRef","selectOption","size","tagPickerSizeToTagSize","appearance","disabled","arrowNavigationProps","useArrowNavigationGroup","circular","axis","memorizeCurrent","state","useTagGroup_unstable","role","tagPickerAppearanceToTagAppearance","dismissible","onKeyDown","useEventCallback","event","isHTMLElement","target","key","ArrowRight","current","focus","onDismiss","data","value","id","text","isDefaultPrevented","useMergedRefs"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAkBaA;;;eAAAA;;;;iEAlBU;2BAEc;kCACQ;gCACkB;+BACY;8BACnC;8BACb;AAWpB,MAAMA,6BAA6B,CACxCC,OACAC;IAEA,MAAMC,qBAAqBC,IAAAA,8CAAAA,EAA6BC,CAAAA,MAAOA,IAAIC,eAAe,CAACC,MAAM,GAAG;IAC5F,MAAMC,uBAAuBJ,IAAAA,8CAAAA,EAA6BC,CAAAA,MAAOA,IAAIC,eAAe,CAACC,MAAM,KAAK;IAChG,MAAME,aAAaL,IAAAA,8CAAAA,EAA6BC,CAAAA,MAAOA,IAAII,UAAU;IACrE,MAAMC,oBAAoBN,IAAAA,8CAAAA,EAA6BC,CAAAA,MAAOA,IAAIK,iBAAiB;IACnF,MAAMC,eAAeP,IAAAA,8CAAAA,EAA6BC,CAAAA,MAAOA,IAAIM,YAAY;IACzE,MAAMC,OAAOR,IAAAA,8CAAAA,EAA6BC,CAAAA,MAAOQ,IAAAA,qCAAAA,EAAuBR,IAAIO,IAAI;IAChF,MAAME,aAAaV,IAAAA,8CAAAA,EAA6BC,CAAAA,MAAOA,IAAIS,UAAU;IACrE,MAAMC,WAAWX,IAAAA,8CAAAA,EAA6BC,CAAAA,MAAOA,IAAIU,QAAQ;IAEjE,MAAMC,uBAAuBC,IAAAA,qCAAAA,EAAwB;QACnDC,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACnB;IAEA,MAAMC,QAAQC,IAAAA,+BAAAA,EACZ;QACEC,MAAM;QACNR;QACA,GAAGd,KAAK;QACR,GAAGe,oBAAoB;QACvBJ;QACAE,YAAYU,IAAAA,iDAAAA,EAAmCV;QAC/CW,aAAa;QACbC,WAAWC,IAAAA,gCAAAA,EAAiBC,CAAAA;gBAC1B3B;YAAAA,CAAAA,mBAAAA,MAAMyB,SAAS,AAATA,MAAS,QAAfzB,qBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,iBAAAA,IAAAA,CAAAA,OAAkB2B;YAClB,IAAIC,IAAAA,6BAAAA,EAAcD,MAAME,MAAM,KAAKF,MAAMG,GAAG,KAAKC,wBAAAA,EAAY;oBAC3DvB;gBAAAA,CAAAA,sBAAAA,WAAWwB,OAAO,AAAPA,MAAO,QAAlBxB,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAoByB,KAAK;YAC3B;QACF;QACAC,WAAWR,IAAAA,gCAAAA,EAAiB,CAACC,OAAOQ;YAClCzB,aAAaiB,OAAiF;gBAC5FS,OAAOD,KAAKC,KAAK;gBACjB,0EAA0E;gBAC1E,oEAAoE;gBACpEC,IAAI;gBACJC,MAAM;YACR;YACA,IAAI/B,wBAAwB,CAACoB,MAAMY,kBAAkB,IAAI;oBACvD/B;gBAAAA,CAAAA,sBAAAA,WAAWwB,OAAO,AAAPA,MAAO,QAAlBxB,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAoByB,KAAK;YAC3B;QACF;IACF,GACAO,IAAAA,6BAAAA,EAAcvC,KAAKQ;IAGrB,OAAO;QACL,GAAGW,KAAK;QACRlB;IACF;AACF"}
|
|
@@ -38,7 +38,7 @@ const tagPickerGroupClassNames = {
|
|
|
38
38
|
B0ocmuz: "fa2pw7h",
|
|
39
39
|
i8kkvl: 0,
|
|
40
40
|
Belr9w4: 0,
|
|
41
|
-
rmohyg: "
|
|
41
|
+
rmohyg: "fkln5zr"
|
|
42
42
|
},
|
|
43
43
|
large: {
|
|
44
44
|
Byoj8tv: 0,
|
|
@@ -48,7 +48,7 @@ const tagPickerGroupClassNames = {
|
|
|
48
48
|
B0ocmuz: "fc0zr7g",
|
|
49
49
|
i8kkvl: 0,
|
|
50
50
|
Belr9w4: 0,
|
|
51
|
-
rmohyg: "
|
|
51
|
+
rmohyg: "f1eyhf9v"
|
|
52
52
|
},
|
|
53
53
|
"extra-large": {
|
|
54
54
|
Byoj8tv: 0,
|
|
@@ -58,7 +58,7 @@ const tagPickerGroupClassNames = {
|
|
|
58
58
|
B0ocmuz: "fc0zr7g",
|
|
59
59
|
i8kkvl: 0,
|
|
60
60
|
Belr9w4: 0,
|
|
61
|
-
rmohyg: "
|
|
61
|
+
rmohyg: "f1eyhf9v"
|
|
62
62
|
}
|
|
63
63
|
}, {
|
|
64
64
|
d: [
|
|
@@ -72,7 +72,7 @@ const tagPickerGroupClassNames = {
|
|
|
72
72
|
}
|
|
73
73
|
],
|
|
74
74
|
[
|
|
75
|
-
".
|
|
75
|
+
".fkln5zr{gap:var(--spacingHorizontalXS);}",
|
|
76
76
|
{
|
|
77
77
|
p: -1
|
|
78
78
|
}
|
|
@@ -84,7 +84,7 @@ const tagPickerGroupClassNames = {
|
|
|
84
84
|
}
|
|
85
85
|
],
|
|
86
86
|
[
|
|
87
|
-
".
|
|
87
|
+
".f1eyhf9v{gap:var(--spacingHorizontalSNudge);}",
|
|
88
88
|
{
|
|
89
89
|
p: -1
|
|
90
90
|
}
|
|
@@ -96,7 +96,7 @@ const tagPickerGroupClassNames = {
|
|
|
96
96
|
}
|
|
97
97
|
],
|
|
98
98
|
[
|
|
99
|
-
".
|
|
99
|
+
".f1eyhf9v{gap:var(--spacingHorizontalSNudge);}",
|
|
100
100
|
{
|
|
101
101
|
p: -1
|
|
102
102
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTagPickerGroupStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { useTagGroupStyles_unstable } from '@fluentui/react-tags';\nimport { tokens } from '@fluentui/react-theme';\nimport { tagSizeToTagPickerSize } from '../../utils/tagPicker2Tag';\nexport const tagPickerGroupClassNames = {\n root: 'fui-TagPickerGroup'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n flexWrap: 'wrap',\n boxSizing: 'border-box',\n cursor: 'text'\n },\n // size variants\n medium: {\n padding: `${tokens.spacingVerticalSNudge} 0 ${tokens.spacingVerticalSNudge} 0`,\n gap:
|
|
1
|
+
{"version":3,"sources":["useTagPickerGroupStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { useTagGroupStyles_unstable } from '@fluentui/react-tags';\nimport { tokens } from '@fluentui/react-theme';\nimport { tagSizeToTagPickerSize } from '../../utils/tagPicker2Tag';\nexport const tagPickerGroupClassNames = {\n root: 'fui-TagPickerGroup'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n flexWrap: 'wrap',\n boxSizing: 'border-box',\n cursor: 'text'\n },\n // size variants\n medium: {\n padding: `${tokens.spacingVerticalSNudge} 0 ${tokens.spacingVerticalSNudge} 0`,\n gap: tokens.spacingHorizontalXS\n },\n large: {\n padding: `${tokens.spacingVerticalS} 0 ${tokens.spacingVerticalS} 0`,\n gap: tokens.spacingHorizontalSNudge\n },\n 'extra-large': {\n padding: `${tokens.spacingVerticalS} 0 ${tokens.spacingVerticalS} 0`,\n gap: tokens.spacingHorizontalSNudge\n }\n});\n/**\n * Apply styling to the TagPickerGroup slots based on the state\n */ export const useTagPickerGroupStyles_unstable = (state)=>{\n 'use no memo';\n useTagGroupStyles_unstable(state);\n const styles = useStyles();\n state.root.className = mergeClasses(tagPickerGroupClassNames.root, styles[tagSizeToTagPickerSize(state.size)], styles.root, state.root.className);\n return state;\n};\n"],"names":["tagPickerGroupClassNames","useTagPickerGroupStyles_unstable","root","useStyles","__styles","Eh141a","B7ck84d","Bceei9c","medium","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","i8kkvl","Belr9w4","rmohyg","large","d","p","state","useTagGroupStyles_unstable","styles","className","mergeClasses","tagSizeToTagPickerSize","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,wBAAwB;eAAxBA;;IA2BIC,gCAAgC;eAAhCA;;;uBA/BwB;2BACE;+BAEJ;AAChC,MAAMD,2BAA2B;IACpCE,MAAM;AACV;AACA;;CAEA,GAAI,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAF,MAAA;QAAAG,QAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;IAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;IAAAC,OAAA;QAAAR,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;IAAA,eAAA;QAAAP,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;AAAA,GAAA;IAAAE,GAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,GAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;KAAA;AAAA;AAsBX,MAAMlB,mCAAoCmB,CAAAA;IACjD;IACAC,IAAAA,qCAA0B,EAACD;IAC3B,MAAME,SAASnB;IACfiB,MAAMlB,IAAI,CAACqB,SAAS,GAAGC,IAAAA,mBAAY,EAACxB,yBAAyBE,IAAI,EAAEoB,MAAM,CAACG,IAAAA,qCAAsB,EAACL,MAAMM,IAAI,EAAE,EAAEJ,OAAOpB,IAAI,EAAEkB,MAAMlB,IAAI,CAACqB,SAAS;IAChJ,OAAOH;AACX"}
|
|
@@ -73,7 +73,7 @@ const useTagPickerInput_unstable = (propsArg, ref)=>{
|
|
|
73
73
|
onKeyDown: (0, _reactutilities.useEventCallback)((event)=>{
|
|
74
74
|
var _props_onKeyDown;
|
|
75
75
|
(_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, event);
|
|
76
|
-
if ((event.key === _keyboardkeys.ArrowLeft || event.key === _keyboardkeys.Backspace) && event.currentTarget.selectionStart === 0 && tagPickerGroupRef.current) {
|
|
76
|
+
if ((event.key === _keyboardkeys.ArrowLeft || event.key === _keyboardkeys.Backspace) && event.currentTarget.selectionStart === 0 && event.currentTarget.selectionEnd === 0 && tagPickerGroupRef.current) {
|
|
77
77
|
var _findLastFocusable;
|
|
78
78
|
(_findLastFocusable = findLastFocusable(tagPickerGroupRef.current)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();
|
|
79
79
|
} else if (event.key === _keyboardkeys.Space) {
|