npm - @spectrum-web-components/picker - Versions diffs - 0.36.0 → 0.37.0 - Mend

@spectrum-web-components/picker 0.36.0 → 0.37.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (28) hide show

package/custom-elements.json +319 -265
package/package.json +13 -13
package/src/Picker.d.ts +37 -43
package/src/Picker.dev.js +239 -218
package/src/Picker.dev.js.map +3 -3
package/src/Picker.js +69 -54
package/src/Picker.js.map +3 -3
package/src/picker.css.dev.js +1 -1
package/src/picker.css.dev.js.map +1 -1
package/src/picker.css.js +1 -1
package/src/picker.css.js.map +1 -1
package/stories/picker-sizes.stories.js +0 -1
package/stories/picker-sizes.stories.js.map +2 -2
package/stories/picker.stories.js +0 -7
package/stories/picker.stories.js.map +2 -2
package/sync/index.d.ts +3 -1
package/sync/index.dev.js +3 -7
package/sync/index.dev.js.map +2 -2
package/sync/index.js +1 -1
package/sync/index.js.map +3 -3
package/test/index.js +247 -161
package/test/index.js.map +2 -2
package/test/picker-reparenting.test.js +13 -17
package/test/picker-reparenting.test.js.map +2 -2
package/test/picker-responsive.test.js +3 -2
package/test/picker-responsive.test.js.map +2 -2
package/test/picker.test.js +1 -1
package/test/picker.test.js.map +2 -2

package/src/picker.css.dev.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["picker.css.ts"],
-  "sourcesContent": ["/*\nCopyright 2023 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-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;-webkit-appearance:button;box-sizing:border-box;cursor:pointer;display:inline-flex;font-family:var(\n--mod-sans-font-family-stack,var(--spectrum-sans-font-family-stack)\n);justify-content:center;line-height:var(--mod-line-height-100,var(--spectrum-line-height-100));margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none;text-transform:none;transition:background var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,border-color var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,color var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,box-shadow var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top}#button:focus{outline:none}#button::-moz-focus-inner{border:0;margin-block:-2px;padding:0}#button:disabled{cursor:default}.spectrum--medium{--spectrum-picker-popover-quiet-offset-x:12px}.spectrum--large{--spectrum-picker-popover-quiet-offset-x:14px}: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-border-radius:var(--spectrum-corner-radius-100);--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-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-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-top-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-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-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=m]){--spectrum-picker-font-size:var(--spectrum-font-size-100);--spectrum-picker-block-size:var(--spectrum-component-height-100);--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-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)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--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-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-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-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:CanvasText;--highcontrast-picker-border-color-default:ButtonText;--highcontrast-picker-border-color-active:ButtonText;--highcontrast-picker-border-color-key-focus:Highlight;--highcontrast-picker-border-color-error-default-open:ButtonText;--highcontrast-picker-border-color-error-hover:ButtonText;--highcontrast-picker-border-color-error-active:ButtonText;--highcontrast-picker-font-color-default:ButtonText;--highcontrast-picker-font-color-default-open:ButtonText;--highcontrast-picker-font-color-key-focus:ButtonText;--highcontrast-picker-font-color-disabled:GrayText;--highcontrast-picker-background-color-default:Background;--highcontrast-picker-background-color-disabled:Background;--highcontrast-picker-icon-color-default:ButtonText;--highcontrast-picker-icon-color-default-open:ButtonText;--highcontrast-picker-icon-color-hover:ButtonText;--highcontrast-picker-icon-color-hover-open:ButtonText;--highcontrast-picker-icon-color-key-focus:Highlight;--highcontrast-picker-icon-color-error-default:ButtonText}#button:disabled,:host([disabled]) #button{border-color:GrayText;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n)}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}}#button{background-color:var(\n--highcontrast-picker-background-color-default,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);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);display:flex;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:hover{background-color:var(\n--highcontrast-picker-background-color-default,var(\n--mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)\n)\n);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#button:hover .picker{color:var(\n--highcontrast-picker-icon-color-hover,var(\n--mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)\n)\n)}#button:active{background-color:var(\n--highcontrast-picker-background-active,var(\n--mod-picker-background-color-active,var(--spectrum-picker-background-color-active)\n)\n);border-color:var(\n--highcontrast-picker-border-color-active,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-font-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}#button.focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button:focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible:after,:host([focused]) #button: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:after,:host([focused]) #button: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:after,:host([focused]) #button: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,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button:focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button.focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button:focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}:host([open]) #button{background-color:var(\n--highcontrast-picker-background-default-open,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-open,var(\n--mod-picker-border-default-open,var(--spectrum-picker-border-color-default-open)\n)\n);color:var(\n--highcontrast-picker-font-color-default-open,var(\n--mod-picker-font-color-default-open,var(--spectrum-picker-font-color-default-open)\n)\n)}:host([open]) #button:hover{background-color:var(\n--highcontrast-picker-background-color-hover-open,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-open,var(\n--mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)\n)\n);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)\n)\n)}:host([open]) #button:hover .picker{color:var(\n--highcontrast-picker-icon-color-hover-open,var(\n--mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)\n)\n)}:host([open]) #button .picker{color:var(\n--highcontrast-picker-icon-color-default-open,var(\n--mod-picker-icon-color-default-open,var(--spectrum-picker-icon-color-default-open)\n)\n)}:host([invalid]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-default,var(--spectrum-picker-border-color-error-default)\n)\n)}:host([invalid]) #button .validation-icon{color:var(\n--highcontrast-picker-icon-color-error-default,var(\n--mod-picker-icon-color-error,var(--spectrum-picker-icon-color-error)\n)\n)}:host([invalid]) #button:hover{border-color:var(\n--highcontrast-picker-border-color-error-hover,var(\n--mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)\n)\n)}:host([invalid]) #button:active{border-color:var(\n--highcontrast-picker-border-color-error-active,var(\n--mod-picker-border-color-error-active,var(--spectrum-picker-border-color-error-active)\n)\n)}:host([invalid][open]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default-open,var(\n--mod-picker-border-color-error-default-open,var(--spectrum-picker-border-color-error-default-open)\n)\n)}:host([invalid][open]) #button:hover{border-color:var(\n--highcontrast-picker-border-color-error-hover-open,var(\n--mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)\n)\n)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button:focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-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-icon-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-disabled,var(\n--mod-picker-background-color-disabled,var(--spectrum-picker-background-color-disabled)\n)\n);border-color:#0000;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-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-icon-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-font-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([quiet]) #button{inline-size:auto;min-inline-size:0}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{border-color:#0000}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{border-color:#0000}:host([quiet]) #button:disabled:focus-visible,:host([quiet][disabled]) #button:focus-visible{border-color:#0000}#label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));line-height:calc(var(--mod-picker-block-size, var(--spectrum-picker-block-size)) - var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);line-height:var(\n--mod-picker-line-height,var(--spectrum-picker-line-height)\n);overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap}#label.placeholder{color:var(\n--highcontrast-picker-font-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-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:hover{color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#label.placeholder:active{color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}.picker{color:var(\n--highcontrast-picker-icon-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-icon-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)}#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:#0000;border:none;border-radius:0;color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);margin-block-start:calc(var(\n--mod-picker-spacing-label-to-picker-quiet,\nvar(--spectrum-picker-spacing-label-to-picker-quiet)\n) + 1px);padding-inline:var(\n--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)\n)}: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}:host([quiet]) #button:hover{background-color:#0000}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button.focus-visible:after,:host([quiet][focused]) #button:after{border:none;border-radius:0;box-shadow:0 var(\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.focus-visible:after,:host([quiet][focused]) #button: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:focus-visible:after,:host([quiet][focused]) #button: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:#0000}:host([quiet]) #button:disabled,:host([quiet][disabled]) #button{background-color:#0000}: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)}:host{display:inline-flex;max-width:100%;min-width:var(--spectrum-picker-min-width);vertical-align:top;width:var(--spectrum-picker-width)}:host([quiet]){min-width:0;width:auto}:host([size]){--spectrum-picker-width:var(--spectrum-global-dimension-size-2400)}#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}sp-popover{display:none}.picker,.validation-icon{flex-shrink:0}: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{clip:rect(0,0,0,0);border:0;clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}\n`;\nexport default styles;"],
+  "sourcesContent": ["/*\nCopyright 2023 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-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;-webkit-appearance:button;box-sizing:border-box;cursor:pointer;display:inline-flex;font-family:var(\n--mod-sans-font-family-stack,var(--spectrum-sans-font-family-stack)\n);justify-content:center;line-height:var(--mod-line-height-100,var(--spectrum-line-height-100));margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none;text-transform:none;transition:background var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,border-color var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,color var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,box-shadow var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top}#button:focus{outline:none}#button::-moz-focus-inner{border:0;margin-block:-2px;padding:0}#button:disabled{cursor:default}.spectrum--medium{--spectrum-picker-popover-quiet-offset-x:12px}.spectrum--large{--spectrum-picker-popover-quiet-offset-x:14px}: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-border-radius:var(--spectrum-corner-radius-100);--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-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-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-top-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-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-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=m]){--spectrum-picker-font-size:var(--spectrum-font-size-100);--spectrum-picker-block-size:var(--spectrum-component-height-100);--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-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)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--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-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-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-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:CanvasText;--highcontrast-picker-border-color-default:ButtonText;--highcontrast-picker-border-color-active:ButtonText;--highcontrast-picker-border-color-key-focus:Highlight;--highcontrast-picker-border-color-error-default-open:ButtonText;--highcontrast-picker-border-color-error-hover:ButtonText;--highcontrast-picker-border-color-error-active:ButtonText;--highcontrast-picker-font-color-default:ButtonText;--highcontrast-picker-font-color-default-open:ButtonText;--highcontrast-picker-font-color-key-focus:ButtonText;--highcontrast-picker-font-color-disabled:GrayText;--highcontrast-picker-background-color-default:Background;--highcontrast-picker-background-color-disabled:Background;--highcontrast-picker-icon-color-default:ButtonText;--highcontrast-picker-icon-color-default-open:ButtonText;--highcontrast-picker-icon-color-hover:ButtonText;--highcontrast-picker-icon-color-hover-open:ButtonText;--highcontrast-picker-icon-color-key-focus:Highlight;--highcontrast-picker-icon-color-error-default:ButtonText}#button:disabled,:host([disabled]) #button{border-color:GrayText;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n)}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}}#button{background-color:var(\n--highcontrast-picker-background-color-default,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);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);display:flex;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:hover{background-color:var(\n--highcontrast-picker-background-color-default,var(\n--mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)\n)\n);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#button:hover .picker{color:var(\n--highcontrast-picker-icon-color-hover,var(\n--mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)\n)\n)}#button:active{background-color:var(\n--highcontrast-picker-background-active,var(\n--mod-picker-background-color-active,var(--spectrum-picker-background-color-active)\n)\n);border-color:var(\n--highcontrast-picker-border-color-active,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-font-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}#button.focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button:focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible:after,:host([focused]) #button: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:after,:host([focused]) #button: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:after,:host([focused]) #button: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,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button:focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button.focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button:focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}:host([open]) #button{background-color:var(\n--highcontrast-picker-background-default-open,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-open,var(\n--mod-picker-border-default-open,var(--spectrum-picker-border-color-default-open)\n)\n);color:var(\n--highcontrast-picker-font-color-default-open,var(\n--mod-picker-font-color-default-open,var(--spectrum-picker-font-color-default-open)\n)\n)}:host([open]) #button:hover{background-color:var(\n--highcontrast-picker-background-color-hover-open,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-open,var(\n--mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)\n)\n);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)\n)\n)}:host([open]) #button:hover .picker{color:var(\n--highcontrast-picker-icon-color-hover-open,var(\n--mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)\n)\n)}:host([open]) #button .picker{color:var(\n--highcontrast-picker-icon-color-default-open,var(\n--mod-picker-icon-color-default-open,var(--spectrum-picker-icon-color-default-open)\n)\n)}:host([invalid]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-default,var(--spectrum-picker-border-color-error-default)\n)\n)}:host([invalid]) #button .validation-icon{color:var(\n--highcontrast-picker-icon-color-error-default,var(\n--mod-picker-icon-color-error,var(--spectrum-picker-icon-color-error)\n)\n)}:host([invalid]) #button:hover{border-color:var(\n--highcontrast-picker-border-color-error-hover,var(\n--mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)\n)\n)}:host([invalid]) #button:active{border-color:var(\n--highcontrast-picker-border-color-error-active,var(\n--mod-picker-border-color-error-active,var(--spectrum-picker-border-color-error-active)\n)\n)}:host([invalid][open]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default-open,var(\n--mod-picker-border-color-error-default-open,var(--spectrum-picker-border-color-error-default-open)\n)\n)}:host([invalid][open]) #button:hover{border-color:var(\n--highcontrast-picker-border-color-error-hover-open,var(\n--mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)\n)\n)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button:focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-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-icon-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-disabled,var(\n--mod-picker-background-color-disabled,var(--spectrum-picker-background-color-disabled)\n)\n);border-color:#0000;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-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-icon-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-font-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([quiet]) #button{inline-size:auto;min-inline-size:0}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{border-color:#0000}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{border-color:#0000}:host([quiet]) #button:disabled:focus-visible,:host([quiet][disabled]) #button:focus-visible{border-color:#0000}#label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));line-height:calc(var(--mod-picker-block-size, var(--spectrum-picker-block-size)) - var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);line-height:var(\n--mod-picker-line-height,var(--spectrum-picker-line-height)\n);overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap}#label.placeholder{color:var(\n--highcontrast-picker-font-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-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:hover{color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#label.placeholder:active{color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}.picker{color:var(\n--highcontrast-picker-icon-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-icon-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)}#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:#0000;border:none;border-radius:0;color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);margin-block-start:calc(var(\n--mod-picker-spacing-label-to-picker-quiet,\nvar(--spectrum-picker-spacing-label-to-picker-quiet)\n) + 1px);padding-inline:var(\n--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)\n)}: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}:host([quiet]) #button:hover{background-color:#0000}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button.focus-visible:after,:host([quiet][focused]) #button:after{border:none;border-radius:0;box-shadow:0 var(\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.focus-visible:after,:host([quiet][focused]) #button: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:focus-visible:after,:host([quiet][focused]) #button: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:#0000}:host([quiet]) #button:disabled,:host([quiet][disabled]) #button{background-color:#0000}: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)}:host{display:inline-flex;max-width:100%;min-width:var(--spectrum-picker-min-width);vertical-align:top;width:var(--spectrum-picker-width)}:host([quiet]){min-width:0;width:auto}:host([size]){--spectrum-picker-width:var(--spectrum-global-dimension-size-2400)}#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{clip:rect(0,0,0,0);border:0;clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}\n`;\nexport default styles;"],
   "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;AAuef,eAAe;",
   "names": []
 }

