@spectrum-web-components/picker 0.40.4 → 0.40.5

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.
Files changed (9) hide show
  1. package/package.json +15 -15
  2. package/src/picker.css.dev.js +124 -118
  3. package/src/picker.css.dev.js.map +2 -2
  4. package/src/picker.css.js +124 -118
  5. package/src/picker.css.js.map +2 -2
  6. package/src/spectrum-picker.css.dev.js +124 -118
  7. package/src/spectrum-picker.css.dev.js.map +2 -2
  8. package/src/spectrum-picker.css.js +124 -118
  9. package/src/spectrum-picker.css.js.map +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/picker",
3
- "version": "0.40.4",
3
+ "version": "0.40.5",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -65,21 +65,21 @@
65
65
  "lit-html"
66
66
  ],
67
67
  "dependencies": {
68
- "@spectrum-web-components/base": "^0.40.4",
69
- "@spectrum-web-components/button": "^0.40.4",
70
- "@spectrum-web-components/icon": "^0.40.4",
71
- "@spectrum-web-components/icons-ui": "^0.40.4",
72
- "@spectrum-web-components/icons-workflow": "^0.40.4",
73
- "@spectrum-web-components/menu": "^0.40.4",
74
- "@spectrum-web-components/overlay": "^0.40.4",
75
- "@spectrum-web-components/popover": "^0.40.4",
76
- "@spectrum-web-components/reactive-controllers": "^0.40.4",
77
- "@spectrum-web-components/shared": "^0.40.4",
78
- "@spectrum-web-components/tooltip": "^0.40.4",
79
- "@spectrum-web-components/tray": "^0.40.4"
68
+ "@spectrum-web-components/base": "^0.40.5",
69
+ "@spectrum-web-components/button": "^0.40.5",
70
+ "@spectrum-web-components/icon": "^0.40.5",
71
+ "@spectrum-web-components/icons-ui": "^0.40.5",
72
+ "@spectrum-web-components/icons-workflow": "^0.40.5",
73
+ "@spectrum-web-components/menu": "^0.40.5",
74
+ "@spectrum-web-components/overlay": "^0.40.5",
75
+ "@spectrum-web-components/popover": "^0.40.5",
76
+ "@spectrum-web-components/reactive-controllers": "^0.40.5",
77
+ "@spectrum-web-components/shared": "^0.40.5",
78
+ "@spectrum-web-components/tooltip": "^0.40.5",
79
+ "@spectrum-web-components/tray": "^0.40.5"
80
80
  },
81
81
  "devDependencies": {
82
- "@spectrum-css/picker": "7.0.18"
82
+ "@spectrum-css/picker": "^7.2.0"
83
83
  },
84
84
  "types": "./src/index.d.ts",
85
85
  "customElements": "custom-elements.json",
@@ -89,5 +89,5 @@
89
89
  "./sync/index.js",
90
90
  "./sync/sp-*.js"
91
91
  ],
92
- "gitHead": "e7bca020d0da71c4d92e95044bf58780d2e8e603"
92
+ "gitHead": "2e0006478841b07af63c19a0167a136bf724d064"
93
93
  }
package/src/picker.css.dev.js CHANGED
@@ -2,16 +2,28 @@
2
2
  import { css } from "@spectrum-web-components/base";
