@spectrum-web-components/picker 0.41.0 → 0.41.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/package.json +15 -15
- package/src/Picker.dev.js +3 -0
- package/src/Picker.dev.js.map +2 -2
- package/src/Picker.js +1 -1
- package/src/Picker.js.map +2 -2
- package/src/picker.css.dev.js +10 -10
- package/src/picker.css.dev.js.map +1 -1
- package/src/picker.css.js +10 -10
- package/src/picker.css.js.map +1 -1
- package/src/spectrum-picker.css.dev.js +8 -8
- package/src/spectrum-picker.css.dev.js.map +1 -1
- package/src/spectrum-picker.css.js +8 -8
- package/src/spectrum-picker.css.js.map +1 -1
- package/stories/args.js +55 -0
- package/stories/args.js.map +7 -0
- package/stories/picker.stories.js +13 -45
- package/stories/picker.stories.js.map +2 -2
- package/stories/template.js +28 -0
- package/stories/template.js.map +7 -0
- package/test/index.js +46 -0
- package/test/index.js.map +2 -2
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["picker.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n#button{-webkit-appearance:button;cursor:pointer;font-family:var(\n--mod-button-font-family,var(\n--mod-sans-font-family-stack,var(--spectrum-sans-font-family-stack)\n)\n);line-height:var(\n--mod-button-line-height,var(--mod-line-height-100,var(--spectrum-line-height-100))\n);text-transform:none;transition:background var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,border-color var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,color var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,box-shadow var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;display:inline-flex;justify-content:center;margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none}#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(\n--spectrum-default-font-style\n);--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(\n--spectrum-component-top-to-text-100\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-100\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-100\n);--spectrum-picker-spacing-edge-to-text-quiet:var(\n--spectrum-field-edge-to-text-quiet\n);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-field-label-top-margin-medium\n);--spectrum-picker-spacing-label-to-picker:var(\n--spectrum-field-label-to-component\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-100);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-medium\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-medium\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-medium\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-medium\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-medium\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon-quiet:var(\n--spectrum-picker-end-edge-to-disclousure-icon-quiet\n)}:host{--spectrum-picker-animation-duration:var(\n--spectrum-animation-duration-100\n);--spectrum-picker-font-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-picker-font-color-default-open:var(\n--spectrum-neutral-content-color-focus\n);--spectrum-picker-font-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-picker-font-color-hover-open:var(\n--spectrum-neutral-content-color-focus-hover\n);--spectrum-picker-font-color-active:var(\n--spectrum-neutral-content-color-down\n);--spectrum-picker-font-color-key-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-picker-icon-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-picker-icon-color-default-open:var(\n--spectrum-neutral-content-color-focus\n);--spectrum-picker-icon-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-picker-icon-color-hover-open:var(\n--spectrum-neutral-content-color-focus-hover\n);--spectrum-picker-icon-color-active:var(\n--spectrum-neutral-content-color-down\n);--spectrum-picker-icon-color-key-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-picker-border-color-error-default:var(\n--spectrum-negative-border-color-default\n);--spectrum-picker-border-color-error-default-open:var(\n--spectrum-negative-border-color-focus\n);--spectrum-picker-border-color-error-hover:var(\n--spectrum-negative-border-color-hover\n);--spectrum-picker-border-color-error-hover-open:var(\n--spectrum-negative-border-color-focus-hover\n);--spectrum-picker-border-color-error-active:var(\n--spectrum-negative-border-color-down\n);--spectrum-picker-border-color-error-key-focus:var(\n--spectrum-negative-border-color-key-focus\n);--spectrum-picker-icon-color-error:var(--spectrum-negative-visual-color);--spectrum-picker-background-color-disabled:var(\n--spectrum-disabled-background-color\n);--spectrum-picker-font-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-picker-icon-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-picker-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-picker-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-picker-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n)}:host([size=s]){--spectrum-picker-font-size:var(--spectrum-font-size-75);--spectrum-picker-block-size:var(--spectrum-component-height-75);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-field-label-top-margin-small\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-75\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-75\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-75);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-small\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-small\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-small\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-small\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-small\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-75\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-75\n)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-field-label-top-margin-large\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-200\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-200\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-200);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-large\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-large\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-large\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-large\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-large\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-200\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-200\n)}:host([size=xl]){--spectrum-picker-font-size:var(--spectrum-font-size-300);--spectrum-picker-block-size:var(--spectrum-component-height-300);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-field-label-top-margin-extra-large\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-300\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-300\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-300);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-extra-large\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-extra-large\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-extra-large\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-extra-large\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-extra-large\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-300\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-300\n)}@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(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-default,var(--spectrum-picker-background-color-default)\n)\n);block-size:var(--mod-picker-block-size,var(--spectrum-picker-block-size));border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-default,var(--spectrum-picker-border-color-default)\n)\n);border-radius:var(\n--mod-picker-border-radius,var(--spectrum-picker-border-radius)\n);border-style:solid;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);box-sizing:border-box;color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);display:flex;inline-size:var(\n--mod-picker-inline-size,var(--spectrum-picker-inline-size)\n);margin-block-start:var(\n--mod-picker-spacing-label-to-picker,var(--spectrum-picker-spacing-label-to-picker)\n);max-inline-size:100%;min-inline-size:calc(var(--spectrum-picker-minimum-width-multiplier)*var(--mod-picker-block-size, var(--spectrum-picker-block-size)));padding-block:0;padding-inline-end:var(\n--mod-picker-spacing-edge-to-disclosure-icon,var(--spectrum-picker-spacing-edge-to-disclosure-icon)\n);padding-inline-start:var(\n--mod-picker-spacing-edge-to-text,var(--spectrum-picker-spacing-edge-to-text)\n);transition:background-color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n),box-shadow var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n),border-color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-in-out}#button:after{block-size:calc(100% + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n)*2 + var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);border-color:#0000;border-radius:calc(var(--mod-picker-border-radius, var(--spectrum-picker-border-radius)) + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(--mod-picker-border-width, var(--spectrum-picker-border-width)));border-style:solid;border-width:var(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n);content:\"\";inline-size:calc(100% + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n)*2 + var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);inset-block:0;inset-inline:0;margin-block-start:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-focus-indicator-thickness,\nvar(--spectrum-picker-focus-indicator-thickness)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1);margin-inline-start:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-focus-indicator-thickness,\nvar(--spectrum-picker-focus-indicator-thickness)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1);pointer-events:none;position:absolute}#button:active{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-active,var(--spectrum-picker-background-color-active)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-active,var(--spectrum-picker-border-color-active)\n)\n)}#button:active:after{border-color:#0000}#button:active.placeholder .label{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}#button.focus-visible,#button.is-keyboardFocused{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.is-keyboardFocused,#button:focus-visible{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible:after,#button.is-keyboardFocused:after{border-color:var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n)}#button.is-keyboardFocused:after,#button:focus-visible:after{border-color:var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n)}#button.focus-visible.placeholder,#button.is-keyboardFocused.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.is-keyboardFocused.placeholder,#button:focus-visible.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible .picker,#button.is-keyboardFocused .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button.is-keyboardFocused .picker,#button:focus-visible .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-default,var(--spectrum-picker-border-color-error-default)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-error,var(--spectrum-picker-icon-color-error)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-active,var(--spectrum-picker-border-color-error-active)\n)\n)}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-default-open,var(--spectrum-picker-border-color-error-default-open)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled).focus-visible,:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused,:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}#button.is-loading .picker{color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)\n)\n)}#button:disabled,:host([disabled]) #button{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-disabled,var(--spectrum-picker-background-color-disabled)\n)\n);border-color:var(--highcontrast-picker-border-color-disabled,transparent);color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)\n)\n);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(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)\n)\n)}#button:disabled .label.placeholder,:host([disabled]) #button .label.placeholder{color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)\n)\n)}.icon{flex-shrink:0;margin-inline-end:var(\n--mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)\n)}:host([open]) #button:not(.spectrum-Picker--quiet){background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-default-open,var(--spectrum-picker-background-color-default-open)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-default-open,var(--spectrum-picker-border-color-default-open)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default-open,var(--spectrum-picker-font-color-default-open)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet) .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-default-open,var(--spectrum-picker-icon-color-default-open)\n)\n)}.label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));font-weight:var(\n--mod-picker-font-weight,var(--spectrum-picker-font-weight)\n);line-height:var(\n--mod-picker-line-height,var(--spectrum-picker-line-height)\n);margin-block-end:calc(var(\n--mod-picker-spacing-bottom-to-text,\nvar(--spectrum-picker-spacing-bottom-to-text)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:var(\n--mod-picker-spacing-top-to-text,var(--spectrum-picker-spacing-top-to-text)\n);overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap}.label.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);font-style:var(\n--mod-picker-placeholder-font-style,var(--spectrum-picker-placeholder-font-style)\n);font-weight:var(\n--mod-picker-placeholder-font-weight,var(--spectrum-picker-font-weight)\n);transition:color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-in-out}.label.placeholder:active{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}.picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-default,var(--spectrum-picker-icon-color-default)\n)\n);display:inline-block;flex-shrink:0;margin-block:var(\n--mod-picker-spacing-top-to-disclosure-icon,var(--spectrum-picker-spacing-top-to-disclosure-icon)\n);margin-inline-start:var(\n--mod-picker-spacing-icon-to-disclosure-icon,var(--spectrum-picker-spacing-icon-to-disclosure-icon)\n);position:relative;transition:color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-out;vertical-align:top}.picker:active{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-active,var(--spectrum-picker-icon-color-active)\n)\n)}#button .spectrum-ProgressCircle,.validation-icon{margin-inline-start:var(\n--mod-picker-spacing-text-to-alert-icon-inline-start,var(--spectrum-picker-spacing-text-to-alert-icon-inline-start)\n)}.validation-icon{margin-block-end:calc(var(\n--mod-picker-spacing-top-to-alert-icon,\nvar(--spectrum-picker-spacing-top-to-alert-icon)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:calc(var(\n--mod-picker-spacing-top-to-alert-icon,\nvar(--spectrum-picker-spacing-top-to-alert-icon)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)))}#button .spectrum-ProgressCircle{margin-block-end:calc(var(\n--mod-picker-spacing-top-to-progress-circle,\nvar(--spectrum-picker-spacing-top-to-progress-circle)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:calc(var(\n--mod-picker-spacing-top-to-progress-circle,\nvar(--spectrum-picker-spacing-top-to-progress-circle)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)))}.label~.picker{margin-inline-start:var(\n--mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)\n)}:host([quiet]) #button{background-color:var(--highcontrast-picker-background-color,transparent);border:none;border-radius:0;color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);inline-size:auto;margin-block-start:calc(var(\n--mod-picker-spacing-label-to-picker-quiet,\nvar(--spectrum-picker-spacing-label-to-picker-quiet)\n) + 1px);min-inline-size:0;padding-inline:var(\n--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)\n)}: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(\n--mod-picker-spacing-edge-to-disclosure-icon-quiet,var(--spectrum-picker-spacing-edge-to-disclosure-icon-quiet)\n)}:host([quiet]) #button:after{block-size:auto;border:none;inline-size:auto}@media (hover:hover){#button:hover .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)\n)\n)}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet):hover .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)\n)\n)}.label.placeholder:hover{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#button:hover{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)\n)\n);border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet):hover{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-hover-open,var(--spectrum-picker-background-color-hover-open)\n)\n);border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)\n)\n)}:host([quiet]) #button:hover{background-color:var(\n--highcontrast-picker-background-color,transparent\n)}}: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(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n) 0 0 var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n);margin:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1) 0}:host([quiet]) #button.is-keyboardFocused:after,:host([quiet]) #button:focus-visible:after{border:none;border-radius:0;box-shadow:0 var(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n) 0 0 var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n);margin:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-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(\n--system-spectrum-picker-background-color-default\n);--spectrum-picker-background-color-default-open:var(\n--system-spectrum-picker-background-color-default-open\n);--spectrum-picker-background-color-active:var(\n--system-spectrum-picker-background-color-active\n);--spectrum-picker-background-color-hover:var(\n--system-spectrum-picker-background-color-hover\n);--spectrum-picker-background-color-hover-open:var(\n--system-spectrum-picker-background-color-hover-open\n);--spectrum-picker-background-color-key-focus:var(\n--system-spectrum-picker-background-color-key-focus\n);--spectrum-picker-border-color-default:var(\n--system-spectrum-picker-border-color-default\n);--spectrum-picker-border-color-default-open:var(\n--system-spectrum-picker-border-color-default-open\n);--spectrum-picker-border-color-hover:var(\n--system-spectrum-picker-border-color-hover\n);--spectrum-picker-border-color-hover-open:var(\n--system-spectrum-picker-border-color-hover-open\n);--spectrum-picker-border-color-active:var(\n--system-spectrum-picker-border-color-active\n);--spectrum-picker-border-color-key-focus:var(\n--system-spectrum-picker-border-color-key-focus\n);--spectrum-picker-border-width:var(--system-spectrum-picker-border-width)}:host{display:inline-flex;inline-size:var(\n--spectrum-picker-width,var(--spectrum-global-dimension-size-2400)\n);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(\n--spectrum-picker-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)\n)}#label.visually-hidden~.picker{margin-inline-start:auto}:host([focused]:not([quiet])) #button .picker{color:var(\n--spectrum-picker-icon-color-key-focus,var(--spectrum-alias-icon-color-focus)\n)}.visually-hidden{border:0;clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}sp-overlay:not(:defined){display:none}\n`;\nexport default styles;"],
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n#button{-webkit-appearance:button;cursor:pointer;font-family:var(\n--mod-button-font-family,var(\n--mod-sans-font-family-stack,var(--spectrum-sans-font-family-stack)\n)\n);line-height:var(\n--mod-button-line-height,var(--mod-line-height-100,var(--spectrum-line-height-100))\n);text-transform:none;transition:background var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,border-color var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,color var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,box-shadow var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;display:inline-flex;justify-content:center;margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none}#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(\n--spectrum-default-font-style\n);--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(\n--spectrum-component-top-to-text-100\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-100\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-100\n);--spectrum-picker-spacing-edge-to-text-quiet:var(\n--spectrum-field-edge-to-text-quiet\n);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-component-top-to-text-100\n);--spectrum-picker-spacing-label-to-picker:var(\n--spectrum-field-label-to-component\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-100);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-medium\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-medium\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-medium\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-medium\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-medium\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon-quiet:var(\n--spectrum-picker-end-edge-to-disclousure-icon-quiet\n);--spectrum-picker-animation-duration:var(\n--spectrum-animation-duration-100\n);--spectrum-picker-font-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-picker-font-color-default-open:var(\n--spectrum-neutral-content-color-focus\n);--spectrum-picker-font-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-picker-font-color-hover-open:var(\n--spectrum-neutral-content-color-focus-hover\n);--spectrum-picker-font-color-active:var(\n--spectrum-neutral-content-color-down\n);--spectrum-picker-font-color-key-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-picker-icon-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-picker-icon-color-default-open:var(\n--spectrum-neutral-content-color-focus\n);--spectrum-picker-icon-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-picker-icon-color-hover-open:var(\n--spectrum-neutral-content-color-focus-hover\n);--spectrum-picker-icon-color-active:var(\n--spectrum-neutral-content-color-down\n);--spectrum-picker-icon-color-key-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-picker-border-color-error-default:var(\n--spectrum-negative-border-color-default\n);--spectrum-picker-border-color-error-default-open:var(\n--spectrum-negative-border-color-focus\n);--spectrum-picker-border-color-error-hover:var(\n--spectrum-negative-border-color-hover\n);--spectrum-picker-border-color-error-hover-open:var(\n--spectrum-negative-border-color-focus-hover\n);--spectrum-picker-border-color-error-active:var(\n--spectrum-negative-border-color-down\n);--spectrum-picker-border-color-error-key-focus:var(\n--spectrum-negative-border-color-key-focus\n);--spectrum-picker-icon-color-error:var(--spectrum-negative-visual-color);--spectrum-picker-background-color-disabled:var(\n--spectrum-disabled-background-color\n);--spectrum-picker-font-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-picker-icon-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-picker-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-picker-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-picker-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n)}:host([size=s]){--spectrum-picker-font-size:var(--spectrum-font-size-75);--spectrum-picker-block-size:var(--spectrum-component-height-75);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-component-top-to-text-75\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-75\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-75\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-75);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-small\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-small\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-small\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-small\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-small\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-75\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-75\n)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-component-top-to-text-200\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-200\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-200\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-200);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-large\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-large\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-large\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-large\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-large\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-200\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-200\n)}:host([size=xl]){--spectrum-picker-font-size:var(--spectrum-font-size-300);--spectrum-picker-block-size:var(--spectrum-component-height-300);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-component-top-to-text-300\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-300\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-300\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-300);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-extra-large\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-extra-large\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-extra-large\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-extra-large\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-extra-large\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-300\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-300\n)}@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 .label,#button:after{forced-color-adjust:none}}#button{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-default,var(--spectrum-picker-background-color-default)\n)\n);block-size:var(--mod-picker-block-size,var(--spectrum-picker-block-size));border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-default,var(--spectrum-picker-border-color-default)\n)\n);border-radius:var(\n--mod-picker-border-radius,var(--spectrum-picker-border-radius)\n);border-style:solid;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);box-sizing:border-box;color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);display:flex;inline-size:var(\n--mod-picker-inline-size,var(--spectrum-picker-inline-size)\n);margin-block-start:var(\n--mod-picker-spacing-label-to-picker,var(--spectrum-picker-spacing-label-to-picker)\n);max-inline-size:100%;min-inline-size:calc(var(--spectrum-picker-minimum-width-multiplier)*var(--mod-picker-block-size, var(--spectrum-picker-block-size)));padding-block:0;padding-inline-end:var(\n--mod-picker-spacing-edge-to-disclosure-icon,var(--spectrum-picker-spacing-edge-to-disclosure-icon)\n);padding-inline-start:var(\n--mod-picker-spacing-edge-to-text,var(--spectrum-picker-spacing-edge-to-text)\n);transition:background-color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n),box-shadow var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n),border-color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-in-out}#button:after{block-size:calc(100% + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n)*2 + var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);border-color:#0000;border-radius:calc(var(--mod-picker-border-radius, var(--spectrum-picker-border-radius)) + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(--mod-picker-border-width, var(--spectrum-picker-border-width)));border-style:solid;border-width:var(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n);content:\"\";inline-size:calc(100% + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n)*2 + var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);inset-block:0;inset-inline:0;margin-block-start:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-focus-indicator-thickness,\nvar(--spectrum-picker-focus-indicator-thickness)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1);margin-inline-start:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-focus-indicator-thickness,\nvar(--spectrum-picker-focus-indicator-thickness)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1);pointer-events:none;position:absolute}#button:active{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-active,var(--spectrum-picker-background-color-active)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-active,var(--spectrum-picker-border-color-active)\n)\n)}#button:active:after{border-color:#0000}#button:active.placeholder .label{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}#button.focus-visible,#button.is-keyboardFocused{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.is-keyboardFocused,#button:focus-visible{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible:after,#button.is-keyboardFocused:after{border-color:var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n)}#button.is-keyboardFocused:after,#button:focus-visible:after{border-color:var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n)}#button.focus-visible.placeholder,#button.is-keyboardFocused.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.is-keyboardFocused.placeholder,#button:focus-visible.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible .picker,#button.is-keyboardFocused .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button.is-keyboardFocused .picker,#button:focus-visible .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-default,var(--spectrum-picker-border-color-error-default)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-error,var(--spectrum-picker-icon-color-error)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-active,var(--spectrum-picker-border-color-error-active)\n)\n)}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-default-open,var(--spectrum-picker-border-color-error-default-open)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled).focus-visible,:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused,:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}#button.is-loading .picker{color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)\n)\n)}#button:disabled,:host([disabled]) #button{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-disabled,var(--spectrum-picker-background-color-disabled)\n)\n);border-color:var(--highcontrast-picker-border-color-disabled,transparent);color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)\n)\n);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(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)\n)\n)}#button:disabled .label.placeholder,:host([disabled]) #button .label.placeholder{color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)\n)\n)}.icon{flex-shrink:0;margin-inline-end:var(\n--mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)\n)}:host([open]) #button:not(.spectrum-Picker--quiet){background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-default-open,var(--spectrum-picker-background-color-default-open)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-default-open,var(--spectrum-picker-border-color-default-open)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default-open,var(--spectrum-picker-font-color-default-open)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet) .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-default-open,var(--spectrum-picker-icon-color-default-open)\n)\n)}.label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));font-weight:var(\n--mod-picker-font-weight,var(--spectrum-picker-font-weight)\n);line-height:var(\n--mod-picker-line-height,var(--spectrum-picker-line-height)\n);margin-block-end:calc(var(\n--mod-picker-spacing-bottom-to-text,\nvar(--spectrum-picker-spacing-bottom-to-text)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:var(\n--mod-picker-spacing-top-to-text,var(--spectrum-picker-spacing-top-to-text)\n);overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap}.label.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);font-style:var(\n--mod-picker-placeholder-font-style,var(--spectrum-picker-placeholder-font-style)\n);font-weight:var(\n--mod-picker-placeholder-font-weight,var(--spectrum-picker-font-weight)\n);transition:color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-in-out}.label.placeholder:active{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}.picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-default,var(--spectrum-picker-icon-color-default)\n)\n);display:inline-block;flex-shrink:0;margin-block:var(\n--mod-picker-spacing-top-to-disclosure-icon,var(--spectrum-picker-spacing-top-to-disclosure-icon)\n);margin-inline-start:var(\n--mod-picker-spacing-icon-to-disclosure-icon,var(--spectrum-picker-spacing-icon-to-disclosure-icon)\n);position:relative;transition:color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-out;vertical-align:top}.picker:active{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-active,var(--spectrum-picker-icon-color-active)\n)\n)}#button .spectrum-ProgressCircle,.validation-icon{margin-inline-start:var(\n--mod-picker-spacing-text-to-alert-icon-inline-start,var(--spectrum-picker-spacing-text-to-alert-icon-inline-start)\n)}.validation-icon{margin-block-end:calc(var(\n--mod-picker-spacing-top-to-alert-icon,\nvar(--spectrum-picker-spacing-top-to-alert-icon)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:calc(var(\n--mod-picker-spacing-top-to-alert-icon,\nvar(--spectrum-picker-spacing-top-to-alert-icon)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)))}#button .spectrum-ProgressCircle{margin-block-end:calc(var(\n--mod-picker-spacing-top-to-progress-circle,\nvar(--spectrum-picker-spacing-top-to-progress-circle)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:calc(var(\n--mod-picker-spacing-top-to-progress-circle,\nvar(--spectrum-picker-spacing-top-to-progress-circle)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)))}.label~.picker{margin-inline-start:var(\n--mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)\n)}:host([quiet]) #button{background-color:var(--highcontrast-picker-background-color,transparent);border:none;border-radius:0;color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);inline-size:auto;margin-block-start:calc(var(\n--mod-picker-spacing-label-to-picker-quiet,\nvar(--spectrum-picker-spacing-label-to-picker-quiet)\n) + 1px);min-inline-size:0;padding-inline:var(\n--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)\n)}:host([quiet]) #button.spectrum-Picker--sideLabel{margin-block-start:0}:host([quiet]) #button .picker{margin-inline-end:var(\n--mod-picker-spacing-edge-to-disclosure-icon-quiet,var(--spectrum-picker-spacing-edge-to-disclosure-icon-quiet)\n)}:host([quiet]) #button:after{block-size:auto;border:none;inline-size:auto}@media (hover:hover){#button:hover .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)\n)\n)}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet):hover .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)\n)\n)}.label.placeholder:hover{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#button:hover{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)\n)\n);border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet):hover{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-hover-open,var(--spectrum-picker-background-color-hover-open)\n)\n);border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)\n)\n)}:host([quiet]) #button:hover{background-color:var(\n--highcontrast-picker-background-color,transparent\n)}}: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(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n) 0 0 var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n);margin:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1) 0}:host([quiet]) #button.is-keyboardFocused:after,:host([quiet]) #button:focus-visible:after{border:none;border-radius:0;box-shadow:0 var(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n) 0 0 var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n);margin:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1) 0}:host([quiet]) #button:active,:host([quiet]) #button:disabled,:host([quiet][disabled]) #button,:host([quiet][open]) #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(\n--system-spectrum-picker-background-color-default\n);--spectrum-picker-background-color-default-open:var(\n--system-spectrum-picker-background-color-default-open\n);--spectrum-picker-background-color-active:var(\n--system-spectrum-picker-background-color-active\n);--spectrum-picker-background-color-hover:var(\n--system-spectrum-picker-background-color-hover\n);--spectrum-picker-background-color-hover-open:var(\n--system-spectrum-picker-background-color-hover-open\n);--spectrum-picker-background-color-key-focus:var(\n--system-spectrum-picker-background-color-key-focus\n);--spectrum-picker-border-color-default:var(\n--system-spectrum-picker-border-color-default\n);--spectrum-picker-border-color-default-open:var(\n--system-spectrum-picker-border-color-default-open\n);--spectrum-picker-border-color-hover:var(\n--system-spectrum-picker-border-color-hover\n);--spectrum-picker-border-color-hover-open:var(\n--system-spectrum-picker-border-color-hover-open\n);--spectrum-picker-border-color-active:var(\n--system-spectrum-picker-border-color-active\n);--spectrum-picker-border-color-key-focus:var(\n--system-spectrum-picker-border-color-key-focus\n);--spectrum-picker-border-width:var(--system-spectrum-picker-border-width)}:host{display:inline-flex;inline-size:var(\n--mod-picker-inline-size,var(--spectrum-picker-inline-size)\n);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}:host([disabled]){pointer-events:none}#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(\n--spectrum-picker-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)\n)}#label.visually-hidden~.picker{margin-inline-start:auto}:host([focused]:not([quiet])) #button .picker{color:var(\n--spectrum-picker-icon-color-key-focus,var(--spectrum-alias-icon-color-focus)\n)}.visually-hidden{border:0;clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}sp-overlay:not(:defined){display:none}\n`;\nexport default styles;"],
|
|
5
5
|
"mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkgBf,eAAe;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/picker.css.js
CHANGED
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
);--spectrum-picker-spacing-edge-to-text-quiet:var(
|
|
33
33
|
--spectrum-field-edge-to-text-quiet
|
|
34
34
|
);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(
|
|
35
|
-
--spectrum-
|
|
35
|
+
--spectrum-component-top-to-text-100
|
|
36
36
|
);--spectrum-picker-spacing-label-to-picker:var(
|
|
37
37
|
--spectrum-field-label-to-component
|
|
38
38
|
);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-100);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
--spectrum-field-end-edge-to-disclosure-icon-100
|
|
52
52
|
);--spectrum-picker-spacing-edge-to-disclosure-icon-quiet:var(
|
|
53
53
|
--spectrum-picker-end-edge-to-disclousure-icon-quiet
|
|
54
|
-
)
|
|
54
|
+
);--spectrum-picker-animation-duration:var(
|
|
55
55
|
--spectrum-animation-duration-100
|
|
56
56
|
);--spectrum-picker-font-color-default:var(
|
|
57
57
|
--spectrum-neutral-content-color-default
|
|
@@ -100,7 +100,7 @@
|
|
|
100
100
|
);--spectrum-picker-focus-indicator-color:var(
|
|
101
101
|
--spectrum-focus-indicator-color
|
|
102
102
|
)}:host([size=s]){--spectrum-picker-font-size:var(--spectrum-font-size-75);--spectrum-picker-block-size:var(--spectrum-component-height-75);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(
|
|
103
|
-
--spectrum-
|
|
103
|
+
--spectrum-component-top-to-text-75
|
|
104
104
|
);--spectrum-picker-spacing-top-to-text:var(
|
|
105
105
|
--spectrum-component-top-to-text-75
|
|
106
106
|
);--spectrum-picker-spacing-bottom-to-text:var(
|
|
@@ -122,7 +122,7 @@
|
|
|
122
122
|
);--spectrum-picker-spacing-edge-to-disclosure-icon:var(
|
|
123
123
|
--spectrum-field-end-edge-to-disclosure-icon-75
|
|
124
124
|
)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(
|
|
125
|
-
--spectrum-
|
|
125
|
+
--spectrum-component-top-to-text-200
|
|
126
126
|
);--spectrum-picker-spacing-top-to-text:var(
|
|
127
127
|
--spectrum-component-top-to-text-200
|
|
128
128
|
);--spectrum-picker-spacing-bottom-to-text:var(
|
|
@@ -144,7 +144,7 @@
|
|
|
144
144
|
);--spectrum-picker-spacing-edge-to-disclosure-icon:var(
|
|
145
145
|
--spectrum-field-end-edge-to-disclosure-icon-200
|
|
146
146
|
)}:host([size=xl]){--spectrum-picker-font-size:var(--spectrum-font-size-300);--spectrum-picker-block-size:var(--spectrum-component-height-300);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(
|
|
147
|
-
--spectrum-
|
|
147
|
+
--spectrum-component-top-to-text-300
|
|
148
148
|
);--spectrum-picker-spacing-top-to-text:var(
|
|
149
149
|
--spectrum-component-top-to-text-300
|
|
150
150
|
);--spectrum-picker-spacing-bottom-to-text:var(
|
|
@@ -165,7 +165,7 @@
|
|
|
165
165
|
--spectrum-field-top-to-disclosure-icon-300
|
|
166
166
|
);--spectrum-picker-spacing-edge-to-disclosure-icon:var(
|
|
167
167
|
--spectrum-field-end-edge-to-disclosure-icon-300
|
|
168
|
-
)}@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
|
|
168
|
+
)}@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 .label,#button:after{forced-color-adjust:none}}#button{background-color:var(
|
|
169
169
|
--highcontrast-picker-background-color,var(
|
|
170
170
|
--mod-picker-background-color-default,var(--spectrum-picker-background-color-default)
|
|
171
171
|
)
|
|
@@ -408,7 +408,7 @@ var(--spectrum-picker-spacing-top-to-progress-circle)
|
|
|
408
408
|
var(--spectrum-picker-spacing-label-to-picker-quiet)
|
|
409
409
|
) + 1px);min-inline-size:0;padding-inline:var(
|
|
410
410
|
--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)
|
|
411
|
-
)}:host([quiet]) #button.spectrum-Picker--sideLabel{margin-block-start:
|
|
411
|
+
)}:host([quiet]) #button.spectrum-Picker--sideLabel{margin-block-start:0}:host([quiet]) #button .picker{margin-inline-end:var(
|
|
412
412
|
--mod-picker-spacing-edge-to-disclosure-icon-quiet,var(--spectrum-picker-spacing-edge-to-disclosure-icon-quiet)
|
|
413
413
|
)}:host([quiet]) #button:after{block-size:auto;border:none;inline-size:auto}@media (hover:hover){#button:hover .picker{color:var(
|
|
414
414
|
--highcontrast-picker-content-color-default,var(
|
|
@@ -480,7 +480,7 @@ var(--spectrum-picker-focus-indicator-gap)
|
|
|
480
480
|
) + var(
|
|
481
481
|
--mod-picker-border-width,
|
|
482
482
|
var(--spectrum-picker-border-width)
|
|
483
|
-
))*-1) 0}:host([quiet]) #button:active,:host([quiet]
|
|
483
|
+
))*-1) 0}:host([quiet]) #button:active,:host([quiet]) #button:disabled,:host([quiet][disabled]) #button,:host([quiet][open]) #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(
|
|
484
484
|
--system-spectrum-picker-background-color-default
|
|
485
485
|
);--spectrum-picker-background-color-default-open:var(
|
|
486
486
|
--system-spectrum-picker-background-color-default-open
|
|
@@ -505,8 +505,8 @@ var(--spectrum-picker-border-width)
|
|
|
505
505
|
);--spectrum-picker-border-color-key-focus:var(
|
|
506
506
|
--system-spectrum-picker-border-color-key-focus
|
|
507
507
|
);--spectrum-picker-border-width:var(--system-spectrum-picker-border-width)}:host{display:inline-flex;inline-size:var(
|
|
508
|
-
--
|
|
509
|
-
);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(
|
|
508
|
+
--mod-picker-inline-size,var(--spectrum-picker-inline-size)
|
|
509
|
+
);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}:host([disabled]){pointer-events:none}#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(
|
|
510
510
|
--spectrum-picker-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)
|
|
511
511
|
)}#label.visually-hidden~.picker{margin-inline-start:auto}:host([focused]:not([quiet])) #button .picker{color:var(
|
|
512
512
|
--spectrum-picker-icon-color-key-focus,var(--spectrum-alias-icon-color-focus)
|
package/src/picker.css.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["picker.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n#button{-webkit-appearance:button;cursor:pointer;font-family:var(\n--mod-button-font-family,var(\n--mod-sans-font-family-stack,var(--spectrum-sans-font-family-stack)\n)\n);line-height:var(\n--mod-button-line-height,var(--mod-line-height-100,var(--spectrum-line-height-100))\n);text-transform:none;transition:background var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,border-color var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,color var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,box-shadow var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;display:inline-flex;justify-content:center;margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none}#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(\n--spectrum-default-font-style\n);--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(\n--spectrum-component-top-to-text-100\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-100\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-100\n);--spectrum-picker-spacing-edge-to-text-quiet:var(\n--spectrum-field-edge-to-text-quiet\n);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-field-label-top-margin-medium\n);--spectrum-picker-spacing-label-to-picker:var(\n--spectrum-field-label-to-component\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-100);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-medium\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-medium\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-medium\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-medium\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-medium\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon-quiet:var(\n--spectrum-picker-end-edge-to-disclousure-icon-quiet\n)}:host{--spectrum-picker-animation-duration:var(\n--spectrum-animation-duration-100\n);--spectrum-picker-font-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-picker-font-color-default-open:var(\n--spectrum-neutral-content-color-focus\n);--spectrum-picker-font-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-picker-font-color-hover-open:var(\n--spectrum-neutral-content-color-focus-hover\n);--spectrum-picker-font-color-active:var(\n--spectrum-neutral-content-color-down\n);--spectrum-picker-font-color-key-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-picker-icon-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-picker-icon-color-default-open:var(\n--spectrum-neutral-content-color-focus\n);--spectrum-picker-icon-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-picker-icon-color-hover-open:var(\n--spectrum-neutral-content-color-focus-hover\n);--spectrum-picker-icon-color-active:var(\n--spectrum-neutral-content-color-down\n);--spectrum-picker-icon-color-key-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-picker-border-color-error-default:var(\n--spectrum-negative-border-color-default\n);--spectrum-picker-border-color-error-default-open:var(\n--spectrum-negative-border-color-focus\n);--spectrum-picker-border-color-error-hover:var(\n--spectrum-negative-border-color-hover\n);--spectrum-picker-border-color-error-hover-open:var(\n--spectrum-negative-border-color-focus-hover\n);--spectrum-picker-border-color-error-active:var(\n--spectrum-negative-border-color-down\n);--spectrum-picker-border-color-error-key-focus:var(\n--spectrum-negative-border-color-key-focus\n);--spectrum-picker-icon-color-error:var(--spectrum-negative-visual-color);--spectrum-picker-background-color-disabled:var(\n--spectrum-disabled-background-color\n);--spectrum-picker-font-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-picker-icon-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-picker-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-picker-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-picker-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n)}:host([size=s]){--spectrum-picker-font-size:var(--spectrum-font-size-75);--spectrum-picker-block-size:var(--spectrum-component-height-75);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-field-label-top-margin-small\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-75\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-75\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-75);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-small\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-small\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-small\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-small\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-small\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-75\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-75\n)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-field-label-top-margin-large\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-200\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-200\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-200);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-large\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-large\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-large\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-large\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-large\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-200\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-200\n)}:host([size=xl]){--spectrum-picker-font-size:var(--spectrum-font-size-300);--spectrum-picker-block-size:var(--spectrum-component-height-300);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-field-label-top-margin-extra-large\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-300\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-300\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-300);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-extra-large\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-extra-large\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-extra-large\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-extra-large\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-extra-large\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-300\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-300\n)}@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(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-default,var(--spectrum-picker-background-color-default)\n)\n);block-size:var(--mod-picker-block-size,var(--spectrum-picker-block-size));border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-default,var(--spectrum-picker-border-color-default)\n)\n);border-radius:var(\n--mod-picker-border-radius,var(--spectrum-picker-border-radius)\n);border-style:solid;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);box-sizing:border-box;color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);display:flex;inline-size:var(\n--mod-picker-inline-size,var(--spectrum-picker-inline-size)\n);margin-block-start:var(\n--mod-picker-spacing-label-to-picker,var(--spectrum-picker-spacing-label-to-picker)\n);max-inline-size:100%;min-inline-size:calc(var(--spectrum-picker-minimum-width-multiplier)*var(--mod-picker-block-size, var(--spectrum-picker-block-size)));padding-block:0;padding-inline-end:var(\n--mod-picker-spacing-edge-to-disclosure-icon,var(--spectrum-picker-spacing-edge-to-disclosure-icon)\n);padding-inline-start:var(\n--mod-picker-spacing-edge-to-text,var(--spectrum-picker-spacing-edge-to-text)\n);transition:background-color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n),box-shadow var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n),border-color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-in-out}#button:after{block-size:calc(100% + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n)*2 + var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);border-color:#0000;border-radius:calc(var(--mod-picker-border-radius, var(--spectrum-picker-border-radius)) + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(--mod-picker-border-width, var(--spectrum-picker-border-width)));border-style:solid;border-width:var(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n);content:\"\";inline-size:calc(100% + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n)*2 + var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);inset-block:0;inset-inline:0;margin-block-start:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-focus-indicator-thickness,\nvar(--spectrum-picker-focus-indicator-thickness)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1);margin-inline-start:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-focus-indicator-thickness,\nvar(--spectrum-picker-focus-indicator-thickness)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1);pointer-events:none;position:absolute}#button:active{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-active,var(--spectrum-picker-background-color-active)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-active,var(--spectrum-picker-border-color-active)\n)\n)}#button:active:after{border-color:#0000}#button:active.placeholder .label{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}#button.focus-visible,#button.is-keyboardFocused{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.is-keyboardFocused,#button:focus-visible{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible:after,#button.is-keyboardFocused:after{border-color:var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n)}#button.is-keyboardFocused:after,#button:focus-visible:after{border-color:var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n)}#button.focus-visible.placeholder,#button.is-keyboardFocused.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.is-keyboardFocused.placeholder,#button:focus-visible.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible .picker,#button.is-keyboardFocused .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button.is-keyboardFocused .picker,#button:focus-visible .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-default,var(--spectrum-picker-border-color-error-default)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-error,var(--spectrum-picker-icon-color-error)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-active,var(--spectrum-picker-border-color-error-active)\n)\n)}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-default-open,var(--spectrum-picker-border-color-error-default-open)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled).focus-visible,:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused,:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}#button.is-loading .picker{color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)\n)\n)}#button:disabled,:host([disabled]) #button{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-disabled,var(--spectrum-picker-background-color-disabled)\n)\n);border-color:var(--highcontrast-picker-border-color-disabled,transparent);color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)\n)\n);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(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)\n)\n)}#button:disabled .label.placeholder,:host([disabled]) #button .label.placeholder{color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)\n)\n)}.icon{flex-shrink:0;margin-inline-end:var(\n--mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)\n)}:host([open]) #button:not(.spectrum-Picker--quiet){background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-default-open,var(--spectrum-picker-background-color-default-open)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-default-open,var(--spectrum-picker-border-color-default-open)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default-open,var(--spectrum-picker-font-color-default-open)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet) .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-default-open,var(--spectrum-picker-icon-color-default-open)\n)\n)}.label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));font-weight:var(\n--mod-picker-font-weight,var(--spectrum-picker-font-weight)\n);line-height:var(\n--mod-picker-line-height,var(--spectrum-picker-line-height)\n);margin-block-end:calc(var(\n--mod-picker-spacing-bottom-to-text,\nvar(--spectrum-picker-spacing-bottom-to-text)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:var(\n--mod-picker-spacing-top-to-text,var(--spectrum-picker-spacing-top-to-text)\n);overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap}.label.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);font-style:var(\n--mod-picker-placeholder-font-style,var(--spectrum-picker-placeholder-font-style)\n);font-weight:var(\n--mod-picker-placeholder-font-weight,var(--spectrum-picker-font-weight)\n);transition:color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-in-out}.label.placeholder:active{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}.picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-default,var(--spectrum-picker-icon-color-default)\n)\n);display:inline-block;flex-shrink:0;margin-block:var(\n--mod-picker-spacing-top-to-disclosure-icon,var(--spectrum-picker-spacing-top-to-disclosure-icon)\n);margin-inline-start:var(\n--mod-picker-spacing-icon-to-disclosure-icon,var(--spectrum-picker-spacing-icon-to-disclosure-icon)\n);position:relative;transition:color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-out;vertical-align:top}.picker:active{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-active,var(--spectrum-picker-icon-color-active)\n)\n)}#button .spectrum-ProgressCircle,.validation-icon{margin-inline-start:var(\n--mod-picker-spacing-text-to-alert-icon-inline-start,var(--spectrum-picker-spacing-text-to-alert-icon-inline-start)\n)}.validation-icon{margin-block-end:calc(var(\n--mod-picker-spacing-top-to-alert-icon,\nvar(--spectrum-picker-spacing-top-to-alert-icon)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:calc(var(\n--mod-picker-spacing-top-to-alert-icon,\nvar(--spectrum-picker-spacing-top-to-alert-icon)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)))}#button .spectrum-ProgressCircle{margin-block-end:calc(var(\n--mod-picker-spacing-top-to-progress-circle,\nvar(--spectrum-picker-spacing-top-to-progress-circle)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:calc(var(\n--mod-picker-spacing-top-to-progress-circle,\nvar(--spectrum-picker-spacing-top-to-progress-circle)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)))}.label~.picker{margin-inline-start:var(\n--mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)\n)}:host([quiet]) #button{background-color:var(--highcontrast-picker-background-color,transparent);border:none;border-radius:0;color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);inline-size:auto;margin-block-start:calc(var(\n--mod-picker-spacing-label-to-picker-quiet,\nvar(--spectrum-picker-spacing-label-to-picker-quiet)\n) + 1px);min-inline-size:0;padding-inline:var(\n--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)\n)}: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(\n--mod-picker-spacing-edge-to-disclosure-icon-quiet,var(--spectrum-picker-spacing-edge-to-disclosure-icon-quiet)\n)}:host([quiet]) #button:after{block-size:auto;border:none;inline-size:auto}@media (hover:hover){#button:hover .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)\n)\n)}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet):hover .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)\n)\n)}.label.placeholder:hover{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#button:hover{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)\n)\n);border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet):hover{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-hover-open,var(--spectrum-picker-background-color-hover-open)\n)\n);border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)\n)\n)}:host([quiet]) #button:hover{background-color:var(\n--highcontrast-picker-background-color,transparent\n)}}: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(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n) 0 0 var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n);margin:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1) 0}:host([quiet]) #button.is-keyboardFocused:after,:host([quiet]) #button:focus-visible:after{border:none;border-radius:0;box-shadow:0 var(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n) 0 0 var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n);margin:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-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(\n--system-spectrum-picker-background-color-default\n);--spectrum-picker-background-color-default-open:var(\n--system-spectrum-picker-background-color-default-open\n);--spectrum-picker-background-color-active:var(\n--system-spectrum-picker-background-color-active\n);--spectrum-picker-background-color-hover:var(\n--system-spectrum-picker-background-color-hover\n);--spectrum-picker-background-color-hover-open:var(\n--system-spectrum-picker-background-color-hover-open\n);--spectrum-picker-background-color-key-focus:var(\n--system-spectrum-picker-background-color-key-focus\n);--spectrum-picker-border-color-default:var(\n--system-spectrum-picker-border-color-default\n);--spectrum-picker-border-color-default-open:var(\n--system-spectrum-picker-border-color-default-open\n);--spectrum-picker-border-color-hover:var(\n--system-spectrum-picker-border-color-hover\n);--spectrum-picker-border-color-hover-open:var(\n--system-spectrum-picker-border-color-hover-open\n);--spectrum-picker-border-color-active:var(\n--system-spectrum-picker-border-color-active\n);--spectrum-picker-border-color-key-focus:var(\n--system-spectrum-picker-border-color-key-focus\n);--spectrum-picker-border-width:var(--system-spectrum-picker-border-width)}:host{display:inline-flex;inline-size:var(\n--spectrum-picker-width,var(--spectrum-global-dimension-size-2400)\n);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(\n--spectrum-picker-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)\n)}#label.visually-hidden~.picker{margin-inline-start:auto}:host([focused]:not([quiet])) #button .picker{color:var(\n--spectrum-picker-icon-color-key-focus,var(--spectrum-alias-icon-color-focus)\n)}.visually-hidden{border:0;clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}sp-overlay:not(:defined){display:none}\n`;\nexport default styles;"],
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n#button{-webkit-appearance:button;cursor:pointer;font-family:var(\n--mod-button-font-family,var(\n--mod-sans-font-family-stack,var(--spectrum-sans-font-family-stack)\n)\n);line-height:var(\n--mod-button-line-height,var(--mod-line-height-100,var(--spectrum-line-height-100))\n);text-transform:none;transition:background var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,border-color var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,color var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out,box-shadow var(\n--mod-button-animation-duration,var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n)\n) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;display:inline-flex;justify-content:center;margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none}#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(\n--spectrum-default-font-style\n);--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(\n--spectrum-component-top-to-text-100\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-100\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-100\n);--spectrum-picker-spacing-edge-to-text-quiet:var(\n--spectrum-field-edge-to-text-quiet\n);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-component-top-to-text-100\n);--spectrum-picker-spacing-label-to-picker:var(\n--spectrum-field-label-to-component\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-100);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-medium\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-medium\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-medium\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-medium\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-medium\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon-quiet:var(\n--spectrum-picker-end-edge-to-disclousure-icon-quiet\n);--spectrum-picker-animation-duration:var(\n--spectrum-animation-duration-100\n);--spectrum-picker-font-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-picker-font-color-default-open:var(\n--spectrum-neutral-content-color-focus\n);--spectrum-picker-font-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-picker-font-color-hover-open:var(\n--spectrum-neutral-content-color-focus-hover\n);--spectrum-picker-font-color-active:var(\n--spectrum-neutral-content-color-down\n);--spectrum-picker-font-color-key-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-picker-icon-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-picker-icon-color-default-open:var(\n--spectrum-neutral-content-color-focus\n);--spectrum-picker-icon-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-picker-icon-color-hover-open:var(\n--spectrum-neutral-content-color-focus-hover\n);--spectrum-picker-icon-color-active:var(\n--spectrum-neutral-content-color-down\n);--spectrum-picker-icon-color-key-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-picker-border-color-error-default:var(\n--spectrum-negative-border-color-default\n);--spectrum-picker-border-color-error-default-open:var(\n--spectrum-negative-border-color-focus\n);--spectrum-picker-border-color-error-hover:var(\n--spectrum-negative-border-color-hover\n);--spectrum-picker-border-color-error-hover-open:var(\n--spectrum-negative-border-color-focus-hover\n);--spectrum-picker-border-color-error-active:var(\n--spectrum-negative-border-color-down\n);--spectrum-picker-border-color-error-key-focus:var(\n--spectrum-negative-border-color-key-focus\n);--spectrum-picker-icon-color-error:var(--spectrum-negative-visual-color);--spectrum-picker-background-color-disabled:var(\n--spectrum-disabled-background-color\n);--spectrum-picker-font-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-picker-icon-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-picker-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-picker-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-picker-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n)}:host([size=s]){--spectrum-picker-font-size:var(--spectrum-font-size-75);--spectrum-picker-block-size:var(--spectrum-component-height-75);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-component-top-to-text-75\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-75\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-75\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-75\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-75);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-small\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-small\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-small\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-small\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-small\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-75\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-75\n)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-component-top-to-text-200\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-200\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-200\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-200\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-200);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-large\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-large\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-large\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-large\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-large\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-200\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-200\n)}:host([size=xl]){--spectrum-picker-font-size:var(--spectrum-font-size-300);--spectrum-picker-block-size:var(--spectrum-component-height-300);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(\n--spectrum-component-top-to-text-300\n);--spectrum-picker-spacing-top-to-text:var(\n--spectrum-component-top-to-text-300\n);--spectrum-picker-spacing-bottom-to-text:var(\n--spectrum-component-bottom-to-text-300\n);--spectrum-picker-spacing-edge-to-text:var(\n--spectrum-component-edge-to-text-300\n);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-300);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(\n--spectrum-field-text-to-alert-icon-extra-large\n);--spectrum-picker-spacing-icon-to-disclosure-icon:var(\n--spectrum-picker-visual-to-disclosure-icon-extra-large\n);--spectrum-picker-spacing-label-to-picker-quiet:var(\n--spectrum-field-label-to-component-quiet-extra-large\n);--spectrum-picker-spacing-top-to-alert-icon:var(\n--spectrum-field-top-to-alert-icon-extra-large\n);--spectrum-picker-spacing-top-to-progress-circle:var(\n--spectrum-field-top-to-progress-circle-extra-large\n);--spectrum-picker-spacing-top-to-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-300\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-end-edge-to-disclosure-icon-300\n)}@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 .label,#button:after{forced-color-adjust:none}}#button{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-default,var(--spectrum-picker-background-color-default)\n)\n);block-size:var(--mod-picker-block-size,var(--spectrum-picker-block-size));border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-default,var(--spectrum-picker-border-color-default)\n)\n);border-radius:var(\n--mod-picker-border-radius,var(--spectrum-picker-border-radius)\n);border-style:solid;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);box-sizing:border-box;color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);display:flex;inline-size:var(\n--mod-picker-inline-size,var(--spectrum-picker-inline-size)\n);margin-block-start:var(\n--mod-picker-spacing-label-to-picker,var(--spectrum-picker-spacing-label-to-picker)\n);max-inline-size:100%;min-inline-size:calc(var(--spectrum-picker-minimum-width-multiplier)*var(--mod-picker-block-size, var(--spectrum-picker-block-size)));padding-block:0;padding-inline-end:var(\n--mod-picker-spacing-edge-to-disclosure-icon,var(--spectrum-picker-spacing-edge-to-disclosure-icon)\n);padding-inline-start:var(\n--mod-picker-spacing-edge-to-text,var(--spectrum-picker-spacing-edge-to-text)\n);transition:background-color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n),box-shadow var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n),border-color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-in-out}#button:after{block-size:calc(100% + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n)*2 + var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);border-color:#0000;border-radius:calc(var(--mod-picker-border-radius, var(--spectrum-picker-border-radius)) + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(--mod-picker-border-width, var(--spectrum-picker-border-width)));border-style:solid;border-width:var(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n);content:\"\";inline-size:calc(100% + var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n)*2 + var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);inset-block:0;inset-inline:0;margin-block-start:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-focus-indicator-thickness,\nvar(--spectrum-picker-focus-indicator-thickness)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1);margin-inline-start:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-focus-indicator-thickness,\nvar(--spectrum-picker-focus-indicator-thickness)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1);pointer-events:none;position:absolute}#button:active{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-active,var(--spectrum-picker-background-color-active)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-active,var(--spectrum-picker-border-color-active)\n)\n)}#button:active:after{border-color:#0000}#button:active.placeholder .label{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}#button.focus-visible,#button.is-keyboardFocused{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.is-keyboardFocused,#button:focus-visible{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-key-focus,var(--spectrum-picker-background-color-key-focus)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible:after,#button.is-keyboardFocused:after{border-color:var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n)}#button.is-keyboardFocused:after,#button:focus-visible:after{border-color:var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n)}#button.focus-visible.placeholder,#button.is-keyboardFocused.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.is-keyboardFocused.placeholder,#button:focus-visible.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible .picker,#button.is-keyboardFocused .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button.is-keyboardFocused .picker,#button:focus-visible .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-default,var(--spectrum-picker-border-color-error-default)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-error,var(--spectrum-picker-icon-color-error)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-active,var(--spectrum-picker-border-color-error-active)\n)\n)}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-default-open,var(--spectrum-picker-border-color-error-default-open)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled).focus-visible,:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled).is-keyboardFocused,:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}#button.is-loading .picker{color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)\n)\n)}#button:disabled,:host([disabled]) #button{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-disabled,var(--spectrum-picker-background-color-disabled)\n)\n);border-color:var(--highcontrast-picker-border-color-disabled,transparent);color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)\n)\n);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(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-icon-color-disabled,var(--spectrum-picker-icon-color-disabled)\n)\n)}#button:disabled .label.placeholder,:host([disabled]) #button .label.placeholder{color:var(\n--highcontrast-picker-content-color-disabled,var(\n--mod-picker-font-color-disabled,var(--spectrum-picker-font-color-disabled)\n)\n)}.icon{flex-shrink:0;margin-inline-end:var(\n--mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)\n)}:host([open]) #button:not(.spectrum-Picker--quiet){background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-default-open,var(--spectrum-picker-background-color-default-open)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-default-open,var(--spectrum-picker-border-color-default-open)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default-open,var(--spectrum-picker-font-color-default-open)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet) .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-default-open,var(--spectrum-picker-icon-color-default-open)\n)\n)}.label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));font-weight:var(\n--mod-picker-font-weight,var(--spectrum-picker-font-weight)\n);line-height:var(\n--mod-picker-line-height,var(--spectrum-picker-line-height)\n);margin-block-end:calc(var(\n--mod-picker-spacing-bottom-to-text,\nvar(--spectrum-picker-spacing-bottom-to-text)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:var(\n--mod-picker-spacing-top-to-text,var(--spectrum-picker-spacing-top-to-text)\n);overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap}.label.placeholder{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);font-style:var(\n--mod-picker-placeholder-font-style,var(--spectrum-picker-placeholder-font-style)\n);font-weight:var(\n--mod-picker-placeholder-font-weight,var(--spectrum-picker-font-weight)\n);transition:color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-in-out}.label.placeholder:active{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}.picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-default,var(--spectrum-picker-icon-color-default)\n)\n);display:inline-block;flex-shrink:0;margin-block:var(\n--mod-picker-spacing-top-to-disclosure-icon,var(--spectrum-picker-spacing-top-to-disclosure-icon)\n);margin-inline-start:var(\n--mod-picker-spacing-icon-to-disclosure-icon,var(--spectrum-picker-spacing-icon-to-disclosure-icon)\n);position:relative;transition:color var(\n--mod-picker-animation-duration,var(--spectrum-picker-animation-duration)\n) ease-out;vertical-align:top}.picker:active{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-active,var(--spectrum-picker-icon-color-active)\n)\n)}#button .spectrum-ProgressCircle,.validation-icon{margin-inline-start:var(\n--mod-picker-spacing-text-to-alert-icon-inline-start,var(--spectrum-picker-spacing-text-to-alert-icon-inline-start)\n)}.validation-icon{margin-block-end:calc(var(\n--mod-picker-spacing-top-to-alert-icon,\nvar(--spectrum-picker-spacing-top-to-alert-icon)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:calc(var(\n--mod-picker-spacing-top-to-alert-icon,\nvar(--spectrum-picker-spacing-top-to-alert-icon)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)))}#button .spectrum-ProgressCircle{margin-block-end:calc(var(\n--mod-picker-spacing-top-to-progress-circle,\nvar(--spectrum-picker-spacing-top-to-progress-circle)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)));margin-block-start:calc(var(\n--mod-picker-spacing-top-to-progress-circle,\nvar(--spectrum-picker-spacing-top-to-progress-circle)\n) - var(--mod-picker-border-width, var(--spectrum-picker-border-width)))}.label~.picker{margin-inline-start:var(\n--mod-picker-spacing-text-to-icon,var(--spectrum-picker-spacing-text-to-icon)\n)}:host([quiet]) #button{background-color:var(--highcontrast-picker-background-color,transparent);border:none;border-radius:0;color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);inline-size:auto;margin-block-start:calc(var(\n--mod-picker-spacing-label-to-picker-quiet,\nvar(--spectrum-picker-spacing-label-to-picker-quiet)\n) + 1px);min-inline-size:0;padding-inline:var(\n--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)\n)}:host([quiet]) #button.spectrum-Picker--sideLabel{margin-block-start:0}:host([quiet]) #button .picker{margin-inline-end:var(\n--mod-picker-spacing-edge-to-disclosure-icon-quiet,var(--spectrum-picker-spacing-edge-to-disclosure-icon-quiet)\n)}:host([quiet]) #button:after{block-size:auto;border:none;inline-size:auto}@media (hover:hover){#button:hover .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)\n)\n)}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)\n)\n)}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet):hover .picker{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)\n)\n)}.label.placeholder:hover{color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#button:hover{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)\n)\n);border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}:host([open]) #button:not(.spectrum-Picker--quiet):hover{background-color:var(\n--highcontrast-picker-background-color,var(\n--mod-picker-background-color-hover-open,var(--spectrum-picker-background-color-hover-open)\n)\n);border-color:var(\n--highcontrast-picker-border-color-hover,var(\n--mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)\n)\n);color:var(\n--highcontrast-picker-content-color-default,var(\n--mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)\n)\n)}:host([quiet]) #button:hover{background-color:var(\n--highcontrast-picker-background-color,transparent\n)}}: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(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n) 0 0 var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n);margin:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1) 0}:host([quiet]) #button.is-keyboardFocused:after,:host([quiet]) #button:focus-visible:after{border:none;border-radius:0;box-shadow:0 var(\n--mod-picker-focus-indicator-thickness,var(--spectrum-picker-focus-indicator-thickness)\n) 0 0 var(\n--highcontrast-picker-focus-indicator-color,var(\n--mod-picker-focus-indicator-color,var(--spectrum-picker-focus-indicator-color)\n)\n);margin:calc((var(\n--mod-picker-focus-indicator-gap,\nvar(--spectrum-picker-focus-indicator-gap)\n) + var(\n--mod-picker-border-width,\nvar(--spectrum-picker-border-width)\n))*-1) 0}:host([quiet]) #button:active,:host([quiet]) #button:disabled,:host([quiet][disabled]) #button,:host([quiet][open]) #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(\n--system-spectrum-picker-background-color-default\n);--spectrum-picker-background-color-default-open:var(\n--system-spectrum-picker-background-color-default-open\n);--spectrum-picker-background-color-active:var(\n--system-spectrum-picker-background-color-active\n);--spectrum-picker-background-color-hover:var(\n--system-spectrum-picker-background-color-hover\n);--spectrum-picker-background-color-hover-open:var(\n--system-spectrum-picker-background-color-hover-open\n);--spectrum-picker-background-color-key-focus:var(\n--system-spectrum-picker-background-color-key-focus\n);--spectrum-picker-border-color-default:var(\n--system-spectrum-picker-border-color-default\n);--spectrum-picker-border-color-default-open:var(\n--system-spectrum-picker-border-color-default-open\n);--spectrum-picker-border-color-hover:var(\n--system-spectrum-picker-border-color-hover\n);--spectrum-picker-border-color-hover-open:var(\n--system-spectrum-picker-border-color-hover-open\n);--spectrum-picker-border-color-active:var(\n--system-spectrum-picker-border-color-active\n);--spectrum-picker-border-color-key-focus:var(\n--system-spectrum-picker-border-color-key-focus\n);--spectrum-picker-border-width:var(--system-spectrum-picker-border-width)}:host{display:inline-flex;inline-size:var(\n--mod-picker-inline-size,var(--spectrum-picker-inline-size)\n);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}:host([disabled]){pointer-events:none}#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(\n--spectrum-picker-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)\n)}#label.visually-hidden~.picker{margin-inline-start:auto}:host([focused]:not([quiet])) #button .picker{color:var(\n--spectrum-picker-icon-color-key-focus,var(--spectrum-alias-icon-color-focus)\n)}.visually-hidden{border:0;clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}sp-overlay:not(:defined){display:none}\n`;\nexport default styles;"],
|
|
5
5
|
"mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAkgBf,eAAeC",
|
|
6
6
|
"names": ["css", "styles"]
|
|
7
7
|
}
|
|
@@ -34,7 +34,7 @@ const styles = css`
|
|
|
34
34
|
);--spectrum-picker-spacing-edge-to-text-quiet:var(
|
|
35
35
|
--spectrum-field-edge-to-text-quiet
|
|
36
36
|
);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(
|
|
37
|
-
--spectrum-
|
|
37
|
+
--spectrum-component-top-to-text-100
|
|
38
38
|
);--spectrum-picker-spacing-label-to-picker:var(
|
|
39
39
|
--spectrum-field-label-to-component
|
|
40
40
|
);--spectrum-picker-spacing-text-to-icon:var(--spectrum-text-to-visual-100);--spectrum-picker-spacing-text-to-alert-icon-inline-start:var(
|
|
@@ -53,7 +53,7 @@ const styles = css`
|
|
|
53
53
|
--spectrum-field-end-edge-to-disclosure-icon-100
|
|
54
54
|
);--spectrum-picker-spacing-edge-to-disclosure-icon-quiet:var(
|
|
55
55
|
--spectrum-picker-end-edge-to-disclousure-icon-quiet
|
|
56
|
-
)
|
|
56
|
+
);--spectrum-picker-animation-duration:var(
|
|
57
57
|
--spectrum-animation-duration-100
|
|
58
58
|
);--spectrum-picker-font-color-default:var(
|
|
59
59
|
--spectrum-neutral-content-color-default
|
|
@@ -102,7 +102,7 @@ const styles = css`
|
|
|
102
102
|
);--spectrum-picker-focus-indicator-color:var(
|
|
103
103
|
--spectrum-focus-indicator-color
|
|
104
104
|
)}:host([size=s]){--spectrum-picker-font-size:var(--spectrum-font-size-75);--spectrum-picker-block-size:var(--spectrum-component-height-75);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(
|
|
105
|
-
--spectrum-
|
|
105
|
+
--spectrum-component-top-to-text-75
|
|
106
106
|
);--spectrum-picker-spacing-top-to-text:var(
|
|
107
107
|
--spectrum-component-top-to-text-75
|
|
108
108
|
);--spectrum-picker-spacing-bottom-to-text:var(
|
|
@@ -124,7 +124,7 @@ const styles = css`
|
|
|
124
124
|
);--spectrum-picker-spacing-edge-to-disclosure-icon:var(
|
|
125
125
|
--spectrum-field-end-edge-to-disclosure-icon-75
|
|
126
126
|
)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(
|
|
127
|
-
--spectrum-
|
|
127
|
+
--spectrum-component-top-to-text-200
|
|
128
128
|
);--spectrum-picker-spacing-top-to-text:var(
|
|
129
129
|
--spectrum-component-top-to-text-200
|
|
130
130
|
);--spectrum-picker-spacing-bottom-to-text:var(
|
|
@@ -146,7 +146,7 @@ const styles = css`
|
|
|
146
146
|
);--spectrum-picker-spacing-edge-to-disclosure-icon:var(
|
|
147
147
|
--spectrum-field-end-edge-to-disclosure-icon-200
|
|
148
148
|
)}:host([size=xl]){--spectrum-picker-font-size:var(--spectrum-font-size-300);--spectrum-picker-block-size:var(--spectrum-component-height-300);--spectrum-picker-spacing-top-to-text-side-label-quiet:var(
|
|
149
|
-
--spectrum-
|
|
149
|
+
--spectrum-component-top-to-text-300
|
|
150
150
|
);--spectrum-picker-spacing-top-to-text:var(
|
|
151
151
|
--spectrum-component-top-to-text-300
|
|
152
152
|
);--spectrum-picker-spacing-bottom-to-text:var(
|
|
@@ -167,7 +167,7 @@ const styles = css`
|
|
|
167
167
|
--spectrum-field-top-to-disclosure-icon-300
|
|
168
168
|
);--spectrum-picker-spacing-edge-to-disclosure-icon:var(
|
|
169
169
|
--spectrum-field-end-edge-to-disclosure-icon-300
|
|
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
|
|
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 .label,#button:after{forced-color-adjust:none}}#button{background-color:var(
|
|
171
171
|
--highcontrast-picker-background-color,var(
|
|
172
172
|
--mod-picker-background-color-default,var(--spectrum-picker-background-color-default)
|
|
173
173
|
)
|
|
@@ -410,7 +410,7 @@ var(--spectrum-picker-spacing-top-to-progress-circle)
|
|
|
410
410
|
var(--spectrum-picker-spacing-label-to-picker-quiet)
|
|
411
411
|
) + 1px);min-inline-size:0;padding-inline:var(
|
|
412
412
|
--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)
|
|
413
|
-
)}:host([quiet]) #button.spectrum-Picker--sideLabel{margin-block-start:
|
|
413
|
+
)}:host([quiet]) #button.spectrum-Picker--sideLabel{margin-block-start:0}:host([quiet]) #button .picker{margin-inline-end:var(
|
|
414
414
|
--mod-picker-spacing-edge-to-disclosure-icon-quiet,var(--spectrum-picker-spacing-edge-to-disclosure-icon-quiet)
|
|
415
415
|
)}:host([quiet]) #button:after{block-size:auto;border:none;inline-size:auto}@media (hover:hover){#button:hover .picker{color:var(
|
|
416
416
|
--highcontrast-picker-content-color-default,var(
|
|
@@ -482,7 +482,7 @@ var(--spectrum-picker-focus-indicator-gap)
|
|
|
482
482
|
) + var(
|
|
483
483
|
--mod-picker-border-width,
|
|
484
484
|
var(--spectrum-picker-border-width)
|
|
485
|
-
))*-1) 0}:host([quiet]) #button:active,:host([quiet]
|
|
485
|
+
))*-1) 0}:host([quiet]) #button:active,:host([quiet]) #button:disabled,:host([quiet][disabled]) #button,:host([quiet][open]) #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(
|
|
486
486
|
--system-spectrum-picker-background-color-default
|
|
487
487
|
);--spectrum-picker-background-color-default-open:var(
|
|
488
488
|
--system-spectrum-picker-background-color-default-open
|