package/src/picker.css.js CHANGED Viewed

@@ -479,7 +479,7 @@ var(--spectrum-picker-border-width)
 --system-spectrum-picker-border-color-active
 );--spectrum-picker-border-color-key-focus:var(
 --system-spectrum-picker-border-color-key-focus
-)}:host{display:inline-flex;max-width:100%;min-width:var(--spectrum-picker-min-width);vertical-align:top;width:var(--spectrum-picker-width)}:host([quiet]){min-width:0;width:auto}:host([size]){--spectrum-picker-width:var(--spectrum-global-dimension-size-2400)}#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}sp-popover{display:none}.picker,.validation-icon{flex-shrink:0}:host([focused]:not([quiet])) #button #label.placeholder{color:var(
+)}:host{display:inline-flex;max-width:100%;min-width:var(--spectrum-picker-min-width);vertical-align:top;width:var(--spectrum-picker-width)}:host([quiet]){min-width:0;width:auto}:host([size]){--spectrum-picker-width:var(--spectrum-global-dimension-size-2400)}#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(
 --spectrum-picker-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)
 )}#label.visually-hidden~.picker{margin-inline-start:auto}:host([focused]:not([quiet])) #button .picker{color:var(
 --spectrum-picker-icon-color-key-focus,var(--spectrum-alias-icon-color-focus)