3
3
  const styles = css`
4
4
  #button{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;-webkit-appearance:button;cursor:pointer;display:inline-flex;font-family:var(
5
+ --mod-button-font-family,var(
5
6
  --mod-sans-font-family-stack,var(--spectrum-sans-font-family-stack)
6
- );justify-content:center;line-height:var(--mod-line-height-100,var(--spectrum-line-height-100));margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none;text-transform:none;transition:background var(
7
+ )
8
+ );justify-content:center;line-height:var(
9
+ --mod-button-line-height,var(--mod-line-height-100,var(--spectrum-line-height-100))
10
+ );margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none;text-transform:none;transition:background var(
11
+ --mod-button-animation-duration,var(
7
12
  --mod-animation-duration-100,var(--spectrum-animation-duration-100)
13
+ )
8
14
  ) ease-out,border-color var(
15
+ --mod-button-animation-duration,var(
9
16
  --mod-animation-duration-100,var(--spectrum-animation-duration-100)
17
+ )
10
18
  ) ease-out,color var(
19
+ --mod-button-animation-duration,var(
11
20
  --mod-animation-duration-100,var(--spectrum-animation-duration-100)
21
+ )
12
22
  ) ease-out,box-shadow var(
23
+ --mod-button-animation-duration,var(
13
24
  --mod-animation-duration-100,var(--spectrum-animation-duration-100)
14
- ) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top}#button:focus{outline:none}#button::-moz-focus-inner{border:0;margin-block:-2px;padding:0}#button:disabled{cursor:default}:host{--spectrum-picker-font-size:var(--spectrum-font-size-100);--spectrum-picker-font-weight:var(--spectrum-regular-font-weight);--spectrum-picker-placeholder-font-style:var(
25
+ )
26
+ ) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top}#button::-moz-focus-inner{border:0;margin-block:-2px;padding:0}#button:focus{outline:none}:host{--spectrum-picker-font-size:var(--spectrum-font-size-100);--spectrum-picker-font-weight:var(--spectrum-regular-font-weight);--spectrum-picker-placeholder-font-style:var(
15
27
  --spectrum-default-font-style
16
28
  );--spectrum-picker-line-height:var(--spectrum-line-height-100);--spectrum-picker-block-size:var(--spectrum-component-height-100);--spectrum-picker-inline-size:var(--spectrum-field-width);--spectrum-picker-border-radius:var(--spectrum-corner-radius-100);--spectrum-picker-spacing-top-to-text:var(
17
29
  --spectrum-component-top-to-text-100
@@ -41,7 +53,7 @@ const styles = css`
41
53
  --spectrum-field-end-edge-to-disclosure-icon-100