package/src/picker.css.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["picker.css.ts"],
-  "sourcesContent": ["/*\nCopyright 2023 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-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;-webkit-appearance:button;box-sizing:border-box;cursor:pointer;display:inline-flex;font-family:var(\n--mod-sans-font-family-stack,var(--spectrum-sans-font-family-stack)\n);justify-content:center;line-height:var(--mod-line-height-100,var(--spectrum-line-height-100));margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none;text-transform:none;transition:background var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,border-color var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,color var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,box-shadow var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top}#button:focus{outline:none}#button::-moz-focus-inner{border:0;margin-block:-2px;padding:0}#button:disabled{cursor:default}.spectrum--medium{--spectrum-picker-popover-quiet-offset-x:12px}.spectrum--large{--spectrum-picker-popover-quiet-offset-x:14px}: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-border-radius:var(--spectrum-corner-radius-100);--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-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-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-top-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-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-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=m]){--spectrum-picker-font-size:var(--spectrum-font-size-100);--spectrum-picker-block-size:var(--spectrum-component-height-100);--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-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)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--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-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-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-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:CanvasText;--highcontrast-picker-border-color-default:ButtonText;--highcontrast-picker-border-color-active:ButtonText;--highcontrast-picker-border-color-key-focus:Highlight;--highcontrast-picker-border-color-error-default-open:ButtonText;--highcontrast-picker-border-color-error-hover:ButtonText;--highcontrast-picker-border-color-error-active:ButtonText;--highcontrast-picker-font-color-default:ButtonText;--highcontrast-picker-font-color-default-open:ButtonText;--highcontrast-picker-font-color-key-focus:ButtonText;--highcontrast-picker-font-color-disabled:GrayText;--highcontrast-picker-background-color-default:Background;--highcontrast-picker-background-color-disabled:Background;--highcontrast-picker-icon-color-default:ButtonText;--highcontrast-picker-icon-color-default-open:ButtonText;--highcontrast-picker-icon-color-hover:ButtonText;--highcontrast-picker-icon-color-hover-open:ButtonText;--highcontrast-picker-icon-color-key-focus:Highlight;--highcontrast-picker-icon-color-error-default:ButtonText}#button:disabled,:host([disabled]) #button{border-color:GrayText;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n)}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}}#button{background-color:var(\n--highcontrast-picker-background-color-default,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);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);display:flex;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:hover{background-color:var(\n--highcontrast-picker-background-color-default,var(\n--mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)\n)\n);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#button:hover .picker{color:var(\n--highcontrast-picker-icon-color-hover,var(\n--mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)\n)\n)}#button:active{background-color:var(\n--highcontrast-picker-background-active,var(\n--mod-picker-background-color-active,var(--spectrum-picker-background-color-active)\n)\n);border-color:var(\n--highcontrast-picker-border-color-active,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-font-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}#button.focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button:focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible:after,:host([focused]) #button: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:after,:host([focused]) #button: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:after,:host([focused]) #button: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,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button:focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button.focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button:focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}:host([open]) #button{background-color:var(\n--highcontrast-picker-background-default-open,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-open,var(\n--mod-picker-border-default-open,var(--spectrum-picker-border-color-default-open)\n)\n);color:var(\n--highcontrast-picker-font-color-default-open,var(\n--mod-picker-font-color-default-open,var(--spectrum-picker-font-color-default-open)\n)\n)}:host([open]) #button:hover{background-color:var(\n--highcontrast-picker-background-color-hover-open,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-open,var(\n--mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)\n)\n);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)\n)\n)}:host([open]) #button:hover .picker{color:var(\n--highcontrast-picker-icon-color-hover-open,var(\n--mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)\n)\n)}:host([open]) #button .picker{color:var(\n--highcontrast-picker-icon-color-default-open,var(\n--mod-picker-icon-color-default-open,var(--spectrum-picker-icon-color-default-open)\n)\n)}:host([invalid]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-default,var(--spectrum-picker-border-color-error-default)\n)\n)}:host([invalid]) #button .validation-icon{color:var(\n--highcontrast-picker-icon-color-error-default,var(\n--mod-picker-icon-color-error,var(--spectrum-picker-icon-color-error)\n)\n)}:host([invalid]) #button:hover{border-color:var(\n--highcontrast-picker-border-color-error-hover,var(\n--mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)\n)\n)}:host([invalid]) #button:active{border-color:var(\n--highcontrast-picker-border-color-error-active,var(\n--mod-picker-border-color-error-active,var(--spectrum-picker-border-color-error-active)\n)\n)}:host([invalid][open]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default-open,var(\n--mod-picker-border-color-error-default-open,var(--spectrum-picker-border-color-error-default-open)\n)\n)}:host([invalid][open]) #button:hover{border-color:var(\n--highcontrast-picker-border-color-error-hover-open,var(\n--mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)\n)\n)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button:focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-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-icon-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-disabled,var(\n--mod-picker-background-color-disabled,var(--spectrum-picker-background-color-disabled)\n)\n);border-color:#0000;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-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-icon-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-font-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([quiet]) #button{inline-size:auto;min-inline-size:0}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{border-color:#0000}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{border-color:#0000}:host([quiet]) #button:disabled:focus-visible,:host([quiet][disabled]) #button:focus-visible{border-color:#0000}#label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));line-height:calc(var(--mod-picker-block-size, var(--spectrum-picker-block-size)) - var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);line-height:var(\n--mod-picker-line-height,var(--spectrum-picker-line-height)\n);overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap}#label.placeholder{color:var(\n--highcontrast-picker-font-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-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:hover{color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#label.placeholder:active{color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}.picker{color:var(\n--highcontrast-picker-icon-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-icon-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)}#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:#0000;border:none;border-radius:0;color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);margin-block-start:calc(var(\n--mod-picker-spacing-label-to-picker-quiet,\nvar(--spectrum-picker-spacing-label-to-picker-quiet)\n) + 1px);padding-inline:var(\n--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)\n)}: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}:host([quiet]) #button:hover{background-color:#0000}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button.focus-visible:after,:host([quiet][focused]) #button:after{border:none;border-radius:0;box-shadow:0 var(\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.focus-visible:after,:host([quiet][focused]) #button: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:focus-visible:after,:host([quiet][focused]) #button: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:#0000}:host([quiet]) #button:disabled,:host([quiet][disabled]) #button{background-color:#0000}: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)}:host{display:inline-flex;max-width:100%;min-width:var(--spectrum-picker-min-width);vertical-align:top;width:var(--spectrum-picker-width)}:host([quiet]){min-width:0;width:auto}:host([size]){--spectrum-picker-width:var(--spectrum-global-dimension-size-2400)}#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}sp-popover{display:none}.picker,.validation-icon{flex-shrink:0}: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{clip:rect(0,0,0,0);border:0;clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}\n`;\nexport default styles;"],
+  "sourcesContent": ["/*\nCopyright 2023 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-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;-webkit-appearance:button;box-sizing:border-box;cursor:pointer;display:inline-flex;font-family:var(\n--mod-sans-font-family-stack,var(--spectrum-sans-font-family-stack)\n);justify-content:center;line-height:var(--mod-line-height-100,var(--spectrum-line-height-100));margin:0;overflow:visible;position:relative;-webkit-text-decoration:none;text-decoration:none;text-transform:none;transition:background var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,border-color var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,color var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out,box-shadow var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-out;-webkit-user-select:none;user-select:none;vertical-align:top}#button:focus{outline:none}#button::-moz-focus-inner{border:0;margin-block:-2px;padding:0}#button:disabled{cursor:default}.spectrum--medium{--spectrum-picker-popover-quiet-offset-x:12px}.spectrum--large{--spectrum-picker-popover-quiet-offset-x:14px}: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-border-radius:var(--spectrum-corner-radius-100);--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-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-disclosure-icon:var(\n--spectrum-field-top-to-disclosure-icon-100\n);--spectrum-picker-spacing-edge-to-disclosure-icon:var(\n--spectrum-field-top-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-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-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=m]){--spectrum-picker-font-size:var(--spectrum-font-size-100);--spectrum-picker-block-size:var(--spectrum-component-height-100);--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-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)}:host([size=l]){--spectrum-picker-font-size:var(--spectrum-font-size-200);--spectrum-picker-block-size:var(--spectrum-component-height-200);--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-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-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-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:CanvasText;--highcontrast-picker-border-color-default:ButtonText;--highcontrast-picker-border-color-active:ButtonText;--highcontrast-picker-border-color-key-focus:Highlight;--highcontrast-picker-border-color-error-default-open:ButtonText;--highcontrast-picker-border-color-error-hover:ButtonText;--highcontrast-picker-border-color-error-active:ButtonText;--highcontrast-picker-font-color-default:ButtonText;--highcontrast-picker-font-color-default-open:ButtonText;--highcontrast-picker-font-color-key-focus:ButtonText;--highcontrast-picker-font-color-disabled:GrayText;--highcontrast-picker-background-color-default:Background;--highcontrast-picker-background-color-disabled:Background;--highcontrast-picker-icon-color-default:ButtonText;--highcontrast-picker-icon-color-default-open:ButtonText;--highcontrast-picker-icon-color-hover:ButtonText;--highcontrast-picker-icon-color-hover-open:ButtonText;--highcontrast-picker-icon-color-key-focus:Highlight;--highcontrast-picker-icon-color-error-default:ButtonText}#button:disabled,:host([disabled]) #button{border-color:GrayText;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n)}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{forced-color-adjust:none;outline:0}}#button{background-color:var(\n--highcontrast-picker-background-color-default,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);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);display:flex;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:hover{background-color:var(\n--highcontrast-picker-background-color-default,var(\n--mod-picker-background-color-hover,var(--spectrum-picker-background-color-hover)\n)\n);border-color:var(\n--highcontrast-picker-border-color-default,var(\n--mod-picker-border-color-hover,var(--spectrum-picker-border-color-hover)\n)\n);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#button:hover .picker{color:var(\n--highcontrast-picker-icon-color-hover,var(\n--mod-picker-icon-color-hover,var(--spectrum-picker-icon-color-hover)\n)\n)}#button:active{background-color:var(\n--highcontrast-picker-background-active,var(\n--mod-picker-background-color-active,var(--spectrum-picker-background-color-active)\n)\n);border-color:var(\n--highcontrast-picker-border-color-active,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-font-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}#button.focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button:focus-visible,:host([focused]) #button{background-color:var(\n--highcontrast-picker-background-color-default,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-key-focus,var(\n--mod-picker-border-color-key-focus,var(--spectrum-picker-border-color-key-focus)\n)\n);border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n);outline:none}#button.focus-visible:after,:host([focused]) #button: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:after,:host([focused]) #button: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:after,:host([focused]) #button: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,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button:focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--highcontrast-picker-font-color-key-focus,var(\n--mod-picker-font-color-key-focus,var(--spectrum-picker-font-color-key-focus)\n)\n)}#button.focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button.focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}#button:focus-visible .picker,:host([focused]) #button .picker{color:var(\n--highcontrast-picker-icon-color-key-focus,var(\n--mod-picker-icon-color-key-focus,var(--spectrum-picker-icon-color-key-focus)\n)\n)}:host([open]) #button{background-color:var(\n--highcontrast-picker-background-default-open,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-open,var(\n--mod-picker-border-default-open,var(--spectrum-picker-border-color-default-open)\n)\n);color:var(\n--highcontrast-picker-font-color-default-open,var(\n--mod-picker-font-color-default-open,var(--spectrum-picker-font-color-default-open)\n)\n)}:host([open]) #button:hover{background-color:var(\n--highcontrast-picker-background-color-hover-open,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-open,var(\n--mod-picker-border-color-hover-open,var(--spectrum-picker-border-color-hover-open)\n)\n);color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover-open,var(--spectrum-picker-font-color-hover-open)\n)\n)}:host([open]) #button:hover .picker{color:var(\n--highcontrast-picker-icon-color-hover-open,var(\n--mod-picker-icon-color-hover-open,var(--spectrum-picker-icon-color-hover-open)\n)\n)}:host([open]) #button .picker{color:var(\n--highcontrast-picker-icon-color-default-open,var(\n--mod-picker-icon-color-default-open,var(--spectrum-picker-icon-color-default-open)\n)\n)}:host([invalid]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-default,var(--spectrum-picker-border-color-error-default)\n)\n)}:host([invalid]) #button .validation-icon{color:var(\n--highcontrast-picker-icon-color-error-default,var(\n--mod-picker-icon-color-error,var(--spectrum-picker-icon-color-error)\n)\n)}:host([invalid]) #button:hover{border-color:var(\n--highcontrast-picker-border-color-error-hover,var(\n--mod-picker-border-color-error-hover,var(--spectrum-picker-border-color-error-hover)\n)\n)}:host([invalid]) #button:active{border-color:var(\n--highcontrast-picker-border-color-error-active,var(\n--mod-picker-border-color-error-active,var(--spectrum-picker-border-color-error-active)\n)\n)}:host([invalid][open]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default-open,var(\n--mod-picker-border-color-error-default-open,var(--spectrum-picker-border-color-error-default-open)\n)\n)}:host([invalid][open]) #button:hover{border-color:var(\n--highcontrast-picker-border-color-error-hover-open,var(\n--mod-picker-border-color-error-hover-open,var(--spectrum-picker-border-color-error-hover-open)\n)\n)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-default,var(\n--mod-picker-border-color-error-key-focus,var(--spectrum-picker-border-color-error-key-focus)\n)\n)}:host([invalid]) #button:focus-visible,:host([invalid][focused]) #button{border-color:var(\n--highcontrast-picker-border-color-error-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-icon-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-disabled,var(\n--mod-picker-background-color-disabled,var(--spectrum-picker-background-color-disabled)\n)\n);border-color:#0000;border-width:var(\n--mod-picker-border-width,var(--spectrum-picker-border-width)\n);color:var(\n--highcontrast-picker-font-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-icon-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-font-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([quiet]) #button{inline-size:auto;min-inline-size:0}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{border-color:#0000}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{border-color:#0000}:host([quiet]) #button:disabled:focus-visible,:host([quiet][disabled]) #button:focus-visible{border-color:#0000}#label{flex:auto;font-size:var(--mod-picker-font-size,var(--spectrum-picker-font-size));line-height:calc(var(--mod-picker-block-size, var(--spectrum-picker-block-size)) - var(--mod-picker-border-width, var(--spectrum-picker-border-width))*2);line-height:var(\n--mod-picker-line-height,var(--spectrum-picker-line-height)\n);overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap}#label.placeholder{color:var(\n--highcontrast-picker-font-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-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:hover{color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-hover,var(--spectrum-picker-font-color-hover)\n)\n)}#label.placeholder:active{color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-active,var(--spectrum-picker-font-color-active)\n)\n)}.picker{color:var(\n--highcontrast-picker-icon-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-icon-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)}#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:#0000;border:none;border-radius:0;color:var(\n--highcontrast-picker-font-color-default,var(\n--mod-picker-font-color-default,var(--spectrum-picker-font-color-default)\n)\n);margin-block-start:calc(var(\n--mod-picker-spacing-label-to-picker-quiet,\nvar(--spectrum-picker-spacing-label-to-picker-quiet)\n) + 1px);padding-inline:var(\n--mod-picker-spacing-edge-to-text-quiet,var(--spectrum-picker-spacing-edge-to-text-quiet)\n)}: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}:host([quiet]) #button:hover{background-color:#0000}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{background-color:#0000}:host([quiet]) #button.focus-visible:after,:host([quiet][focused]) #button:after{border:none;border-radius:0;box-shadow:0 var(\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.focus-visible:after,:host([quiet][focused]) #button: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:focus-visible:after,:host([quiet][focused]) #button: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:#0000}:host([quiet]) #button:disabled,:host([quiet][disabled]) #button{background-color:#0000}: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)}:host{display:inline-flex;max-width:100%;min-width:var(--spectrum-picker-min-width);vertical-align:top;width:var(--spectrum-picker-width)}:host([quiet]){min-width:0;width:auto}:host([size]){--spectrum-picker-width:var(--spectrum-global-dimension-size-2400)}#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{clip:rect(0,0,0,0);border:0;clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}\n`;\nexport default styles;"],
   "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,EAuef,eAAeC",
   "names": ["css", "styles"]
 }