42
54
  );--spectrum-picker-spacing-edge-to-disclosure-icon-quiet:var(
43
55
  --spectrum-picker-end-edge-to-disclousure-icon-quiet
44
- );--spectrum-picker-animation-duration:var(
56
+ )}:host{--spectrum-picker-animation-duration:var(
45
57
  --spectrum-animation-duration-100
46
58
  );--spectrum-picker-font-color-default:var(
47
59
  --spectrum-neutral-content-color-default
@@ -155,10 +167,8 @@ const styles = css`
155
167
  --spectrum-field-top-to-disclosure-icon-300
156
168
  );--spectrum-picker-spacing-edge-to-disclosure-icon:var(
157
169
  --spectrum-field-end-edge-to-disclosure-icon-300
158
- )}@media (forced-colors:active){:host{--highcontrast-picker-focus-indicator-color:CanvasText;--highcontrast-picker-border-color-default:ButtonText;--highcontrast-picker-border-color-active:ButtonText;--highcontrast-picker-border-color-key-focus:Highlight;--highcontrast-picker-border-color-error-default-open:ButtonText;--highcontrast-picker-border-color-error-hover:ButtonText;--highcontrast-picker-border-color-error-active:ButtonText;--highcontrast-picker-font-color-default:ButtonText;--highcontrast-picker-font-color-default-open:ButtonText;--highcontrast-picker-font-color-key-focus:ButtonText;--highcontrast-picker-font-color-disabled:GrayText;--highcontrast-picker-background-color-default:Background;--highcontrast-picker-background-color-disabled:Background;--highcontrast-picker-icon-color-default:ButtonText;--highcontrast-picker-icon-color-default-open:ButtonText;--highcontrast-picker-icon-color-hover:ButtonText;--highcontrast-picker-icon-color-hover-open:ButtonText;--highcontrast-picker-icon-color-key-focus:Highlight;--highcontrast-picker-icon-color-error-default:ButtonText}#button:disabled,:host([disabled]) #button{border-color:GrayText;border-width:var(
159
- --mod-picker-border-width,var(--spectrum-picker-border-width)
160
- )}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}}#button{background-color:var(
161
- --highcontrast-picker-background-color-default,var(
170
+ )}@media (forced-colors:active){:host{--highcontrast-picker-focus-indicator-color:Highlight;--highcontrast-picker-border-color-default:ButtonBorder;--highcontrast-picker-border-color-hover:Highlight;--highcontrast-picker-border-color-disabled:GrayText;--highcontrast-picker-content-color-default:ButtonText;--highcontrast-picker-content-color-disabled:GrayText;--highcontrast-picker-background-color:ButtonFace}#button.focus-visible,#button.is-keyboardFocused{--highcontrast-picker-border-color-hover:ButtonText}#button.is-keyboardFocused,#button:focus-visible{--highcontrast-picker-border-color-hover:ButtonText}#button:after{forced-color-adjust:none}#button .label{forced-color-adjust:none}}#button{background-color:var(
171
+ --highcontrast-picker-background-color,var(
162
172
  --mod-picker-background-color-default,var(--spectrum-picker-background-color-default)
163
173
  )
164
174
  );block-size:var(--mod-picker-block-size,var(--spectrum-picker-block-size));border-color:var(
@@ -170,7 +180,7 @@ const styles = css`
170
180
  );border-style:solid;border-width:var(
171
181
  --mod-picker-border-width,var(--spectrum-picker-border-width)
172
182
  );box-sizing:border-box;color:var(
173
- --highcontrast-picker-font-color-default,var(
183
+ --highcontrast-picker-content-color-default,var(
174
184
  --mod-picker-font-color-default,var(--spectrum-picker-font-color-default)
175
185
  )
176
186
  );display:flex;inline-size:var(
@@ -216,175 +226,129 @@ var(--spectrum-picker-focus-indicator-thickness)
216
226
  ) + var(
217
227
  --mod-picker-border-width,
218
228
  var(--spectrum-picker-border-width)
219
- ))*-1);pointer-events:none;position:absolute}#button:hover{background-color:var(
220
- --highcontrast-picker-background-color-default,var(
221
- --mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)
222
- )
223
- );border-color:var(
224
- --highcontrast-picker-border-color-default,var(
225
- --mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)
226
- )
227
- );color:var(
228
- --highcontrast-picker-font-color-default,var(
229
- --mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)
230
- )
231
- )}#button:hover .picker{color:var(
232
- --highcontrast-picker-icon-color-hover,var(
233
- --mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)
234
- )
235
- )}#button:active{background-color:var(
236
- --highcontrast-picker-background-active,var(
229
+ ))*-1);pointer-events:none;position:absolute}#button:active{background-color:var(
230
+ --highcontrast-picker-background-color,var(
237
231
  --mod-picker-background-color-active,var(--spectrum-picker-background-color-active)
238
232
  )
239
233
  );border-color:var(
240
- --highcontrast-picker-border-color-active,var(
234
+ --highcontrast-picker-border-color-default,var(
241
235
  --mod-picker-border-active,var(--spectrum-picker-border-color-active)
242
236
  )
243
237
  )}#button:active:after{border-color:#0000}#button:active.placeholder .label{color:var(
244
- --highcontrast-picker-font-color-default,var(
238
+ --highcontrast-picker-content-color-default,var(
245
239
  --mod-picker-font-color-active,var(--spectrum-picker-font-color-active)
246
240
  )
247
- )}#button.focus-visible,:host([focused]) #button{background-color:var(
248
- --highcontrast-picker-background-color-default,var(
241
+ )}#button.focus-visible,#button.is-keyboardFocused{background-color:var(
242
+ --highcontrast-picker-background-color,var(
249
243
  --mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)
250
244
  )
251
245
  );border-color:var(
252
- --highcontrast-picker-border-color-key-focus,var(
246
+ --highcontrast-picker-border-color-default,var(
253
247
  --mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)
254
248
  )
255
- );border-width:var(
256
- --mod-picker-border-width,var(--spectrum-picker-border-width)
257
249
  );color:var(
258
- --highcontrast-picker-font-color-key-focus,var(
250
+ --highcontrast-picker-content-color-default,var(
259
251
  --mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)
260
252
  )
261
- );outline:none}#button:focus-visible,:host([focused]) #button{background-color:var(
262
- --highcontrast-picker-background-color-default,var(
253
+ );outline:none}#button.is-keyboardFocused,#button:focus-visible{background-color:var(
254
+ --highcontrast-picker-background-color,var(
263
255
  --mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)
264
256
  )
265
257
  );border-color:var(
266
- --highcontrast-picker-border-color-key-focus,var(
258
+ --highcontrast-picker-border-color-default,var(
267
259
  --mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)
268
260
  )
269
- );border-width:var(
270
- --mod-picker-border-width,var(--spectrum-picker-border-width)
271
261
  );color:var(
272
- --highcontrast-picker-font-color-key-focus,var(
262
+ --highcontrast-picker-content-color-default,var(
273
263
  --mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)
274
264
  )
275
- );outline:none}#button.focus-visible:after,:host([focused]) #button:after{border-color:var(
265
+ );outline:none}#button.focus-visible:after,#button.is-keyboardFocused:after{border-color:var(
276
266
  --highcontrast-picker-focus-indicator-color,var(
277
267
  --mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)
278
268
  )
279
- )}#button:focus-visible:after,:host([focused]) #button:after{border-color:var(
269
+ )}#button.is-keyboardFocused:after,#button:focus-visible:after{border-color:var(
280
270
  --highcontrast-picker-focus-indicator-color,var(
281
271
  --mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)
282
272
  )
283
- )}#button.focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(
284
- --highcontrast-picker-font-color-key-focus,var(
273
+ )}#button.focus-visible.placeholder,#button.is-keyboardFocused.placeholder{color:var(
274
+ --highcontrast-picker-content-color-default,var(
285
275
  --mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)
286
276
  )
287
- )}#button:focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(
288
- --highcontrast-picker-font-color-key-focus,var(
277
+ )}#button.is-keyboardFocused.placeholder,#button:focus-visible.placeholder{color:var(
278
+ --highcontrast-picker-content-color-default,var(
289
279
  --mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)
290
280
  )
291
- )}#button.focus-visible .picker,:host([focused]) #button .picker{color:var(
292
- --highcontrast-picker-icon-color-key-focus,var(
281
+ )}#button.focus-visible .picker,#button.is-keyboardFocused .picker{color:var(
282
+ --highcontrast-picker-content-color-default,var(
293
283
  --mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)
294
284
  )
295
- )}#button:focus-visible .picker,:host([focused]) #button .picker{color:var(
296
- --highcontrast-picker-icon-color-key-focus,var(
285
+ )}#button.is-keyboardFocused .picker,#button:focus-visible .picker{color:var(
286
+ --highcontrast-picker-content-color-default,var(
297
287
  --mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)
298
288
  )