package/stories/picker-sizes.stories.js CHANGED Viewed

@@ -33,7 +33,6 @@ const picker = ({
             <sp-menu-item>Select Inverse</sp-menu-item>
             <sp-menu-item>Feather...</sp-menu-item>
             <sp-menu-item>Select and Mask...</sp-menu-item>
-            <sp-menu-divider></sp-menu-divider>
             <sp-menu-item>Save Selection</sp-menu-item>
             <sp-menu-item disabled>Make Work Path</sp-menu-item>
         </sp-picker>

package/stories/picker-sizes.stories.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["picker-sizes.stories.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 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*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/picker/sp-picker.js';\nimport { Picker } from '@spectrum-web-components/picker';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\n\nexport default {\n    title: 'Picker/Sizes',\n    component: 'sp-picker',\n    argTypes: {\n        onChange: { action: 'change' },\n    },\n};\n\ntype StoryArgs = {\n    onChange: (val: string) => void;\n    open: false;\n};\n\nconst picker = ({\n    onChange,\n    open,\n    size,\n}: {\n    onChange: (val: string) => void;\n    size: 's' | 'm' | 'l' | 'xl';\n    open: boolean;\n}): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-${size}\" size=${size}>\n            Where do you live?\n        </sp-field-label>\n        <sp-picker\n            id=\"picker-${size}\"\n            size=${size}\n            @change=\"${(event: Event): void => {\n                const picker = event.target as Picker;\n                onChange(picker.value);\n            }}\"\n            label=\"Select a Country with a very long label, too long, in fact\"\n            ?open=${open}\n        >\n            <sp-menu-item>Deselect</sp-menu-item>\n            <sp-menu-item>Select Inverse</sp-menu-item>\n            <sp-menu-item>Feather...</sp-menu-item>\n            <sp-menu-item>Select and Mask...</sp-menu-item>\n            <sp-menu-divider></sp-menu-divider>\n            <sp-menu-item>Save Selection</sp-menu-item>\n            <sp-menu-item disabled>Make Work Path</sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const s = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, size: 's' });\n\nexport const sOpen = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, open: true, size: 's' });\n\nexport const m = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, size: 'm' });\n\nexport const mOpen = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, open: true, size: 'm' });\n\nexport const l = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, size: 'l' });\n\nexport const lOpen = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, open: true, size: 'l' });\n\nexport const XL = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, size: 'xl' });\n\nexport const XLOpen = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, open: true, size: 'xl' });\n"],
-  "mappings": ";AAYA,SAAS,YAA4B;AAErC,OAAO;AAEP,OAAO;AACP,OAAO;AAEP,eAAe;AAAA,EACX,OAAO;AAAA,EACP,WAAW;AAAA,EACX,UAAU;AAAA,IACN,UAAU,EAAE,QAAQ,SAAS;AAAA,EACjC;AACJ;AAOA,MAAM,SAAS,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AACJ,MAIsB;AAClB,SAAO;AAAA,sCAC2B,IAAI,UAAU,IAAI;AAAA;AAAA;AAAA;AAAA,yBAI/B,IAAI;AAAA,mBACV,IAAI;AAAA,uBACA,CAAC,UAAuB;AAC/B,UAAMA,UAAS,MAAM;AACrB,aAASA,QAAO,KAAK;AAAA,EACzB,CAAC;AAAA;AAAA,oBAEO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWxB;AAEO,aAAM,IAAI,CAAC,SACd,OAAO,EAAE,GAAG,MAAM,MAAM,IAAI,CAAC;AAE1B,aAAM,QAAQ,CAAC,SAClB,OAAO,EAAE,GAAG,MAAM,MAAM,MAAM,MAAM,IAAI,CAAC;AAEtC,aAAM,IAAI,CAAC,SACd,OAAO,EAAE,GAAG,MAAM,MAAM,IAAI,CAAC;AAE1B,aAAM,QAAQ,CAAC,SAClB,OAAO,EAAE,GAAG,MAAM,MAAM,MAAM,MAAM,IAAI,CAAC;AAEtC,aAAM,IAAI,CAAC,SACd,OAAO,EAAE,GAAG,MAAM,MAAM,IAAI,CAAC;AAE1B,aAAM,QAAQ,CAAC,SAClB,OAAO,EAAE,GAAG,MAAM,MAAM,MAAM,MAAM,IAAI,CAAC;AAEtC,aAAM,KAAK,CAAC,SACf,OAAO,EAAE,GAAG,MAAM,MAAM,KAAK,CAAC;AAE3B,aAAM,SAAS,CAAC,SACnB,OAAO,EAAE,GAAG,MAAM,MAAM,MAAM,MAAM,KAAK,CAAC;",
+  "sourcesContent": ["/*\nCopyright 2020 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*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/picker/sp-picker.js';\nimport { Picker } from '@spectrum-web-components/picker';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\n\nexport default {\n    title: 'Picker/Sizes',\n    component: 'sp-picker',\n    argTypes: {\n        onChange: { action: 'change' },\n    },\n};\n\ntype StoryArgs = {\n    onChange: (val: string) => void;\n    open: false;\n};\n\nconst picker = ({\n    onChange,\n    open,\n    size,\n}: {\n    onChange: (val: string) => void;\n    size: 's' | 'm' | 'l' | 'xl';\n    open: boolean;\n}): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-${size}\" size=${size}>\n            Where do you live?\n        </sp-field-label>\n        <sp-picker\n            id=\"picker-${size}\"\n            size=${size}\n            @change=\"${(event: Event): void => {\n                const picker = event.target as Picker;\n                onChange(picker.value);\n            }}\"\n            label=\"Select a Country with a very long label, too long, in fact\"\n            ?open=${open}\n        >\n            <sp-menu-item>Deselect</sp-menu-item>\n            <sp-menu-item>Select Inverse</sp-menu-item>\n            <sp-menu-item>Feather...</sp-menu-item>\n            <sp-menu-item>Select and Mask...</sp-menu-item>\n            <sp-menu-item>Save Selection</sp-menu-item>\n            <sp-menu-item disabled>Make Work Path</sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const s = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, size: 's' });\n\nexport const sOpen = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, open: true, size: 's' });\n\nexport const m = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, size: 'm' });\n\nexport const mOpen = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, open: true, size: 'm' });\n\nexport const l = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, size: 'l' });\n\nexport const lOpen = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, open: true, size: 'l' });\n\nexport const XL = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, size: 'xl' });\n\nexport const XLOpen = (args: StoryArgs): TemplateResult =>\n    picker({ ...args, open: true, size: 'xl' });\n"],
+  "mappings": ";AAYA,SAAS,YAA4B;AAErC,OAAO;AAEP,OAAO;AACP,OAAO;AAEP,eAAe;AAAA,EACX,OAAO;AAAA,EACP,WAAW;AAAA,EACX,UAAU;AAAA,IACN,UAAU,EAAE,QAAQ,SAAS;AAAA,EACjC;AACJ;AAOA,MAAM,SAAS,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AACJ,MAIsB;AAClB,SAAO;AAAA,sCAC2B,IAAI,UAAU,IAAI;AAAA;AAAA;AAAA;AAAA,yBAI/B,IAAI;AAAA,mBACV,IAAI;AAAA,uBACA,CAAC,UAAuB;AAC/B,UAAMA,UAAS,MAAM;AACrB,aAASA,QAAO,KAAK;AAAA,EACzB,CAAC;AAAA;AAAA,oBAEO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUxB;AAEO,aAAM,IAAI,CAAC,SACd,OAAO,EAAE,GAAG,MAAM,MAAM,IAAI,CAAC;AAE1B,aAAM,QAAQ,CAAC,SAClB,OAAO,EAAE,GAAG,MAAM,MAAM,MAAM,MAAM,IAAI,CAAC;AAEtC,aAAM,IAAI,CAAC,SACd,OAAO,EAAE,GAAG,MAAM,MAAM,IAAI,CAAC;AAE1B,aAAM,QAAQ,CAAC,SAClB,OAAO,EAAE,GAAG,MAAM,MAAM,MAAM,MAAM,IAAI,CAAC;AAEtC,aAAM,IAAI,CAAC,SACd,OAAO,EAAE,GAAG,MAAM,MAAM,IAAI,CAAC;AAE1B,aAAM,QAAQ,CAAC,SAClB,OAAO,EAAE,GAAG,MAAM,MAAM,MAAM,MAAM,IAAI,CAAC;AAEtC,aAAM,KAAK,CAAC,SACf,OAAO,EAAE,GAAG,MAAM,MAAM,KAAK,CAAC;AAE3B,aAAM,SAAS,CAAC,SACnB,OAAO,EAAE,GAAG,MAAM,MAAM,MAAM,MAAM,KAAK,CAAC;",
   "names": ["picker"]
 }

package/stories/picker.stories.js CHANGED Viewed

@@ -2,7 +2,6 @@
 import { html } from "@spectrum-web-components/base";
 import "@spectrum-web-components/picker/sp-picker.js";
 import "@spectrum-web-components/menu/sp-menu-item.js";
-import "@spectrum-web-components/menu/sp-menu-divider.js";
 import "@spectrum-web-components/icons-workflow/icons/sp-icon-edit.js";
 import "@spectrum-web-components/icons-workflow/icons/sp-icon-copy.js";
 import "@spectrum-web-components/icons-workflow/icons/sp-icon-delete.js";
@@ -84,7 +83,6 @@ export const Default = (args) => {
             <sp-menu-item value="option-2">Select Inverse</sp-menu-item>
             <sp-menu-item value="option-3">Feather...</sp-menu-item>
             <sp-menu-item value="option-4">Select and Mask...</sp-menu-item>
-            <sp-menu-divider></sp-menu-divider>
             <sp-menu-item value="option-5">Save Selection</sp-menu-item>
             <sp-menu-item disabled value="option-6">
                 Make Work Path
@@ -110,7 +108,6 @@ export const noVisibleLabel = (args) => {
             <sp-menu-item value="option-2">Select Inverse</sp-menu-item>
             <sp-menu-item value="option-3">Feather...</sp-menu-item>
             <sp-menu-item value="option-4">Select and Mask...</sp-menu-item>
-            <sp-menu-divider></sp-menu-divider>
             <sp-menu-item value="option-5">Save Selection</sp-menu-item>
             <sp-menu-item disabled value="option-6">
                 Make Work Path
@@ -133,7 +130,6 @@ export const slottedLabel = (args) => {
             <sp-menu-item value="option-2">Select Inverse</sp-menu-item>
             <sp-menu-item value="option-3">Feather...</sp-menu-item>
             <sp-menu-item value="option-4">Select and Mask...</sp-menu-item>
-            <sp-menu-divider></sp-menu-divider>
             <sp-menu-item value="option-5">Save Selection</sp-menu-item>
             <sp-menu-item disabled value="option-6">
                 Make Work Path
@@ -315,7 +311,6 @@ export const Open = (args) => {
                 <sp-menu-item>Select Inverse</sp-menu-item>
                 <sp-menu-item>Feather...</sp-menu-item>
                 <sp-menu-item>Select and Mask...</sp-menu-item>
-                <sp-menu-divider></sp-menu-divider>
                 <sp-menu-item>Save Selection</sp-menu-item>
                 <sp-menu-item disabled>Make Work Path</sp-menu-item>
             </sp-picker>
@@ -356,7 +351,6 @@ export const initialValue = (args) => {
             <sp-menu-item value="item-2">Select Inverse</sp-menu-item>
             <sp-menu-item value="item-3">Feather...</sp-menu-item>
             <sp-menu-item value="item-4">Select and Mask...</sp-menu-item>
-            <sp-menu-divider></sp-menu-divider>
             <sp-menu-item value="item-5">Save Selection</sp-menu-item>
             <sp-menu-item disabled value="item-6">Make Work Path</sp-menu-item>
         </sp-picker>
@@ -377,7 +371,6 @@ export const readonly = (args) => {
             <sp-menu-item value="item-2">Select Inverse</sp-menu-item>
             <sp-menu-item value="item-3">Feather...</sp-menu-item>
             <sp-menu-item value="item-4">Select and Mask...</sp-menu-item>
-            <sp-menu-divider></sp-menu-divider>
             <sp-menu-item value="item-5">Save Selection</sp-menu-item>
             <sp-menu-item disabled value="item-6">Make Work Path</sp-menu-item>
         </sp-picker>

package/stories/picker.stories.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["picker.stories.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 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*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/picker/sp-picker.js';\nimport { Picker } from '@spectrum-web-components/picker';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/menu/sp-menu-divider.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-edit.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-copy.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-delete.js';\nimport { states } from './states.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport { spreadProps } from '../../../test/lit-helpers.js';\n\nexport default {\n    title: 'Picker',\n    component: 'sp-picker',\n    args: {\n        disabled: false,\n        invalid: false,\n        open: false,\n        quiet: false,\n    },\n    argTypes: {\n        onChange: { action: 'change' },\n        disabled: {\n            name: 'disabled',\n            type: { name: 'boolean', required: false },\n            description:\n                'Disable this control. It will not receive focus or events.',\n            table: {\n                type: { summary: 'boolean' },\n                defaultValue: { summary: false },\n            },\n            control: {\n                type: 'boolean',\n            },\n        },\n        invalid: {\n            name: 'invalid',\n            type: { name: 'boolean', required: false },\n            table: {\n                type: { summary: 'boolean' },\n                defaultValue: { summary: false },\n            },\n            control: {\n                type: 'boolean',\n            },\n        },\n        open: {\n            name: 'open',\n            type: { name: 'boolean', required: false },\n            description: 'Whether the menu is open or not.',\n            table: {\n                type: { summary: 'boolean' },\n                defaultValue: { summary: false },\n            },\n            control: 'boolean',\n        },\n        quiet: {\n            name: 'quiet',\n            type: { name: 'boolean', required: false },\n            table: {\n                type: { summary: 'boolean' },\n                defaultValue: { summary: false },\n            },\n            control: {\n                type: 'boolean',\n            },\n        },\n    },\n};\n\ninterface StoryArgs {\n    disabled?: boolean;\n    invalid?: boolean;\n    open?: boolean;\n    quiet?: boolean;\n    showText?: boolean;\n    onChange?: (val: string) => void;\n    [prop: string]: unknown;\n}\n\nconst handleChange =\n    ({ onChange }: StoryArgs) =>\n    (event: Event): void => {\n        const picker = event.target as Picker;\n        if (onChange) onChange(picker.value);\n    };\n\nexport const Default = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-1\">Where do you live?</sp-field-label>\n        <sp-picker\n            id=\"picker-1\"\n            @change=${handleChange(args)}\n            label=\"Select a Country with a very long label, too long, in fact\"\n            ${spreadProps(args)}\n        >\n            <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-divider></sp-menu-divider>\n            <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"option-6\">\n                Make Work Path\n            </sp-menu-item>\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\n\nexport const noVisibleLabel = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-picker\n            @change=${handleChange(args)}\n            label=\"Where do you live?\"\n            ${spreadProps(args)}\n        >\n            <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-divider></sp-menu-divider>\n            <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"option-6\">\n                Make Work Path\n            </sp-menu-item>\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\n\nexport const slottedLabel = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-picker @change=${handleChange(args)} ${spreadProps(args)}>\n            <span slot=\"label\">Where do you live?</span>\n            <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-divider></sp-menu-divider>\n            <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"option-6\">\n                Make Work Path\n            </sp-menu-item>\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\n\nexport const quiet = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">Where do you live?</sp-field-label>\n        <sp-picker\n            ${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an item\"\n        >\n            <sp-menu-item value=\"1\">Item 1</sp-menu-item>\n            <sp-menu-item value=\"2\">Item 2</sp-menu-item>\n            <sp-menu-item value=\"3\">Item 3</sp-menu-item>\n            <sp-menu-item value=\"4\">Item 4</sp-menu-item>\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\nquiet.args = {\n    quiet: true,\n};\n\nexport const icons = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">\n            Choose an action type...\n        </sp-field-label>\n        <sp-picker\n            ...=${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an action\"\n            value=\"1\"\n        >\n            <sp-menu-item value=\"1\">\n                <sp-icon-edit slot=\"icon\"></sp-icon-edit>\n                Edit\n            </sp-menu-item>\n            <sp-menu-item value=\"2\">\n                <sp-icon-copy slot=\"icon\"></sp-icon-copy>\n                Copy\n            </sp-menu-item>\n            <sp-menu-item value=\"3\">\n                <sp-icon-delete slot=\"icon\"></sp-icon-delete>\n                Delete\n            </sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const iconsNone = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">\n            Choose an action type...\n        </sp-field-label>\n        <sp-picker\n            ...=${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an action\"\n            value=\"1\"\n            icons=\"none\"\n        >\n            <sp-menu-item value=\"1\">\n                <sp-icon-edit slot=\"icon\"></sp-icon-edit>\n                Edit\n            </sp-menu-item>\n            <sp-menu-item value=\"2\">\n                <sp-icon-copy slot=\"icon\"></sp-icon-copy>\n                Copy\n            </sp-menu-item>\n            <sp-menu-item value=\"3\">\n                <sp-icon-delete slot=\"icon\"></sp-icon-delete>\n                Delete\n            </sp-menu-item>\n        </sp-picker>\n    `;\n};\niconsNone.args = {\n    open: true,\n};\n\nexport const iconValue = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">\n            Choose an action type...\n        </sp-field-label>\n        <sp-picker\n            ...=${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an action\"\n            icons=\"only\"\n            style=\"--spectrum-picker-width: 100px\"\n            value=\"2\"\n        >\n            <sp-menu-item value=\"1\">\n                <sp-icon-edit slot=\"icon\"></sp-icon-edit>\n                Edit\n            </sp-menu-item>\n            <sp-menu-item value=\"2\">\n                <sp-icon-copy slot=\"icon\"></sp-icon-copy>\n                Copy\n            </sp-menu-item>\n            <sp-menu-item value=\"3\">\n                <sp-icon-delete slot=\"icon\"></sp-icon-delete>\n                Delete\n            </sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const iconsOnly = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">\n            Choose an action type...\n        </sp-field-label>\n        <sp-picker\n            ...=${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an action\"\n            style=\"--spectrum-picker-width: 100px\"\n            value=\"3\"\n        >\n            <sp-menu-item value=\"1\">\n                <sp-icon-edit slot=\"icon\" label=\"Edit\"></sp-icon-edit>\n            </sp-menu-item>\n            <sp-menu-item value=\"2\">\n                <sp-icon-copy slot=\"icon\" label=\"Copy\"></sp-icon-copy>\n            </sp-menu-item>\n            <sp-menu-item value=\"3\">\n                <sp-icon-delete slot=\"icon\" label=\"Delete\"></sp-icon-delete>\n            </sp-menu-item>\n        </sp-picker>\n    `;\n};\niconsOnly.args = {\n    open: true,\n};\n\nexport const Open = (args: StoryArgs): TemplateResult => {\n    return html`\n        <style>\n            fieldset {\n                float: left;\n                clear: left;\n                margin-bottom: 15px;\n            }\n        </style>\n        <fieldset>\n            <sp-field-label for=\"picker-open\">\n                Where do you live?\n            </sp-field-label>\n            <sp-picker\n                id=\"picker-open\"\n                label=\"Open picker\"\n                ${spreadProps(args)}\n                @change=${handleChange(args)}\n            >\n                <span slot=\"label\">\n                    Select a Country with a very long label, too long, in fact\n                </span>\n                <sp-menu-item>Deselect</sp-menu-item>\n                <sp-menu-item>Select Inverse</sp-menu-item>\n                <sp-menu-item>Feather...</sp-menu-item>\n                <sp-menu-item>Select and Mask...</sp-menu-item>\n                <sp-menu-divider></sp-menu-divider>\n                <sp-menu-item>Save Selection</sp-menu-item>\n                <sp-menu-item disabled>Make Work Path</sp-menu-item>\n            </sp-picker>\n        </fieldset>\n        <fieldset>\n            <sp-field-label for=\"picker-closed\">\n                Where do you live?\n            </sp-field-label>\n            <sp-picker\n                id=\"picker-closed\"\n                label=\"Picker that displays below the options\"\n                @change=${handleChange(args)}\n            >\n                <span slot=\"label\">\n                    Other menu that goes behind the open one\n                </span>\n                <sp-menu-item>Not so many options...</sp-menu-item>\n            </sp-picker>\n        </fieldset>\n    `;\n};\nOpen.args = {\n    open: true,\n};\n\nexport const initialValue = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-initial\">Where do you live?</sp-field-label>\n        <sp-picker\n            id=\"picker-initial\"\n            @change=${handleChange(args)}\n            value=\"item-2\"\n            ${spreadProps(args)}\n        >\n            <span slot=\"label\">\n                Select a Country with a very long label, too long in fact\n            </span>\n            <sp-menu-item value=\"item-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"item-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"item-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"item-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-divider></sp-menu-divider>\n            <sp-menu-item value=\"item-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"item-6\">Make Work Path</sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const readonly = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-picker\n            @change=${handleChange(args)}\n            readonly\n            value=\"item-2\"\n            ${spreadProps(args)}\n        >\n            <span slot=\"label\">\n                Select a Country with a very long label, too long in fact\n            </span>\n            <sp-menu-item value=\"item-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"item-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"item-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"item-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-divider></sp-menu-divider>\n            <sp-menu-item value=\"item-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"item-6\">Make Work Path</sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const custom = (args: StoryArgs): TemplateResult => {\n    const initialState = 'lb1-mo';\n    return html`\n        <sp-field-label for=\"picker-state\">\n            What state do you live in?\n        </sp-field-label>\n        <sp-picker\n            style=\"width: 400px;\"\n            @change=${handleChange(args)}\n            id=\"picker-state\"\n            label=\"Pick a state\"\n            ${spreadProps(args)}\n            value=${initialState}\n        >\n            ${states.map(\n                (state) => html`\n                    <sp-menu-item\n                        id=${state.id}\n                        value=${state.id}\n                        ?selected=${state.id === initialState}\n                    >\n                        ${state.label}\n                    </sp-menu-item>\n                `\n            )}\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\n\ncustom.args = {\n    open: true,\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["/*\nCopyright 2020 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*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/picker/sp-picker.js';\nimport { Picker } from '@spectrum-web-components/picker';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-edit.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-copy.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-delete.js';\nimport { states } from './states.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport { spreadProps } from '../../../test/lit-helpers.js';\n\nexport default {\n    title: 'Picker',\n    component: 'sp-picker',\n    args: {\n        disabled: false,\n        invalid: false,\n        open: false,\n        quiet: false,\n    },\n    argTypes: {\n        onChange: { action: 'change' },\n        disabled: {\n            name: 'disabled',\n            type: { name: 'boolean', required: false },\n            description:\n                'Disable this control. It will not receive focus or events.',\n            table: {\n                type: { summary: 'boolean' },\n                defaultValue: { summary: false },\n            },\n            control: {\n                type: 'boolean',\n            },\n        },\n        invalid: {\n            name: 'invalid',\n            type: { name: 'boolean', required: false },\n            table: {\n                type: { summary: 'boolean' },\n                defaultValue: { summary: false },\n            },\n            control: {\n                type: 'boolean',\n            },\n        },\n        open: {\n            name: 'open',\n            type: { name: 'boolean', required: false },\n            description: 'Whether the menu is open or not.',\n            table: {\n                type: { summary: 'boolean' },\n                defaultValue: { summary: false },\n            },\n            control: 'boolean',\n        },\n        quiet: {\n            name: 'quiet',\n            type: { name: 'boolean', required: false },\n            table: {\n                type: { summary: 'boolean' },\n                defaultValue: { summary: false },\n            },\n            control: {\n                type: 'boolean',\n            },\n        },\n    },\n};\n\ninterface StoryArgs {\n    disabled?: boolean;\n    invalid?: boolean;\n    open?: boolean;\n    quiet?: boolean;\n    showText?: boolean;\n    onChange?: (val: string) => void;\n    [prop: string]: unknown;\n}\n\nconst handleChange =\n    ({ onChange }: StoryArgs) =>\n    (event: Event): void => {\n        const picker = event.target as Picker;\n        if (onChange) onChange(picker.value);\n    };\n\nexport const Default = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-1\">Where do you live?</sp-field-label>\n        <sp-picker\n            id=\"picker-1\"\n            @change=${handleChange(args)}\n            label=\"Select a Country with a very long label, too long, in fact\"\n            ${spreadProps(args)}\n        >\n            <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"option-6\">\n                Make Work Path\n            </sp-menu-item>\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\n\nexport const noVisibleLabel = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-picker\n            @change=${handleChange(args)}\n            label=\"Where do you live?\"\n            ${spreadProps(args)}\n        >\n            <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"option-6\">\n                Make Work Path\n            </sp-menu-item>\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\n\nexport const slottedLabel = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-picker @change=${handleChange(args)} ${spreadProps(args)}>\n            <span slot=\"label\">Where do you live?</span>\n            <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"option-6\">\n                Make Work Path\n            </sp-menu-item>\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\n\nexport const quiet = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">Where do you live?</sp-field-label>\n        <sp-picker\n            ${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an item\"\n        >\n            <sp-menu-item value=\"1\">Item 1</sp-menu-item>\n            <sp-menu-item value=\"2\">Item 2</sp-menu-item>\n            <sp-menu-item value=\"3\">Item 3</sp-menu-item>\n            <sp-menu-item value=\"4\">Item 4</sp-menu-item>\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\nquiet.args = {\n    quiet: true,\n};\n\nexport const icons = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">\n            Choose an action type...\n        </sp-field-label>\n        <sp-picker\n            ...=${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an action\"\n            value=\"1\"\n        >\n            <sp-menu-item value=\"1\">\n                <sp-icon-edit slot=\"icon\"></sp-icon-edit>\n                Edit\n            </sp-menu-item>\n            <sp-menu-item value=\"2\">\n                <sp-icon-copy slot=\"icon\"></sp-icon-copy>\n                Copy\n            </sp-menu-item>\n            <sp-menu-item value=\"3\">\n                <sp-icon-delete slot=\"icon\"></sp-icon-delete>\n                Delete\n            </sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const iconsNone = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">\n            Choose an action type...\n        </sp-field-label>\n        <sp-picker\n            ...=${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an action\"\n            value=\"1\"\n            icons=\"none\"\n        >\n            <sp-menu-item value=\"1\">\n                <sp-icon-edit slot=\"icon\"></sp-icon-edit>\n                Edit\n            </sp-menu-item>\n            <sp-menu-item value=\"2\">\n                <sp-icon-copy slot=\"icon\"></sp-icon-copy>\n                Copy\n            </sp-menu-item>\n            <sp-menu-item value=\"3\">\n                <sp-icon-delete slot=\"icon\"></sp-icon-delete>\n                Delete\n            </sp-menu-item>\n        </sp-picker>\n    `;\n};\niconsNone.args = {\n    open: true,\n};\n\nexport const iconValue = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">\n            Choose an action type...\n        </sp-field-label>\n        <sp-picker\n            ...=${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an action\"\n            icons=\"only\"\n            style=\"--spectrum-picker-width: 100px\"\n            value=\"2\"\n        >\n            <sp-menu-item value=\"1\">\n                <sp-icon-edit slot=\"icon\"></sp-icon-edit>\n                Edit\n            </sp-menu-item>\n            <sp-menu-item value=\"2\">\n                <sp-icon-copy slot=\"icon\"></sp-icon-copy>\n                Copy\n            </sp-menu-item>\n            <sp-menu-item value=\"3\">\n                <sp-icon-delete slot=\"icon\"></sp-icon-delete>\n                Delete\n            </sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const iconsOnly = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-quiet\">\n            Choose an action type...\n        </sp-field-label>\n        <sp-picker\n            ...=${spreadProps(args)}\n            id=\"picker-quiet\"\n            @change=${handleChange(args)}\n            label=\"Pick an action\"\n            style=\"--spectrum-picker-width: 100px\"\n            value=\"3\"\n        >\n            <sp-menu-item value=\"1\">\n                <sp-icon-edit slot=\"icon\" label=\"Edit\"></sp-icon-edit>\n            </sp-menu-item>\n            <sp-menu-item value=\"2\">\n                <sp-icon-copy slot=\"icon\" label=\"Copy\"></sp-icon-copy>\n            </sp-menu-item>\n            <sp-menu-item value=\"3\">\n                <sp-icon-delete slot=\"icon\" label=\"Delete\"></sp-icon-delete>\n            </sp-menu-item>\n        </sp-picker>\n    `;\n};\niconsOnly.args = {\n    open: true,\n};\n\nexport const Open = (args: StoryArgs): TemplateResult => {\n    return html`\n        <style>\n            fieldset {\n                float: left;\n                clear: left;\n                margin-bottom: 15px;\n            }\n        </style>\n        <fieldset>\n            <sp-field-label for=\"picker-open\">\n                Where do you live?\n            </sp-field-label>\n            <sp-picker\n                id=\"picker-open\"\n                label=\"Open picker\"\n                ${spreadProps(args)}\n                @change=${handleChange(args)}\n            >\n                <span slot=\"label\">\n                    Select a Country with a very long label, too long, in fact\n                </span>\n                <sp-menu-item>Deselect</sp-menu-item>\n                <sp-menu-item>Select Inverse</sp-menu-item>\n                <sp-menu-item>Feather...</sp-menu-item>\n                <sp-menu-item>Select and Mask...</sp-menu-item>\n                <sp-menu-item>Save Selection</sp-menu-item>\n                <sp-menu-item disabled>Make Work Path</sp-menu-item>\n            </sp-picker>\n        </fieldset>\n        <fieldset>\n            <sp-field-label for=\"picker-closed\">\n                Where do you live?\n            </sp-field-label>\n            <sp-picker\n                id=\"picker-closed\"\n                label=\"Picker that displays below the options\"\n                @change=${handleChange(args)}\n            >\n                <span slot=\"label\">\n                    Other menu that goes behind the open one\n                </span>\n                <sp-menu-item>Not so many options...</sp-menu-item>\n            </sp-picker>\n        </fieldset>\n    `;\n};\nOpen.args = {\n    open: true,\n};\n\nexport const initialValue = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-field-label for=\"picker-initial\">Where do you live?</sp-field-label>\n        <sp-picker\n            id=\"picker-initial\"\n            @change=${handleChange(args)}\n            value=\"item-2\"\n            ${spreadProps(args)}\n        >\n            <span slot=\"label\">\n                Select a Country with a very long label, too long in fact\n            </span>\n            <sp-menu-item value=\"item-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"item-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"item-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"item-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-item value=\"item-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"item-6\">Make Work Path</sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const readonly = (args: StoryArgs): TemplateResult => {\n    return html`\n        <sp-picker\n            @change=${handleChange(args)}\n            readonly\n            value=\"item-2\"\n            ${spreadProps(args)}\n        >\n            <span slot=\"label\">\n                Select a Country with a very long label, too long in fact\n            </span>\n            <sp-menu-item value=\"item-1\">Deselect</sp-menu-item>\n            <sp-menu-item value=\"item-2\">Select Inverse</sp-menu-item>\n            <sp-menu-item value=\"item-3\">Feather...</sp-menu-item>\n            <sp-menu-item value=\"item-4\">Select and Mask...</sp-menu-item>\n            <sp-menu-item value=\"item-5\">Save Selection</sp-menu-item>\n            <sp-menu-item disabled value=\"item-6\">Make Work Path</sp-menu-item>\n        </sp-picker>\n    `;\n};\n\nexport const custom = (args: StoryArgs): TemplateResult => {\n    const initialState = 'lb1-mo';\n    return html`\n        <sp-field-label for=\"picker-state\">\n            What state do you live in?\n        </sp-field-label>\n        <sp-picker\n            style=\"width: 400px;\"\n            @change=${handleChange(args)}\n            id=\"picker-state\"\n            label=\"Pick a state\"\n            ${spreadProps(args)}\n            value=${initialState}\n        >\n            ${states.map(\n                (state) => html`\n                    <sp-menu-item\n                        id=${state.id}\n                        value=${state.id}\n                        ?selected=${state.id === initialState}\n                    >\n                        ${state.label}\n                    </sp-menu-item>\n                `\n            )}\n        </sp-picker>\n        <p>This is some text.</p>\n        <p>This is some text.</p>\n        <p>\n            This is a\n            <a href=\"#anchor\">link</a>\n            .\n        </p>\n    `;\n};\n\ncustom.args = {\n    open: true,\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/sync/index.d.ts CHANGED Viewed

@@ -1 +1,3 @@
-export {};
+import '@spectrum-web-components/overlay/sp-overlay.js';
+import '@spectrum-web-components/tray/sp-tray.js';
+import '@spectrum-web-components/popover/sp-popover.js';

package/sync/index.dev.js CHANGED Viewed

@@ -1,9 +1,5 @@
 "use strict";
-import { Picker } from "../src/Picker.dev.js";
-import {
-  Overlay
-} from "@spectrum-web-components/overlay";
-Picker.openOverlay = async (target, interaction, content, options) => {
-  return await Overlay.open(target, interaction, content, options);
-};
+import "@spectrum-web-components/overlay/sp-overlay.js";
+import "@spectrum-web-components/tray/sp-tray.js";
+import "@spectrum-web-components/popover/sp-popover.js";
 //# sourceMappingURL=index.dev.js.map

package/sync/index.dev.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["index.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 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*/\n\nimport { Picker } from '../src/Picker.dev.js'\nimport {\n    Overlay,\n    OverlayOptions,\n    TriggerInteractions,\n} from '@spectrum-web-components/overlay';\n\nPicker.openOverlay = async (\n    target: HTMLElement,\n    interaction: TriggerInteractions,\n    content: HTMLElement,\n    options: OverlayOptions\n): Promise<() => void> => {\n    return await Overlay.open(target, interaction, content, options);\n};\n"],
-  "mappings": ";AAYA,SAAS,cAAc;AACvB;AAAA,EACI;AAAA,OAGG;AAEP,OAAO,cAAc,OACjB,QACA,aACA,SACA,YACsB;AACtB,SAAO,MAAM,QAAQ,KAAK,QAAQ,aAAa,SAAS,OAAO;AACnE;",
+  "sourcesContent": ["/*\nCopyright 2023 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*/\n\nimport '@spectrum-web-components/overlay/sp-overlay.js';\nimport '@spectrum-web-components/tray/sp-tray.js';\nimport '@spectrum-web-components/popover/sp-popover.js';\n"],
+  "mappings": ";AAYA,OAAO;AACP,OAAO;AACP,OAAO;",
   "names": []
 }

package/sync/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";import{Picker as o}from"../src/Picker.js";import{Overlay as t}from"@spectrum-web-components/overlay";o.openOverlay=async(r,e,i,n)=>await t.open(r,e,i,n);
+"use strict";import"@spectrum-web-components/overlay/sp-overlay.js";import"@spectrum-web-components/tray/sp-tray.js";import"@spectrum-web-components/popover/sp-popover.js";
 //# sourceMappingURL=index.js.map

package/sync/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["index.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 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*/\n\nimport { Picker } from '../src/Picker.js';\nimport {\n    Overlay,\n    OverlayOptions,\n    TriggerInteractions,\n} from '@spectrum-web-components/overlay';\n\nPicker.openOverlay = async (\n    target: HTMLElement,\n    interaction: TriggerInteractions,\n    content: HTMLElement,\n    options: OverlayOptions\n): Promise<() => void> => {\n    return await Overlay.open(target, interaction, content, options);\n};\n"],
-  "mappings": "aAYA,OAAS,UAAAA,MAAc,mBACvB,OACI,WAAAC,MAGG,mCAEPD,EAAO,YAAc,MACjBE,EACAC,EACAC,EACAC,IAEO,MAAMJ,EAAQ,KAAKC,EAAQC,EAAaC,EAASC,CAAO",
-  "names": ["Picker", "Overlay", "target", "interaction", "content", "options"]
+  "sourcesContent": ["/*\nCopyright 2023 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*/\n\nimport '@spectrum-web-components/overlay/sp-overlay.js';\nimport '@spectrum-web-components/tray/sp-tray.js';\nimport '@spectrum-web-components/popover/sp-popover.js';\n"],
+  "mappings": "aAYA,MAAO,iDACP,MAAO,2CACP,MAAO",
+  "names": []
 }