299
- )}:host([invalid]) #button{border-color:var(
300
- --highcontrast-picker-border-color-error-default,var(
289
+ )}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(
290
+ --highcontrast-picker-border-color-default,var(
301
291
  --mod-picker-border-color-error-default,var(--spectrum-picker-border-color-error-default)
302
292
  )
303
- )}:host([invalid]) #button .validation-icon{color:var(
304
- --highcontrast-picker-icon-color-error-default,var(
293
+ )}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(
294
+ --highcontrast-picker-content-color-default,var(
305
295
  --mod-picker-icon-color-error,var(--spectrum-picker-icon-color-error)
306
296
  )
307
- )}:host([invalid]) #button:hover{border-color:var(
308
- --highcontrast-picker-border-color-error-hover,var(
309
- --mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)
310
- )
311
- )}:host([invalid]) #button:active{border-color:var(
312
- --highcontrast-picker-border-color-error-active,var(
297
+ )}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(
298
+ --highcontrast-picker-border-color-default,var(
313
299
  --mod-picker-border-color-error-active,var(--spectrum-picker-border-color-error-active)
314
300
  )
315
- )}:host([invalid][open]) #button{border-color:var(
316
- --highcontrast-picker-border-color-error-default-open,var(
301
+ )}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(
302
+ --highcontrast-picker-border-color-default,var(
317
303
  --mod-picker-border-color-error-default-open,var(--spectrum-picker-border-color-error-default-open)
318
304
  )
319
- )}:host([invalid][open]) #button:hover{border-color:var(
320
- --highcontrast-picker-border-color-error-hover-open,var(
321
- --mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)
322
- )
323
- )}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(
324
- --highcontrast-picker-border-color-error-default,var(
305
+ )}:host([invalid]) #button:not(:disabled,.is-disabled).focus-visible,:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused{border-color:var(
306
+ --highcontrast-picker-border-color-default,var(
325
307
  --mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)
326
308
  )
327
- )}:host([invalid]) #button:focus-visible,:host([invalid][focused]) #button{border-color:var(
328
- --highcontrast-picker-border-color-error-default,var(
309
+ )}:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused,:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(
310
+ --highcontrast-picker-border-color-default,var(
329
311
  --mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)
330
312
  )
331
313
  )}#button.is-loading .picker{color:var(
332
- --highcontrast-picker-icon-color-disabled,var(
314
+ --highcontrast-picker-content-color-disabled,var(
333
315
  --mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)
334
316
  )
335
317
  )}#button:disabled,:host([disabled]) #button{background-color:var(
336
- --highcontrast-picker-background-color-disabled,var(
318
+ --highcontrast-picker-background-color,var(
337
319
  --mod-picker-background-color-disabled,var(--spectrum-picker-background-color-disabled)
338
320
  )
339
- );border-color:#0000;border-width:var(
340
- --mod-picker-border-width,var(--spectrum-picker-border-width)
341
- );color:var(
342
- --highcontrast-picker-font-color-disabled,var(
321
+ );border-color:var(--highcontrast-picker-border-color-disabled,transparent);color:var(
322
+ --highcontrast-picker-content-color-disabled,var(
343
323
  --mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)
344
324
  )
345
325
  );cursor:default}#button:disabled .icon,#button:disabled .picker,#button:disabled .validation-icon,:host([disabled]) #button .icon,:host([disabled]) #button .picker,:host([disabled]) #button .validation-icon{color:var(
346
- --highcontrast-picker-icon-color-disabled,var(
326
+ --highcontrast-picker-content-color-disabled,var(
347
327
  --mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)
348
328
  )
349
329
  )}#button:disabled .label.placeholder,:host([disabled]) #button .label.placeholder{color:var(
350
- --highcontrast-picker-font-color-disabled,var(
330
+ --highcontrast-picker-content-color-disabled,var(
351
331
  --mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)
352
332
  )
353
333
  )}.icon{flex-shrink:0;margin-inline-end:var(
354
334
  --mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)
355
- )}:host([open]) #button{background-color:var(
356
- --highcontrast-picker-background-default-open,var(
335
+ )}:host([open]) #button:not(.spectrum-Picker--quiet){background-color:var(
336
+ --highcontrast-picker-background-color,var(
357
337
  --mod-picker-background-color-default-open,var(--spectrum-picker-background-color-default-open)
358
338
  )
359
339
  );border-color:var(
360
- --highcontrast-picker-border-color-default-open,var(
340
+ --highcontrast-picker-border-color-default,var(
361
341
  --mod-picker-border-default-open,var(--spectrum-picker-border-color-default-open)
362
342
  )
363
343
  );color:var(
364
- --highcontrast-picker-font-color-default-open,var(
344
+ --highcontrast-picker-content-color-default,var(
365
345
  --mod-picker-font-color-default-open,var(--spectrum-picker-font-color-default-open)
366
346
  )
367
- )}:host([open]) #button:hover{background-color:var(
368
- --highcontrast-picker-background-color-hover-open,var(
369
- --mod-picker-background-color-hover-open,var(--spectrum-picker-background-color-hover-open)
370
- )
371
- );border-color:var(
372
- --highcontrast-picker-border-color-hover-open,var(
373
- --mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)
374
- )
375
- );color:var(
376
- --highcontrast-picker-font-color-default,var(
377
- --mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)
378
- )
379
- )}:host([open]) #button:hover .picker{color:var(
380
- --highcontrast-picker-icon-color-hover-open,var(
381
- --mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)
382
- )
383
- )}:host([open]) #button .picker{color:var(
384
- --highcontrast-picker-icon-color-default-open,var(
347
+ )}:host([open]) #button:not(.spectrum-Picker--quiet) .picker{color:var(
348
+ --highcontrast-picker-content-color-default,var(
385
349
  --mod-picker-icon-color-default-open,var(--spectrum-picker-icon-color-default-open)
386
350
  )
387
- )}:host([quiet]) #button{inline-size:auto;min-inline-size:0}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{border-color:#0000}:host([quiet]) #button:disabled:focus-visible,:host([quiet][disabled]) #button:focus-visible{border-color:#0000}.label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));font-weight:var(
351
+ )}.label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));font-weight:var(
388
352
  --mod-picker-font-weight,var(--spectrum-picker-font-weight)
389
353
  );line-height:var(
390
354
  --mod-picker-line-height,var(--spectrum-picker-line-height)
@@ -394,7 +358,7 @@ var(--spectrum-picker-spacing-bottom-to-text)
394
358
  ) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:var(
395
359
  --mod-picker-spacing-top-to-text,var(--spectrum-picker-spacing-top-to-text)
396
360
  );overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap}.label.placeholder{color:var(
397
- --highcontrast-picker-font-color-default,var(
361
+ --highcontrast-picker-content-color-default,var(
398
362
  --mod-picker-font-color-default,var(--spectrum-picker-font-color-default)
399
363
  )
400
364
  );font-style:var(
@@ -403,16 +367,12 @@ var(--spectrum-picker-spacing-bottom-to-text)
403
367
  --mod-picker-placeholder-font-weight,var(--spectrum-picker-font-weight)
404
368
  );transition:color var(
405
369
  --mod-picker-animation-duration,var(--spectrum-picker-animation-duration)
406
- ) ease-in-out}.label.placeholder:hover{color:var(
407
- --highcontrast-picker-font-color-default,var(
408
- --mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)
409
- )
410
- )}.label.placeholder:active{color:var(
411
- --highcontrast-picker-font-color-default,var(
370
+ ) ease-in-out}.label.placeholder:active{color:var(
371
+ --highcontrast-picker-content-color-default,var(
412
372
  --mod-picker-font-color-active,var(--spectrum-picker-font-color-active)
413
373
  )
414
374
  )}.picker{color:var(
415
- --highcontrast-picker-icon-color-default,var(
375
+ --highcontrast-picker-content-color-default,var(
416
376
  --mod-picker-icon-color-default,var(--spectrum-picker-icon-color-default)
417
377
  )
418
378
  );display:inline-block;flex-shrink:0;margin-block:var(
@@ -422,7 +382,7 @@ var(--spectrum-picker-spacing-bottom-to-text)
422
382
  );position:relative;transition:color var(
423
383
  --mod-picker-animation-duration,var(--spectrum-picker-animation-duration)
424
384
  ) ease-out;vertical-align:top}.picker:active{color:var(
425
- --highcontrast-picker-icon-color-default,var(
385
+ --highcontrast-picker-content-color-default,var(
426
386
  --mod-picker-icon-color-active,var(--spectrum-picker-icon-color-active)
427
387
  )
428
388
  )}#button .spectrum-ProgressCircle,.validation-icon{margin-inline-start:var(
@@ -441,18 +401,64 @@ var(--spectrum-picker-spacing-top-to-progress-circle)
441
401
  var(--spectrum-picker-spacing-top-to-progress-circle)
442
402
  ) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)))}.label~.picker{margin-inline-start:var(
443
403
  --mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)
444
- )}:host([quiet]) #button{background-color:#0000;border:none;border-radius:0;color:var(
445
- --highcontrast-picker-font-color-default,var(
404
+ )}:host([quiet]) #button{background-color:var(--highcontrast-picker-background-color,transparent);border:none;border-radius:0;color:var(
405
+ --highcontrast-picker-content-color-default,var(
446
406
  --mod-picker-font-color-default,var(--spectrum-picker-font-color-default)
447
407
  )
448
- );margin-block-start:calc(var(
408
+ );inline-size:auto;margin-block-start:calc(var(
449
409
  --mod-picker-spacing-label-to-picker-quiet,
450
410
  var(--spectrum-picker-spacing-label-to-picker-quiet)
451
- ) + 1px);padding-inline:var(
411
+ ) + 1px);min-inline-size:0;padding-inline:var(
452
412
  --mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)
453
413
  )}:host([quiet]) #button.spectrum-Picker--sideLabel{margin-block-start:calc(var(--spectrum-picker-spacing-top-to-text-side-label-quiet)*-1)}:host([quiet]) #button .picker{margin-inline-end:var(
454
414
  --mod-picker-spacing-edge-to-disclosure-icon-quiet,var(--spectrum-picker-spacing-edge-to-disclosure-icon-quiet)
455
- )}:host([quiet]) #button:after{block-size:auto;border:none;inline-size:auto}:host([quiet]) #button:hover{background-color:#0000}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button.focus-visible:after,:host([quiet][focused]) #button:after{border:none;border-radius:0;box-shadow:0 var(
415
+ )}:host([quiet]) #button:after{block-size:auto;border:none;inline-size:auto}@media (hover:hover){#button:hover .picker{color:var(
416
+ --highcontrast-picker-content-color-default,var(
417
+ --mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)
418
+ )
419
+ )}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(
420
+ --highcontrast-picker-border-color-hover,var(
421
+ --mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)
422
+ )
423
+ )}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(
424
+ --highcontrast-picker-border-color-hover,var(
425
+ --mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)
426
+ )
427
+ )}:host([open]) #button:not(.spectrum-Picker--quiet):hover .picker{color:var(
428
+ --highcontrast-picker-content-color-default,var(
429
+ --mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)
430
+ )
431
+ )}.label.placeholder:hover{color:var(
432
+ --highcontrast-picker-content-color-default,var(
433
+ --mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)
434
+ )
435
+ )}#button:hover{background-color:var(
436
+ --highcontrast-picker-background-color,var(
437
+ --mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)
438
+ )
439
+ );border-color:var(
440
+ --highcontrast-picker-border-color-hover,var(
441
+ --mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)
442
+ )
443
+ );color:var(
444
+ --highcontrast-picker-content-color-default,var(
445
+ --mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)
446
+ )
447
+ )}:host([open]) #button:not(.spectrum-Picker--quiet):hover{background-color:var(
448
+ --highcontrast-picker-background-color,var(
449
+ --mod-picker-background-color-hover-open,var(--spectrum-picker-background-color-hover-open)
450
+ )
451
+ );border-color:var(
452
+ --highcontrast-picker-border-color-hover,var(
453
+ --mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)
454
+ )
455
+ );color:var(
456
+ --highcontrast-picker-content-color-default,var(
457
+ --mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)
458
+ )
459
+ )}:host([quiet]) #button:hover{background-color:var(
460
+ --highcontrast-picker-background-color,transparent
461
+ )}}:host([quiet]) #button.focus-visible,:host([quiet]) #button.is-keyboardFocused{background-color:var(--highcontrast-picker-background-color,transparent)}:host([quiet]) #button.is-keyboardFocused,:host([quiet]) #button:focus-visible{background-color:var(--highcontrast-picker-background-color,transparent)}:host([quiet]) #button.focus-visible:after,:host([quiet]) #button.is-keyboardFocused:after{border:none;border-radius:0;box-shadow:0 var(
456
462
  --mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)
457
463
  ) 0 0 var(
458
464
  --highcontrast-picker-focus-indicator-color,var(
@@ -464,7 +470,7 @@ var(--spectrum-picker-focus-indicator-gap)
464
470
  ) + var(
465
471
  --mod-picker-border-width,
466
472
  var(--spectrum-picker-border-width)
467
- ))*-1) 0}:host([quiet]) #button:focus-visible:after,:host([quiet][focused]) #button:after{border:none;border-radius:0;box-shadow:0 var(
473
+ ))*-1) 0}:host([quiet]) #button.is-keyboardFocused:after,:host([quiet]) #button:focus-visible:after{border:none;border-radius:0;box-shadow:0 var(
468
474
  --mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)
469
475
  ) 0 0 var(
470
476
  --highcontrast-picker-focus-indicator-color,var(
@@ -476,7 +482,7 @@ var(--spectrum-picker-focus-indicator-gap)
476
482
  ) + var(
477
483
  --mod-picker-border-width,
478
484
  var(--spectrum-picker-border-width)
479
- ))*-1) 0}:host([quiet]) #button:active,:host([quiet][open]) #button{background-color:#0000}:host([quiet]) #button:disabled,:host([quiet][disabled]) #button{background-color:#0000}.spectrum-Picker--sideLabel{display:inline-flex;vertical-align:top}:host{--spectrum-picker-background-color-default:var(
485
+ ))*-1) 0}:host([quiet]) #button:active,:host([quiet][open]) #button{background-color:var(--highcontrast-picker-background-color,transparent)}:host([quiet]) #button:disabled,:host([quiet][disabled]) #button{background-color:var(--highcontrast-picker-background-color,transparent)}.spectrum-Picker--sideLabel{display:inline-flex;vertical-align:top}:host{--spectrum-picker-background-color-default:var(
480
486
  --system-spectrum-picker-background-color-default
481
487
  );--spectrum-picker-background-color-default-open:var(
482
488
  --system-spectrum-picker-background-color-default-open
@@ -500,7 +506,7 @@ var(--spectrum-picker-border-width)
500
506
  --system-spectrum-picker-border-color-active
501
507
  );--spectrum-picker-border-color-key-focus:var(
502
508
  --system-spectrum-picker-border-color-key-focus
503
- )}:host{display:inline-flex;inline-size:var(
509
+ );--spectrum-picker-border-width:var(--system-spectrum-picker-border-width)}:host{display:inline-flex;inline-size:var(
504
510
  --spectrum-picker-width,var(--spectrum-global-dimension-size-2400)
505
511
  );max-inline-size:100%;min-inline-size:calc(var(--spectrum-picker-minimum-width-multiplier)*var(--mod-picker-block-size, var(--spectrum-picker-block-size)));vertical-align:top}:host([quiet]){min-width:0;width:auto}#button{max-width:100%;min-width:100%;width:100%}#icon:not([hidden]){display:inline-flex}:host([readonly]) #button{-webkit-user-select:inherit;user-select:inherit}.picker,.validation-icon{flex-shrink:0}sp-overlay{pointer-events:none}sp-menu{pointer-events:auto}:host>sp-menu{display:none}:host([focused]:not([quiet])) #button #label.placeholder{color:var(
506
512
  --spectrum-picker-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)