@spectrum-web-components/picker 0.11.5 → 0.11.6-devmode.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.
- package/package.json +38 -21
- package/sp-picker.dev.js +3 -0
- package/sp-picker.dev.js.map +7 -0
- package/sp-picker.js +3 -14
- package/sp-picker.js.map +7 -1
- package/src/Picker.dev.js +501 -0
- package/src/Picker.dev.js.map +7 -0
- package/src/Picker.js +405 -434
- package/src/Picker.js.map +7 -1
- package/src/index.dev.js +2 -0
- package/src/index.dev.js.map +7 -0
- package/src/index.js +2 -13
- package/src/index.js.map +7 -1
- package/src/picker.css.dev.js +304 -0
- package/src/picker.css.dev.js.map +7 -0
- package/src/picker.css.js +3 -14
- package/src/picker.css.js.map +7 -1
- package/src/spectrum-picker.css.dev.js +300 -0
- package/src/spectrum-picker.css.dev.js.map +7 -0
- package/src/spectrum-picker.css.js +3 -14
- package/src/spectrum-picker.css.js.map +7 -1
- package/stories/picker-sizes.stories.js +22 -30
- package/stories/picker-sizes.stories.js.map +7 -1
- package/stories/picker.stories.js +84 -95
- package/stories/picker.stories.js.map +7 -1
- package/stories/states.js +225 -236
- package/stories/states.js.map +7 -1
- package/sync/index.dev.js +8 -0
- package/sync/index.dev.js.map +7 -0
- package/sync/index.js +6 -15
- package/sync/index.js.map +7 -1
- package/sync/sp-picker.dev.js +3 -0
- package/sync/sp-picker.dev.js.map +7 -0
- package/sync/sp-picker.js +3 -14
- package/sync/sp-picker.js.map +7 -1
- package/test/benchmark/basic-test.js +256 -267
- package/test/benchmark/basic-test.js.map +7 -1
- package/test/index.js +830 -844
- package/test/index.js.map +7 -1
- package/test/picker-reparenting.test.js +71 -76
- package/test/picker-reparenting.test.js.map +7 -1
- package/test/picker-responsive.test.js +41 -53
- package/test/picker-responsive.test.js.map +7 -1
- package/test/picker-sizes.test-vrt.js +4 -15
- package/test/picker-sizes.test-vrt.js.map +7 -1
- package/test/picker-sync.test.js +5 -16
- package/test/picker-sync.test.js.map +7 -1
- package/test/picker.test-vrt.js +4 -15
- package/test/picker.test-vrt.js.map +7 -1
- package/test/picker.test.js +5 -16
- package/test/picker.test.js.map +7 -1
package/src/Picker.js.map
CHANGED
|
@@ -1 +1,7 @@
|
|
|
1
|
-
{"version":3,"file":"Picker.js","sourceRoot":"","sources":["Picker.ts"],"names":[],"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 {\n CSSResultArray,\n DefaultElementSize,\n html,\n nothing,\n PropertyValues,\n render,\n SizedMixin,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { classMap } from '@spectrum-web-components/base/src/directives.js';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport pickerStyles from './picker.css.js';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\n\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport { reparentChildren } from '@spectrum-web-components/shared/src/reparent-children.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport type {\n Menu,\n MenuItem,\n MenuItemAddedOrUpdatedEvent,\n MenuItemChildren,\n MenuItemRemovedEvent,\n} from '@spectrum-web-components/menu';\nimport '@spectrum-web-components/tray/sp-tray.js';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport type { Popover } from '@spectrum-web-components/popover';\nimport {\n openOverlay,\n OverlayOptions,\n Placement,\n TriggerInteractions,\n} from '@spectrum-web-components/overlay';\nimport {\n IS_MOBILE,\n MatchMediaController,\n} from '@spectrum-web-components/reactive-controllers/src/MatchMedia.js';\n\nconst chevronClass = {\n s: 'spectrum-UIIcon-ChevronDown75',\n m: 'spectrum-UIIcon-ChevronDown100',\n l: 'spectrum-UIIcon-ChevronDown200',\n xl: 'spectrum-UIIcon-ChevronDown300',\n};\n\n/**\n * @element sp-picker\n *\n * @slot label - The placeholder content for the Picker\n * @slot - menu items to be listed in the Picker\n * @fires change - Announces that the `value` of the element has changed\n * @fires sp-opened - Announces that the overlay has been opened\n * @fires sp-closed - Announces that the overlay has been closed\n */\nexport class PickerBase extends SizedMixin(Focusable) {\n /**\n * @private\n */\n public static openOverlay = async (\n target: HTMLElement,\n interaction: TriggerInteractions,\n content: HTMLElement,\n options: OverlayOptions\n ): Promise<() => void> => {\n return await openOverlay(target, interaction, content, options);\n };\n\n protected isMobile = new MatchMediaController(this, IS_MOBILE);\n\n @query('#button')\n public button!: HTMLButtonElement;\n\n public get target(): HTMLButtonElement | this {\n return this.button;\n }\n\n @property({ type: Boolean, reflect: true })\n public override disabled = false;\n\n @property({ type: Boolean, reflect: true })\n public focused = false;\n\n @property({ type: String, reflect: true })\n public icons?: 'only' | 'none';\n\n @property({ type: Boolean, reflect: true })\n public invalid = false;\n\n @property()\n public label?: string;\n\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n @property({ type: Boolean, reflect: true })\n public readonly = false;\n\n public selects: undefined | 'single' = 'single';\n\n public menuItems: MenuItem[] = [];\n private restoreChildren?: () => void;\n\n public optionsMenu!: Menu;\n\n /**\n * @type {\"auto\" | \"auto-start\" | \"auto-end\" | \"top\" | \"bottom\" | \"right\" | \"left\" | \"top-start\" | \"top-end\" | \"bottom-start\" | \"bottom-end\" | \"right-start\" | \"right-end\" | \"left-start\" | \"left-end\" | \"none\"}\n * @attr\n */\n\n @property()\n public placement: Placement = 'bottom-start';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: String })\n public value = '';\n\n @property({ attribute: false })\n public selectedItem?: MenuItem;\n\n private closeOverlay?: Promise<() => void>;\n\n private popover!: Popover;\n\n protected listRole: 'listbox' | 'menu' = 'listbox';\n protected itemRole = 'option';\n\n public constructor() {\n super();\n this.onKeydown = this.onKeydown.bind(this);\n }\n\n public override get focusElement(): HTMLElement {\n if (this.open) {\n return this.optionsMenu;\n }\n return this.button;\n }\n\n public forceFocusVisible(): void {\n this.focused = true;\n }\n\n public onButtonBlur(): void {\n this.focused = false;\n (this.target as HTMLButtonElement).removeEventListener(\n 'keydown',\n this.onKeydown\n );\n }\n\n protected onButtonClick(): void {\n this.toggle();\n }\n\n public override focus(options?: FocusOptions): void {\n super.focus(options);\n\n if (!this.disabled && this.focusElement) {\n this.focused = this.hasVisibleFocusInTree();\n }\n }\n\n public onHelperFocus(): void {\n // set focused to true here instead of onButtonFocus so clicks don't flash a focus outline\n this.focused = true;\n this.button.focus();\n }\n\n public onButtonFocus(): void {\n (this.target as HTMLButtonElement).addEventListener(\n 'keydown',\n this.onKeydown\n );\n }\n\n public handleChange(event: Event): void {\n event.stopPropagation();\n const target = event.target as Menu;\n const [selected] = target.selectedItems;\n this.setValueFromItem(selected, event);\n }\n\n protected onKeydown = (event: KeyboardEvent): void => {\n this.focused = true;\n if (event.code !== 'ArrowDown' && event.code !== 'ArrowUp') {\n return;\n }\n event.preventDefault();\n this.toggle(true);\n };\n\n public async setValueFromItem(\n item: MenuItem,\n menuChangeEvent?: Event\n ): Promise<void> {\n const oldSelectedItem = this.selectedItem;\n const oldValue = this.value;\n this.selectedItem = item;\n this.value = item.value;\n this.open = false;\n await this.updateComplete;\n const applyDefault = this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n );\n if (!applyDefault) {\n if (menuChangeEvent) {\n menuChangeEvent.preventDefault();\n }\n this.selectedItem.selected = false;\n if (oldSelectedItem) {\n oldSelectedItem.selected = true;\n }\n this.selectedItem = oldSelectedItem;\n this.value = oldValue;\n this.open = true;\n return;\n }\n if (oldSelectedItem) {\n oldSelectedItem.selected = false;\n }\n item.selected = !!this.selects;\n }\n\n public toggle(target?: boolean): void {\n if (this.readonly) {\n return;\n }\n this.open = typeof target !== 'undefined' ? target : !this.open;\n }\n\n public close(): void {\n if (this.readonly) {\n return;\n }\n this.open = false;\n }\n\n public overlayOpenCallback = async (): Promise<void> => {\n this.updateMenuItems();\n await this.itemsUpdated;\n await this.optionsMenu.updateComplete;\n requestAnimationFrame(() => this.menuStateResolver());\n };\n\n public overlayCloseCallback = async (): Promise<void> => {\n if (this.restoreChildren) {\n this.restoreChildren();\n this.restoreChildren = undefined;\n }\n this.close();\n requestAnimationFrame(() => this.menuStateResolver());\n };\n\n private popoverFragment!: DocumentFragment;\n\n private async generatePopover(deprecatedMenu: Menu | null): Promise<void> {\n if (!this.popoverFragment) {\n this.popoverFragment = document.createDocumentFragment();\n }\n render(this.renderPopover, this.popoverFragment, { host: this });\n this.popover = this.popoverFragment.children[0] as Popover;\n this.optionsMenu = this.popover.children[1] as Menu;\n\n if (deprecatedMenu) {\n console.warn(\n `Deprecation Notice: You no longer need to provide an sp-menu child to ${this.tagName.toLowerCase()}. Any styling or attributes on the sp-menu will be ignored.`\n );\n }\n }\n\n private async openMenu(): Promise<void> {\n /* c8 ignore next 9 */\n let reparentableChildren: Element[] = [];\n const deprecatedMenu = this.querySelector(':scope > sp-menu') as Menu;\n\n await this.generatePopover(deprecatedMenu);\n if (deprecatedMenu) {\n reparentableChildren = Array.from(deprecatedMenu.children);\n } else {\n reparentableChildren = Array.from(this.children).filter(\n (element) => {\n return !element.hasAttribute('slot');\n }\n );\n }\n\n if (reparentableChildren.length === 0) {\n this.menuStateResolver();\n return;\n }\n\n this.restoreChildren = reparentChildren<\n Element & { focused?: boolean }\n >(reparentableChildren, this.optionsMenu, {\n position: 'beforeend',\n prepareCallback: (\n el: Element & {\n focused?: boolean | undefined;\n value?: string;\n selected?: boolean;\n }\n ) => {\n if (this.value === el.value) {\n el.selected = true;\n }\n return (el) => {\n if (typeof el.focused !== 'undefined') {\n el.focused = false;\n }\n };\n },\n });\n\n this.sizePopover(this.popover);\n this.closeOverlay = Picker.openOverlay(this, 'modal', this.popover, {\n placement: this.isMobile.matches ? 'none' : this.placement,\n receivesFocus: 'auto',\n });\n }\n\n protected sizePopover(popover: HTMLElement): void {\n if (this.isMobile.matches) {\n popover.style.setProperty('--swc-menu-width', `100%`);\n return;\n }\n if (this.quiet) return;\n // only use `this.offsetWidth` when Standard variant\n popover.style.setProperty('min-width', `${this.offsetWidth}px`);\n }\n\n private async closeMenu(): Promise<void> {\n if (this.closeOverlay) {\n const closeOverlay = this.closeOverlay;\n delete this.closeOverlay;\n (await closeOverlay)();\n }\n }\n\n protected get selectedItemContent(): MenuItemChildren {\n if (this.selectedItem) {\n return this.selectedItem.itemChildren;\n }\n return { icon: [], content: [] };\n }\n\n protected renderLabelContent(content: Node[]): TemplateResult | Node[] {\n if (this.value && this.selectedItem) {\n return content;\n }\n return html`\n <slot name=\"label\">${this.label}</slot>\n `;\n }\n\n protected get buttonContent(): TemplateResult[] {\n const labelClasses = {\n 'visually-hidden': this.icons === 'only' && !!this.value,\n placeholder: !this.value,\n };\n return [\n html`\n <span id=\"icon\" ?hidden=${this.icons === 'none'}>\n ${this.selectedItemContent.icon}\n </span>\n <span id=\"label\" class=${classMap(labelClasses)}>\n ${this.renderLabelContent(this.selectedItemContent.content)}\n </span>\n ${this.invalid\n ? html`\n <sp-icon-alert\n class=\"validation-icon\"\n ></sp-icon-alert>\n `\n : nothing}\n <sp-icon-chevron100\n class=\"picker ${chevronClass[\n this.size as DefaultElementSize\n ]}\"\n ></sp-icon-chevron100>\n `,\n ];\n }\n\n // a helper to throw focus to the button is needed because Safari\n // won't include buttons in the tab order even with tabindex=\"0\"\n protected override render(): TemplateResult {\n return html`\n <span\n id=\"focus-helper\"\n tabindex=\"${this.focused ? '-1' : '0'}\"\n @focus=${this.onHelperFocus}\n ></span>\n <button\n aria-haspopup=\"true\"\n aria-expanded=${this.open ? 'true' : 'false'}\n aria-labelledby=\"button icon label\"\n id=\"button\"\n class=\"button\"\n @blur=${this.onButtonBlur}\n @click=${this.onButtonClick}\n @focus=${this.onButtonFocus}\n ?disabled=${this.disabled}\n tabindex=\"-1\"\n >\n ${this.buttonContent}\n </button>\n `;\n }\n\n protected override update(changes: PropertyValues<this>): void {\n if (this.selects) {\n // Always force `selects` to \"single\" when set.\n // TODO: Add support functionally and visually for \"multiple\"\n this.selects = 'single';\n }\n if (changes.has('disabled') && this.disabled) {\n this.open = false;\n }\n if (\n changes.has('open') &&\n (this.open || typeof changes.get('open') !== 'undefined')\n ) {\n this.menuStatePromise = new Promise(\n (res) => (this.menuStateResolver = res)\n );\n if (this.open) {\n this.openMenu();\n } else {\n this.closeMenu();\n }\n }\n if (changes.has('value') && !changes.has('selectedItem')) {\n this.updateMenuItems();\n }\n super.update(changes);\n }\n\n protected get dismissHelper(): TemplateResult {\n return html`\n <div class=\"visually-hidden\">\n <button\n tabindex=\"-1\"\n arial-label=\"Dismiss\"\n @click=${this.close}\n ></button>\n </div>\n `;\n }\n\n protected get renderPopover(): TemplateResult {\n const content = html`\n ${this.dismissHelper}\n <sp-menu\n id=\"menu\"\n role=\"${this.listRole}\"\n @change=${this.handleChange}\n .selects=${this.selects}\n ></sp-menu>\n ${this.dismissHelper}\n `;\n if (this.isMobile.matches) {\n return html`\n <sp-tray\n id=\"popover\"\n role=\"dialog\"\n @sp-menu-item-added-or-updated=${this.updateMenuItems}\n .overlayOpenCallback=${this.overlayOpenCallback}\n .overlayCloseCallback=${this.overlayCloseCallback}\n >\n ${content}\n </sp-tray>\n `;\n }\n return html`\n <sp-popover\n id=\"popover\"\n role=\"dialog\"\n @sp-menu-item-added-or-updated=${this.updateMenuItems}\n .overlayOpenCallback=${this.overlayOpenCallback}\n .overlayCloseCallback=${this.overlayCloseCallback}\n >\n ${content}\n </sp-popover>\n `;\n }\n\n private _willUpdateItems = false;\n protected itemsUpdated: Promise<void> = Promise.resolve();\n\n /**\n * Acquire the available MenuItems in the Picker by\n * direct element query or by assuming the list managed\n * by the Menu within the open options overlay.\n */\n protected updateMenuItems(\n event?: MenuItemAddedOrUpdatedEvent | MenuItemRemovedEvent\n ): void {\n if (this.open && event?.type === 'sp-menu-item-removed') return;\n if (this._willUpdateItems) return;\n this._willUpdateItems = true;\n if (event?.item === this.selectedItem) {\n this.requestUpdate();\n }\n\n let resolve = (): void => {\n return;\n };\n this.itemsUpdated = new Promise((res) => (resolve = res));\n // Debounce the update so we only update once\n // if multiple items have changed\n window.requestAnimationFrame(async () => {\n if (this.open) {\n await this.optionsMenu.updateComplete;\n this.menuItems = this.optionsMenu.childItems;\n } else {\n this.menuItems = [\n ...this.querySelectorAll('sp-menu-item'),\n ] as MenuItem[];\n }\n this.manageSelection();\n resolve();\n this._willUpdateItems = false;\n });\n }\n\n protected async manageSelection(): Promise<void> {\n await this.menuStatePromise;\n this.selectionPromise = new Promise(\n (res) => (this.selectionResolver = res)\n );\n let selectedItem: MenuItem | undefined;\n this.menuItems.forEach((item) => {\n if (this.value === item.value && !item.disabled) {\n selectedItem = item;\n } else {\n item.selected = false;\n }\n });\n if (selectedItem) {\n selectedItem.selected = !!this.selects;\n this.selectedItem = selectedItem;\n } else {\n this.value = '';\n this.selectedItem = undefined;\n }\n if (this.open) {\n await this.optionsMenu.updateComplete;\n this.optionsMenu.updateSelectedItemIndex();\n }\n this.selectionResolver();\n }\n\n private menuStatePromise = Promise.resolve();\n private menuStateResolver!: () => void;\n private selectionPromise = Promise.resolve();\n private selectionResolver!: () => void;\n\n protected override async getUpdateComplete(): Promise<boolean> {\n const complete = (await super.getUpdateComplete()) as boolean;\n await this.menuStatePromise;\n await this.itemsUpdated;\n await this.selectionPromise;\n return complete;\n }\n\n public override connectedCallback(): void {\n this.updateMenuItems();\n this.addEventListener(\n 'sp-menu-item-added-or-updated',\n this.updateMenuItems\n );\n this.addEventListener('sp-menu-item-removed', this.updateMenuItems);\n super.connectedCallback();\n }\n\n public override disconnectedCallback(): void {\n this.close();\n\n super.disconnectedCallback();\n }\n}\n\nexport class Picker extends PickerBase {\n public static override get styles(): CSSResultArray {\n return [pickerStyles, chevronStyles];\n }\n\n protected override onKeydown = (event: KeyboardEvent): void => {\n const { code } = event;\n this.focused = true;\n if (!code.startsWith('Arrow') || this.readonly) {\n return;\n }\n event.preventDefault();\n if (code === 'ArrowUp' || code === 'ArrowDown') {\n this.toggle(true);\n return;\n }\n const selectedIndex = this.selectedItem\n ? this.menuItems.indexOf(this.selectedItem)\n : -1;\n // use a positive offset to find the first non-disabled item when no selection is available.\n const nextOffset = !this.value || code === 'ArrowRight' ? 1 : -1;\n let nextIndex = selectedIndex + nextOffset;\n while (\n this.menuItems[nextIndex] &&\n this.menuItems[nextIndex].disabled\n ) {\n nextIndex += nextOffset;\n }\n if (!this.menuItems[nextIndex] || this.menuItems[nextIndex].disabled) {\n return;\n }\n if (!this.value || nextIndex !== selectedIndex) {\n this.setValueFromItem(this.menuItems[nextIndex]);\n }\n };\n}\n"]}
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["Picker.ts"],
|
|
4
|
+
"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 {\n CSSResultArray,\n DefaultElementSize,\n html,\n nothing,\n PropertyValues,\n render,\n SizedMixin,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { classMap } from '@spectrum-web-components/base/src/directives.js';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport pickerStyles from './picker.css.js';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\n\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport { reparentChildren } from '@spectrum-web-components/shared/src/reparent-children.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport type {\n Menu,\n MenuItem,\n MenuItemAddedOrUpdatedEvent,\n MenuItemChildren,\n MenuItemRemovedEvent,\n} from '@spectrum-web-components/menu';\nimport '@spectrum-web-components/tray/sp-tray.js';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport type { Popover } from '@spectrum-web-components/popover';\nimport {\n openOverlay,\n OverlayOptions,\n Placement,\n TriggerInteractions,\n} from '@spectrum-web-components/overlay';\nimport {\n IS_MOBILE,\n MatchMediaController,\n} from '@spectrum-web-components/reactive-controllers/src/MatchMedia.js';\n\nconst chevronClass = {\n s: 'spectrum-UIIcon-ChevronDown75',\n m: 'spectrum-UIIcon-ChevronDown100',\n l: 'spectrum-UIIcon-ChevronDown200',\n xl: 'spectrum-UIIcon-ChevronDown300',\n};\n\n/**\n * @element sp-picker\n *\n * @slot label - The placeholder content for the Picker\n * @slot - menu items to be listed in the Picker\n * @fires change - Announces that the `value` of the element has changed\n * @fires sp-opened - Announces that the overlay has been opened\n * @fires sp-closed - Announces that the overlay has been closed\n */\nexport class PickerBase extends SizedMixin(Focusable) {\n /**\n * @private\n */\n public static openOverlay = async (\n target: HTMLElement,\n interaction: TriggerInteractions,\n content: HTMLElement,\n options: OverlayOptions\n ): Promise<() => void> => {\n return await openOverlay(target, interaction, content, options);\n };\n\n protected isMobile = new MatchMediaController(this, IS_MOBILE);\n\n @query('#button')\n public button!: HTMLButtonElement;\n\n public get target(): HTMLButtonElement | this {\n return this.button;\n }\n\n @property({ type: Boolean, reflect: true })\n public override disabled = false;\n\n @property({ type: Boolean, reflect: true })\n public focused = false;\n\n @property({ type: String, reflect: true })\n public icons?: 'only' | 'none';\n\n @property({ type: Boolean, reflect: true })\n public invalid = false;\n\n @property()\n public label?: string;\n\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n @property({ type: Boolean, reflect: true })\n public readonly = false;\n\n public selects: undefined | 'single' = 'single';\n\n public menuItems: MenuItem[] = [];\n private restoreChildren?: () => void;\n\n public optionsMenu!: Menu;\n\n /**\n * @type {\"auto\" | \"auto-start\" | \"auto-end\" | \"top\" | \"bottom\" | \"right\" | \"left\" | \"top-start\" | \"top-end\" | \"bottom-start\" | \"bottom-end\" | \"right-start\" | \"right-end\" | \"left-start\" | \"left-end\" | \"none\"}\n * @attr\n */\n\n @property()\n public placement: Placement = 'bottom-start';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: String })\n public value = '';\n\n @property({ attribute: false })\n public selectedItem?: MenuItem;\n\n private closeOverlay?: Promise<() => void>;\n\n private popover!: Popover;\n\n protected listRole: 'listbox' | 'menu' = 'listbox';\n protected itemRole = 'option';\n\n public constructor() {\n super();\n this.onKeydown = this.onKeydown.bind(this);\n }\n\n public override get focusElement(): HTMLElement {\n if (this.open) {\n return this.optionsMenu;\n }\n return this.button;\n }\n\n public forceFocusVisible(): void {\n this.focused = true;\n }\n\n public onButtonBlur(): void {\n this.focused = false;\n (this.target as HTMLButtonElement).removeEventListener(\n 'keydown',\n this.onKeydown\n );\n }\n\n protected onButtonClick(): void {\n this.toggle();\n }\n\n public override focus(options?: FocusOptions): void {\n super.focus(options);\n\n if (!this.disabled && this.focusElement) {\n this.focused = this.hasVisibleFocusInTree();\n }\n }\n\n public onHelperFocus(): void {\n // set focused to true here instead of onButtonFocus so clicks don't flash a focus outline\n this.focused = true;\n this.button.focus();\n }\n\n public onButtonFocus(): void {\n (this.target as HTMLButtonElement).addEventListener(\n 'keydown',\n this.onKeydown\n );\n }\n\n public handleChange(event: Event): void {\n event.stopPropagation();\n const target = event.target as Menu;\n const [selected] = target.selectedItems;\n this.setValueFromItem(selected, event);\n }\n\n protected onKeydown = (event: KeyboardEvent): void => {\n this.focused = true;\n if (event.code !== 'ArrowDown' && event.code !== 'ArrowUp') {\n return;\n }\n event.preventDefault();\n this.toggle(true);\n };\n\n public async setValueFromItem(\n item: MenuItem,\n menuChangeEvent?: Event\n ): Promise<void> {\n const oldSelectedItem = this.selectedItem;\n const oldValue = this.value;\n this.selectedItem = item;\n this.value = item.value;\n this.open = false;\n await this.updateComplete;\n const applyDefault = this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n );\n if (!applyDefault) {\n if (menuChangeEvent) {\n menuChangeEvent.preventDefault();\n }\n this.selectedItem.selected = false;\n if (oldSelectedItem) {\n oldSelectedItem.selected = true;\n }\n this.selectedItem = oldSelectedItem;\n this.value = oldValue;\n this.open = true;\n return;\n }\n if (oldSelectedItem) {\n oldSelectedItem.selected = false;\n }\n item.selected = !!this.selects;\n }\n\n public toggle(target?: boolean): void {\n if (this.readonly) {\n return;\n }\n this.open = typeof target !== 'undefined' ? target : !this.open;\n }\n\n public close(): void {\n if (this.readonly) {\n return;\n }\n this.open = false;\n }\n\n public overlayOpenCallback = async (): Promise<void> => {\n this.updateMenuItems();\n await this.itemsUpdated;\n await this.optionsMenu.updateComplete;\n requestAnimationFrame(() => this.menuStateResolver());\n };\n\n public overlayCloseCallback = async (): Promise<void> => {\n if (this.restoreChildren) {\n this.restoreChildren();\n this.restoreChildren = undefined;\n }\n this.close();\n requestAnimationFrame(() => this.menuStateResolver());\n };\n\n private popoverFragment!: DocumentFragment;\n\n private async generatePopover(deprecatedMenu: Menu | null): Promise<void> {\n if (!this.popoverFragment) {\n this.popoverFragment = document.createDocumentFragment();\n }\n render(this.renderPopover, this.popoverFragment, { host: this });\n this.popover = this.popoverFragment.children[0] as Popover;\n this.optionsMenu = this.popover.children[1] as Menu;\n\n if (window.__swc.DEBUG) {\n if (deprecatedMenu) {\n const { localName } = this;\n window.__swc.issueWarning(\n `${localName}:api:deprecation`,\n `You no longer need to provide an sp-menu child to ${localName}. Any styling or attributes on the sp-menu will be ignored.`,\n 'https://opensource.adobe.com/spectrum-web-components/components/picker/#sizes'\n );\n }\n }\n }\n\n private async openMenu(): Promise<void> {\n /* c8 ignore next 9 */\n let reparentableChildren: Element[] = [];\n const deprecatedMenu = this.querySelector(':scope > sp-menu') as Menu;\n\n await this.generatePopover(deprecatedMenu);\n if (deprecatedMenu) {\n reparentableChildren = Array.from(deprecatedMenu.children);\n } else {\n reparentableChildren = Array.from(this.children).filter(\n (element) => {\n return !element.hasAttribute('slot');\n }\n );\n }\n\n if (reparentableChildren.length === 0) {\n this.menuStateResolver();\n return;\n }\n\n this.restoreChildren = reparentChildren<\n Element & { focused?: boolean }\n >(reparentableChildren, this.optionsMenu, {\n position: 'beforeend',\n prepareCallback: (\n el: Element & {\n focused?: boolean | undefined;\n value?: string;\n selected?: boolean;\n }\n ) => {\n if (this.value === el.value) {\n el.selected = true;\n }\n return (el) => {\n if (typeof el.focused !== 'undefined') {\n el.focused = false;\n }\n };\n },\n });\n\n this.sizePopover(this.popover);\n this.closeOverlay = Picker.openOverlay(this, 'modal', this.popover, {\n placement: this.isMobile.matches ? 'none' : this.placement,\n receivesFocus: 'auto',\n });\n }\n\n protected sizePopover(popover: HTMLElement): void {\n if (this.isMobile.matches) {\n popover.style.setProperty('--swc-menu-width', `100%`);\n return;\n }\n if (this.quiet) return;\n // only use `this.offsetWidth` when Standard variant\n popover.style.setProperty('min-width', `${this.offsetWidth}px`);\n }\n\n private async closeMenu(): Promise<void> {\n if (this.closeOverlay) {\n const closeOverlay = this.closeOverlay;\n delete this.closeOverlay;\n (await closeOverlay)();\n }\n }\n\n protected get selectedItemContent(): MenuItemChildren {\n if (this.selectedItem) {\n return this.selectedItem.itemChildren;\n }\n return { icon: [], content: [] };\n }\n\n protected renderLabelContent(content: Node[]): TemplateResult | Node[] {\n if (this.value && this.selectedItem) {\n return content;\n }\n return html`\n <slot name=\"label\">${this.label}</slot>\n `;\n }\n\n protected get buttonContent(): TemplateResult[] {\n const labelClasses = {\n 'visually-hidden': this.icons === 'only' && !!this.value,\n placeholder: !this.value,\n };\n return [\n html`\n <span id=\"icon\" ?hidden=${this.icons === 'none'}>\n ${this.selectedItemContent.icon}\n </span>\n <span id=\"label\" class=${classMap(labelClasses)}>\n ${this.renderLabelContent(this.selectedItemContent.content)}\n </span>\n ${this.invalid\n ? html`\n <sp-icon-alert\n class=\"validation-icon\"\n ></sp-icon-alert>\n `\n : nothing}\n <sp-icon-chevron100\n class=\"picker ${chevronClass[\n this.size as DefaultElementSize\n ]}\"\n ></sp-icon-chevron100>\n `,\n ];\n }\n\n // a helper to throw focus to the button is needed because Safari\n // won't include buttons in the tab order even with tabindex=\"0\"\n protected override render(): TemplateResult {\n return html`\n <span\n id=\"focus-helper\"\n tabindex=\"${this.focused ? '-1' : '0'}\"\n @focus=${this.onHelperFocus}\n ></span>\n <button\n aria-haspopup=\"true\"\n aria-expanded=${this.open ? 'true' : 'false'}\n aria-labelledby=\"button icon label\"\n id=\"button\"\n class=\"button\"\n @blur=${this.onButtonBlur}\n @click=${this.onButtonClick}\n @focus=${this.onButtonFocus}\n ?disabled=${this.disabled}\n tabindex=\"-1\"\n >\n ${this.buttonContent}\n </button>\n `;\n }\n\n protected override update(changes: PropertyValues<this>): void {\n if (this.selects) {\n // Always force `selects` to \"single\" when set.\n // TODO: Add support functionally and visually for \"multiple\"\n this.selects = 'single';\n }\n if (changes.has('disabled') && this.disabled) {\n this.open = false;\n }\n if (\n changes.has('open') &&\n (this.open || typeof changes.get('open') !== 'undefined')\n ) {\n this.menuStatePromise = new Promise(\n (res) => (this.menuStateResolver = res)\n );\n if (this.open) {\n this.openMenu();\n } else {\n this.closeMenu();\n }\n }\n if (changes.has('value') && !changes.has('selectedItem')) {\n this.updateMenuItems();\n }\n super.update(changes);\n }\n\n protected get dismissHelper(): TemplateResult {\n return html`\n <div class=\"visually-hidden\">\n <button\n tabindex=\"-1\"\n arial-label=\"Dismiss\"\n @click=${this.close}\n ></button>\n </div>\n `;\n }\n\n protected get renderPopover(): TemplateResult {\n const content = html`\n ${this.dismissHelper}\n <sp-menu\n id=\"menu\"\n role=\"${this.listRole}\"\n @change=${this.handleChange}\n .selects=${this.selects}\n ></sp-menu>\n ${this.dismissHelper}\n `;\n if (this.isMobile.matches) {\n return html`\n <sp-tray\n id=\"popover\"\n role=\"dialog\"\n @sp-menu-item-added-or-updated=${this.updateMenuItems}\n .overlayOpenCallback=${this.overlayOpenCallback}\n .overlayCloseCallback=${this.overlayCloseCallback}\n >\n ${content}\n </sp-tray>\n `;\n }\n return html`\n <sp-popover\n id=\"popover\"\n role=\"dialog\"\n @sp-menu-item-added-or-updated=${this.updateMenuItems}\n .overlayOpenCallback=${this.overlayOpenCallback}\n .overlayCloseCallback=${this.overlayCloseCallback}\n >\n ${content}\n </sp-popover>\n `;\n }\n\n private _willUpdateItems = false;\n protected itemsUpdated: Promise<void> = Promise.resolve();\n\n /**\n * Acquire the available MenuItems in the Picker by\n * direct element query or by assuming the list managed\n * by the Menu within the open options overlay.\n */\n protected updateMenuItems(\n event?: MenuItemAddedOrUpdatedEvent | MenuItemRemovedEvent\n ): void {\n if (this.open && event?.type === 'sp-menu-item-removed') return;\n if (this._willUpdateItems) return;\n this._willUpdateItems = true;\n if (event?.item === this.selectedItem) {\n this.requestUpdate();\n }\n\n let resolve = (): void => {\n return;\n };\n this.itemsUpdated = new Promise((res) => (resolve = res));\n // Debounce the update so we only update once\n // if multiple items have changed\n window.requestAnimationFrame(async () => {\n if (this.open) {\n await this.optionsMenu.updateComplete;\n this.menuItems = this.optionsMenu.childItems;\n } else {\n this.menuItems = [\n ...this.querySelectorAll('sp-menu-item'),\n ] as MenuItem[];\n }\n this.manageSelection();\n resolve();\n this._willUpdateItems = false;\n });\n }\n\n protected async manageSelection(): Promise<void> {\n await this.menuStatePromise;\n this.selectionPromise = new Promise(\n (res) => (this.selectionResolver = res)\n );\n let selectedItem: MenuItem | undefined;\n this.menuItems.forEach((item) => {\n if (this.value === item.value && !item.disabled) {\n selectedItem = item;\n } else {\n item.selected = false;\n }\n });\n if (selectedItem) {\n selectedItem.selected = !!this.selects;\n this.selectedItem = selectedItem;\n } else {\n this.value = '';\n this.selectedItem = undefined;\n }\n if (this.open) {\n await this.optionsMenu.updateComplete;\n this.optionsMenu.updateSelectedItemIndex();\n }\n this.selectionResolver();\n }\n\n private menuStatePromise = Promise.resolve();\n private menuStateResolver!: () => void;\n private selectionPromise = Promise.resolve();\n private selectionResolver!: () => void;\n\n protected override async getUpdateComplete(): Promise<boolean> {\n const complete = (await super.getUpdateComplete()) as boolean;\n await this.menuStatePromise;\n await this.itemsUpdated;\n await this.selectionPromise;\n return complete;\n }\n\n public override connectedCallback(): void {\n this.updateMenuItems();\n this.addEventListener(\n 'sp-menu-item-added-or-updated',\n this.updateMenuItems\n );\n this.addEventListener('sp-menu-item-removed', this.updateMenuItems);\n super.connectedCallback();\n }\n\n public override disconnectedCallback(): void {\n this.close();\n\n super.disconnectedCallback();\n }\n}\n\nexport class Picker extends PickerBase {\n public static override get styles(): CSSResultArray {\n return [pickerStyles, chevronStyles];\n }\n\n protected override onKeydown = (event: KeyboardEvent): void => {\n const { code } = event;\n this.focused = true;\n if (!code.startsWith('Arrow') || this.readonly) {\n return;\n }\n event.preventDefault();\n if (code === 'ArrowUp' || code === 'ArrowDown') {\n this.toggle(true);\n return;\n }\n const selectedIndex = this.selectedItem\n ? this.menuItems.indexOf(this.selectedItem)\n : -1;\n // use a positive offset to find the first non-disabled item when no selection is available.\n const nextOffset = !this.value || code === 'ArrowRight' ? 1 : -1;\n let nextIndex = selectedIndex + nextOffset;\n while (\n this.menuItems[nextIndex] &&\n this.menuItems[nextIndex].disabled\n ) {\n nextIndex += nextOffset;\n }\n if (!this.menuItems[nextIndex] || this.menuItems[nextIndex].disabled) {\n return;\n }\n if (!this.value || nextIndex !== selectedIndex) {\n this.setValueFromItem(this.menuItems[nextIndex]);\n }\n };\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/src/index.dev.js
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["index.ts"],
|
|
4
|
+
"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\nexport * from './Picker.dev.js'\n"],
|
|
5
|
+
"mappings": "AAYA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/src/index.js
CHANGED
|
@@ -1,13 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
4
|
-
you may not use this file except in compliance with the License. You may obtain a copy
|
|
5
|
-
of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
6
|
-
|
|
7
|
-
Unless required by applicable law or agreed to in writing, software distributed under
|
|
8
|
-
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
9
|
-
OF ANY KIND, either express or implied. See the License for the specific language
|
|
10
|
-
governing permissions and limitations under the License.
|
|
11
|
-
*/
|
|
12
|
-
export * from './Picker.js';
|
|
13
|
-
//# sourceMappingURL=index.js.map
|
|
1
|
+
export * from "./Picker.js";
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
package/src/index.js.map
CHANGED
|
@@ -1 +1,7 @@
|
|
|
1
|
-
{
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["index.ts"],
|
|
4
|
+
"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\nexport * from './Picker.js';\n"],
|
|
5
|
+
"mappings": "AAYA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,304 @@
|
|
|
1
|
+
import { css } from "@spectrum-web-components/base";
|
|
2
|
+
const styles = css`
|
|
3
|
+
#button{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;box-sizing:border-box;cursor:pointer;display:inline-flex;font-family:var(
|
|
4
|
+
--spectrum-alias-body-text-font-family,var(--spectrum-global-font-family-base)
|
|
5
|
+
);line-height:var(
|
|
6
|
+
--spectrum-alias-component-text-line-height,var(--spectrum-global-font-line-height-small)
|
|
7
|
+
);overflow:visible;position:relative;text-decoration:none;text-transform:none;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;user-select:none;-webkit-user-select:none;vertical-align:top}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;margin-bottom:-2px;margin-top:-2px;padding:0}#button:disabled{cursor:default}:host([dir=ltr]) #button{padding-left:var(
|
|
8
|
+
--spectrum-picker-textonly-padding-left-adjusted
|
|
9
|
+
);padding-right:var(--spectrum-picker-textonly-padding-right-adjusted)}:host([dir=rtl]) #button{padding-left:var(--spectrum-picker-textonly-padding-right-adjusted);padding-right:var(
|
|
10
|
+
--spectrum-picker-textonly-padding-left-adjusted
|
|
11
|
+
)}#button{align-items:center;border-radius:var(--spectrum-picker-texticon-border-radius);border-style:solid;border-width:var(--spectrum-picker-texticon-border-size);display:flex;height:var(--spectrum-picker-texticon-height);justify-content:center;margin:0;min-width:var(--spectrum-picker-texticon-min-width);padding-bottom:0;padding-top:0;transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);width:var(--spectrum-picker-texticon-width)}#button:disabled,:host([disabled]) #button{border-width:var(
|
|
12
|
+
--spectrum-picker-texticon-disabled-border-size
|
|
13
|
+
);cursor:default}:host([dir=ltr]) #button .icon{margin-right:var(
|
|
14
|
+
--spectrum-picker-texticon-icon-gap
|
|
15
|
+
)}:host([dir=rtl]) #button .icon{margin-left:var(
|
|
16
|
+
--spectrum-picker-texticon-icon-gap
|
|
17
|
+
)}.icon{flex-shrink:0}:host([dir=ltr]) #button #label+.icon{margin-left:calc((var(--spectrum-picker-textonly-padding-left-adjusted) - var(--spectrum-picker-padding-left-adjusted))*-1)}:host([dir=rtl]) #button #label+.icon{margin-right:calc((var(--spectrum-picker-textonly-padding-left-adjusted) - var(--spectrum-picker-padding-left-adjusted))*-1)}:host([size=s]){--spectrum-picker-texticon-border-size:var(
|
|
18
|
+
--spectrum-picker-s-texticon-border-size,var(--spectrum-alias-border-size-thin)
|
|
19
|
+
);--spectrum-picker-texticon-text-size:var(
|
|
20
|
+
--spectrum-picker-s-texticon-text-size,var(--spectrum-global-dimension-font-size-75)
|
|
21
|
+
);--spectrum-picker-texticon-icon-gap:var(
|
|
22
|
+
--spectrum-picker-s-texticon-icon-gap,var(--spectrum-global-dimension-size-85)
|
|
23
|
+
);--spectrum-picker-texticon-placeholder-font-style:var(
|
|
24
|
+
--spectrum-picker-s-texticon-placeholder-font-style,var(--spectrum-global-font-style-italic)
|
|
25
|
+
);--spectrum-picker-texticon-placeholder-font-weight:var(
|
|
26
|
+
--spectrum-picker-s-texticon-placeholder-font-weight,var(--spectrum-global-font-weight-regular)
|
|
27
|
+
);--spectrum-picker-texticon-error-icon-margin-left:var(
|
|
28
|
+
--spectrum-picker-s-texticon-error-icon-margin-left,var(--spectrum-global-dimension-size-100)
|
|
29
|
+
);--spectrum-picker-texticon-ui-icon-gap:var(
|
|
30
|
+
--spectrum-picker-s-texticon-ui-icon-gap,var(--spectrum-global-dimension-size-85)
|
|
31
|
+
);--spectrum-picker-texticon-popover-max-width:var(
|
|
32
|
+
--spectrum-picker-s-texticon-popover-max-width,var(--spectrum-global-dimension-size-1800)
|
|
33
|
+
);--spectrum-picker-texticon-padding-left:var(
|
|
34
|
+
--spectrum-picker-s-texticon-padding-left,var(--spectrum-global-dimension-size-85)
|
|
35
|
+
);--spectrum-picker-texticon-height:var(
|
|
36
|
+
--spectrum-picker-s-texticon-height,var(--spectrum-global-dimension-size-300)
|
|
37
|
+
);--spectrum-picker-texticon-min-width:var(
|
|
38
|
+
--spectrum-picker-s-texticon-min-width,var(--spectrum-global-dimension-size-450)
|
|
39
|
+
);--spectrum-picker-texticon-width:var(
|
|
40
|
+
--spectrum-picker-s-texticon-width,var(--spectrum-global-dimension-size-2000)
|
|
41
|
+
);--spectrum-picker-texticon-border-radius:var(
|
|
42
|
+
--spectrum-picker-s-texticon-border-radius,var(--spectrum-alias-component-border-radius)
|
|
43
|
+
);--spectrum-picker-textonly-border-size:var(
|
|
44
|
+
--spectrum-picker-s-textonly-border-size,var(--spectrum-alias-border-size-thin)
|
|
45
|
+
);--spectrum-picker-textonly-padding-left:var(
|
|
46
|
+
--spectrum-picker-s-textonly-padding-left,var(--spectrum-global-dimension-size-115)
|
|
47
|
+
);--spectrum-picker-textonly-padding-right:var(
|
|
48
|
+
--spectrum-picker-s-textonly-padding-right,var(--spectrum-global-dimension-size-115)
|
|
49
|
+
);--spectrum-picker-textonly-border-radius:var(
|
|
50
|
+
--spectrum-picker-s-textonly-border-radius,var(--spectrum-alias-component-border-radius)
|
|
51
|
+
)}:host([size=m]){--spectrum-picker-texticon-padding-left:var(
|
|
52
|
+
--spectrum-picker-m-texticon-padding-left
|
|
53
|
+
);--spectrum-picker-texticon-border-size:var(
|
|
54
|
+
--spectrum-picker-m-texticon-border-size,var(--spectrum-alias-border-size-thin)
|
|
55
|
+
);--spectrum-picker-texticon-text-size:var(
|
|
56
|
+
--spectrum-picker-m-texticon-text-size,var(--spectrum-global-dimension-font-size-100)
|
|
57
|
+
);--spectrum-picker-texticon-icon-gap:var(
|
|
58
|
+
--spectrum-picker-m-texticon-icon-gap,var(--spectrum-global-dimension-size-100)
|
|
59
|
+
);--spectrum-picker-texticon-placeholder-font-style:var(
|
|
60
|
+
--spectrum-picker-m-texticon-placeholder-font-style,var(--spectrum-global-font-style-italic)
|
|
61
|
+
);--spectrum-picker-texticon-placeholder-font-weight:var(
|
|
62
|
+
--spectrum-picker-m-texticon-placeholder-font-weight,var(--spectrum-global-font-weight-regular)
|
|
63
|
+
);--spectrum-picker-texticon-error-icon-margin-left:var(
|
|
64
|
+
--spectrum-picker-m-texticon-error-icon-margin-left,var(--spectrum-global-dimension-size-150)
|
|
65
|
+
);--spectrum-picker-texticon-ui-icon-gap:var(
|
|
66
|
+
--spectrum-picker-m-texticon-ui-icon-gap,var(--spectrum-global-dimension-size-100)
|
|
67
|
+
);--spectrum-picker-texticon-popover-max-width:var(
|
|
68
|
+
--spectrum-picker-m-texticon-popover-max-width,var(--spectrum-global-dimension-size-2400)
|
|
69
|
+
);--spectrum-picker-texticon-height:var(
|
|
70
|
+
--spectrum-picker-m-texticon-height,var(--spectrum-global-dimension-size-400)
|
|
71
|
+
);--spectrum-picker-texticon-min-width:var(
|
|
72
|
+
--spectrum-picker-m-texticon-min-width,var(--spectrum-global-dimension-size-600)
|
|
73
|
+
);--spectrum-picker-texticon-width:var(
|
|
74
|
+
--spectrum-picker-m-texticon-width,var(--spectrum-global-dimension-size-2400)
|
|
75
|
+
);--spectrum-picker-texticon-border-radius:var(
|
|
76
|
+
--spectrum-picker-m-texticon-border-radius,var(--spectrum-alias-component-border-radius)
|
|
77
|
+
);--spectrum-picker-textonly-border-size:var(
|
|
78
|
+
--spectrum-picker-m-textonly-border-size,var(--spectrum-alias-border-size-thin)
|
|
79
|
+
);--spectrum-picker-textonly-padding-left:var(
|
|
80
|
+
--spectrum-picker-m-textonly-padding-left,var(--spectrum-global-dimension-size-150)
|
|
81
|
+
);--spectrum-picker-textonly-padding-right:var(
|
|
82
|
+
--spectrum-picker-m-textonly-padding-right,var(--spectrum-global-dimension-size-150)
|
|
83
|
+
);--spectrum-picker-textonly-border-radius:var(
|
|
84
|
+
--spectrum-picker-m-textonly-border-radius,var(--spectrum-alias-component-border-radius)
|
|
85
|
+
)}:host([size=l]){--spectrum-picker-texticon-border-size:var(
|
|
86
|
+
--spectrum-picker-l-texticon-border-size,var(--spectrum-alias-border-size-thin)
|
|
87
|
+
);--spectrum-picker-texticon-text-size:var(
|
|
88
|
+
--spectrum-picker-l-texticon-text-size,var(--spectrum-global-dimension-font-size-200)
|
|
89
|
+
);--spectrum-picker-texticon-icon-gap:var(
|
|
90
|
+
--spectrum-picker-l-texticon-icon-gap,var(--spectrum-global-dimension-size-115)
|
|
91
|
+
);--spectrum-picker-texticon-placeholder-font-style:var(
|
|
92
|
+
--spectrum-picker-l-texticon-placeholder-font-style,var(--spectrum-global-font-style-italic)
|
|
93
|
+
);--spectrum-picker-texticon-placeholder-font-weight:var(
|
|
94
|
+
--spectrum-picker-l-texticon-placeholder-font-weight,var(--spectrum-global-font-weight-regular)
|
|
95
|
+
);--spectrum-picker-texticon-error-icon-margin-left:var(
|
|
96
|
+
--spectrum-picker-l-texticon-error-icon-margin-left,var(--spectrum-global-dimension-size-185)
|
|
97
|
+
);--spectrum-picker-texticon-ui-icon-gap:var(
|
|
98
|
+
--spectrum-picker-l-texticon-ui-icon-gap,var(--spectrum-global-dimension-size-115)
|
|
99
|
+
);--spectrum-picker-texticon-popover-max-width:var(
|
|
100
|
+
--spectrum-picker-l-texticon-popover-max-width,var(--spectrum-global-dimension-size-3000)
|
|
101
|
+
);--spectrum-picker-texticon-padding-left:var(
|
|
102
|
+
--spectrum-picker-l-texticon-padding-left,var(--spectrum-global-dimension-size-160)
|
|
103
|
+
);--spectrum-picker-texticon-height:var(
|
|
104
|
+
--spectrum-picker-l-texticon-height,var(--spectrum-global-dimension-size-500)
|
|
105
|
+
);--spectrum-picker-texticon-min-width:var(
|
|
106
|
+
--spectrum-picker-l-texticon-min-width,var(--spectrum-global-dimension-size-750)
|
|
107
|
+
);--spectrum-picker-texticon-width:var(
|
|
108
|
+
--spectrum-picker-l-texticon-width,var(--spectrum-global-dimension-size-2500)
|
|
109
|
+
);--spectrum-picker-texticon-border-radius:var(
|
|
110
|
+
--spectrum-picker-l-texticon-border-radius,var(--spectrum-alias-component-border-radius)
|
|
111
|
+
);--spectrum-picker-textonly-border-size:var(
|
|
112
|
+
--spectrum-picker-l-textonly-border-size,var(--spectrum-alias-border-size-thin)
|
|
113
|
+
);--spectrum-picker-textonly-padding-left:var(
|
|
114
|
+
--spectrum-picker-l-textonly-padding-left,var(--spectrum-global-dimension-size-185)
|
|
115
|
+
);--spectrum-picker-textonly-padding-right:var(
|
|
116
|
+
--spectrum-picker-l-textonly-padding-right,var(--spectrum-global-dimension-size-185)
|
|
117
|
+
);--spectrum-picker-textonly-border-radius:var(
|
|
118
|
+
--spectrum-picker-l-textonly-border-radius,var(--spectrum-alias-component-border-radius)
|
|
119
|
+
)}:host([size=xl]){--spectrum-picker-texticon-border-size:var(
|
|
120
|
+
--spectrum-picker-xl-texticon-border-size,var(--spectrum-alias-border-size-thin)
|
|
121
|
+
);--spectrum-picker-texticon-text-size:var(
|
|
122
|
+
--spectrum-picker-xl-texticon-text-size,var(--spectrum-global-dimension-font-size-300)
|
|
123
|
+
);--spectrum-picker-texticon-icon-gap:var(
|
|
124
|
+
--spectrum-picker-xl-texticon-icon-gap,var(--spectrum-global-dimension-size-125)
|
|
125
|
+
);--spectrum-picker-texticon-placeholder-font-style:var(
|
|
126
|
+
--spectrum-picker-xl-texticon-placeholder-font-style,var(--spectrum-global-font-style-italic)
|
|
127
|
+
);--spectrum-picker-texticon-placeholder-font-weight:var(
|
|
128
|
+
--spectrum-picker-xl-texticon-placeholder-font-weight,var(--spectrum-global-font-weight-regular)
|
|
129
|
+
);--spectrum-picker-texticon-error-icon-margin-left:var(
|
|
130
|
+
--spectrum-picker-xl-texticon-error-icon-margin-left,var(--spectrum-global-dimension-size-225)
|
|
131
|
+
);--spectrum-picker-texticon-ui-icon-gap:var(
|
|
132
|
+
--spectrum-picker-xl-texticon-ui-icon-gap,var(--spectrum-global-dimension-size-125)
|
|
133
|
+
);--spectrum-picker-texticon-popover-max-width:var(
|
|
134
|
+
--spectrum-picker-xl-texticon-popover-max-width,var(--spectrum-global-dimension-size-3600)
|
|
135
|
+
);--spectrum-picker-texticon-padding-left:var(
|
|
136
|
+
--spectrum-picker-xl-texticon-padding-left,var(--spectrum-global-dimension-size-185)
|
|
137
|
+
);--spectrum-picker-texticon-height:var(
|
|
138
|
+
--spectrum-picker-xl-texticon-height,var(--spectrum-global-dimension-size-600)
|
|
139
|
+
);--spectrum-picker-texticon-min-width:var(
|
|
140
|
+
--spectrum-picker-xl-texticon-min-width,var(--spectrum-global-dimension-size-900)
|
|
141
|
+
);--spectrum-picker-texticon-width:var(
|
|
142
|
+
--spectrum-picker-xl-texticon-width,var(--spectrum-global-dimension-size-3000)
|
|
143
|
+
);--spectrum-picker-texticon-border-radius:var(
|
|
144
|
+
--spectrum-picker-xl-texticon-border-radius,var(--spectrum-alias-component-border-radius)
|
|
145
|
+
);--spectrum-picker-textonly-border-size:var(
|
|
146
|
+
--spectrum-picker-xl-textonly-border-size,var(--spectrum-alias-border-size-thin)
|
|
147
|
+
);--spectrum-picker-textonly-padding-left:var(
|
|
148
|
+
--spectrum-picker-xl-textonly-padding-left,var(--spectrum-global-dimension-size-225)
|
|
149
|
+
);--spectrum-picker-textonly-padding-right:var(
|
|
150
|
+
--spectrum-picker-xl-textonly-padding-right,var(--spectrum-global-dimension-size-225)
|
|
151
|
+
);--spectrum-picker-textonly-border-radius:var(
|
|
152
|
+
--spectrum-picker-xl-textonly-border-radius,var(--spectrum-alias-component-border-radius)
|
|
153
|
+
)}:host{--spectrum-picker-texticon-min-width:var(
|
|
154
|
+
--spectrum-global-dimension-size-400
|
|
155
|
+
);--spectrum-picker-texticon-disabled-border-size:0;--spectrum-picker-texticon-popover-max-width:var(
|
|
156
|
+
--spectrum-global-dimension-size-3000
|
|
157
|
+
);--spectrum-picker-texticon-width:var(
|
|
158
|
+
--spectrum-global-dimension-size-2400
|
|
159
|
+
);--spectrum-picker-texticon-border-size-increase-focus:1px;--spectrum-picker-padding-left-adjusted:calc(var(--spectrum-picker-texticon-padding-left) - var(--spectrum-picker-texticon-border-size));--spectrum-picker-textonly-padding-left-adjusted:calc(var(--spectrum-picker-textonly-padding-left) - var(--spectrum-picker-textonly-border-size));--spectrum-picker-textonly-padding-right-adjusted:calc(var(--spectrum-picker-textonly-padding-right) - var(--spectrum-picker-textonly-border-size));--spectrum-picker-focus-ring-border-radius-adjusted:calc(var(--spectrum-picker-textonly-border-radius) + var(--spectrum-picker-focus-ring-gap))}:host{--spectrum-picker-focus-ring-gap:var(
|
|
160
|
+
--spectrum-alias-component-focusring-gap,var(--spectrum-global-dimension-static-size-0)
|
|
161
|
+
);--spectrum-picker-focus-ring-size:var(
|
|
162
|
+
--spectrum-alias-component-focusring-size,var(--spectrum-global-dimension-static-size-10)
|
|
163
|
+
);--spectrum-picker-focus-ring-color:var(
|
|
164
|
+
--spectrum-picker-m-textonly-focusring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)
|
|
165
|
+
)}#button{transition:border-color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}#button:after{border-radius:var(--spectrum-picker-focus-ring-border-radius-adjusted);bottom:0;content:"";left:0;margin:calc((var(--spectrum-picker-focus-ring-gap) + var(--spectrum-picker-textonly-border-size))*-1);pointer-events:none;position:absolute;right:0;top:0;transition:box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-in-out}#button.focus-visible{box-shadow:none}#button:focus-visible{box-shadow:none}#button.focus-visible:after{box-shadow:0 0 0 var(--spectrum-picker-focus-ring-size) var(--spectrum-picker-focus-ring-color)}#button:focus-visible:after{box-shadow:0 0 0 var(--spectrum-picker-focus-ring-size) var(--spectrum-picker-focus-ring-color)}:host([quiet]){--spectrum-picker-texticon-border-size:0;--spectrum-picker-texticon-border-radius:0;--spectrum-picker-textonly-padding-left:0;--spectrum-picker-textonly-padding-right:0;--spectrum-picker-quiet-background-color-key-focus:transparent;--spectrum-picker-quiet-border-color-key-focus:var(
|
|
166
|
+
--spectrum-global-color-blue-400
|
|
167
|
+
)}:host([quiet]) #button{min-width:0;width:auto}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{box-shadow:none}:host([quiet]) #button:disabled:focus-visible,:host([quiet][disabled]) #button:focus-visible{box-shadow:none}:host([dir=ltr]) #label{text-align:left}:host([dir=rtl]) #label{text-align:right}#label{flex:1 1 auto;font-size:var(--spectrum-picker-texticon-text-size);height:calc(var(--spectrum-picker-texticon-height) - var(--spectrum-picker-texticon-border-size)*2);line-height:calc(var(--spectrum-picker-texticon-height) - var(--spectrum-picker-texticon-border-size)*2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#label.placeholder{font-style:var(--spectrum-picker-texticon-placeholder-font-style);font-weight:var(
|
|
168
|
+
--spectrum-picker-texticon-placeholder-font-weight
|
|
169
|
+
);transition:color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}.picker{display:inline-block;flex-shrink:0;position:relative;transition:color var(--spectrum-global-animation-duration-100,.13s) ease-out;vertical-align:top}:host([dir=ltr]) .validation-icon{margin-left:var(
|
|
170
|
+
--spectrum-picker-texticon-error-icon-margin-left
|
|
171
|
+
)}:host([dir=rtl]) .validation-icon{margin-right:var(
|
|
172
|
+
--spectrum-picker-texticon-error-icon-margin-left
|
|
173
|
+
)}:host([dir=ltr]) #label~.picker{margin-left:var(
|
|
174
|
+
--spectrum-picker-texticon-ui-icon-gap
|
|
175
|
+
)}:host([dir=rtl]) #label~.picker{margin-right:var(
|
|
176
|
+
--spectrum-picker-texticon-ui-icon-gap
|
|
177
|
+
)}#popover{max-width:var(
|
|
178
|
+
--spectrum-picker-texticon-popover-max-width
|
|
179
|
+
)}:host([dir=ltr]) .spectrum-Picker-popover--quiet{margin-left:calc((var(
|
|
180
|
+
--spectrum-picker-m-quiet-texticon-popover-offset-x,
|
|
181
|
+
var(--spectrum-global-dimension-size-150)
|
|
182
|
+
) + var(
|
|
183
|
+
--spectrum-popover-border-size,
|
|
184
|
+
var(--spectrum-alias-border-size-thin)
|
|
185
|
+
))*-1)}:host([dir=rtl]) .spectrum-Picker-popover--quiet{margin-right:calc((var(
|
|
186
|
+
--spectrum-picker-m-quiet-texticon-popover-offset-x,
|
|
187
|
+
var(--spectrum-global-dimension-size-150)
|
|
188
|
+
) + var(
|
|
189
|
+
--spectrum-popover-border-size,
|
|
190
|
+
var(--spectrum-alias-border-size-thin)
|
|
191
|
+
))*-1)}#button{background-color:var(
|
|
192
|
+
--spectrum-picker-m-texticon-background-color,var(--spectrum-alias-component-background-color-default)
|
|
193
|
+
);border-color:var(
|
|
194
|
+
--spectrum-picker-m-texticon-border-color,var(--spectrum-alias-component-border-color-default)
|
|
195
|
+
);color:var(
|
|
196
|
+
--spectrum-picker-m-texticon-text-color,var(--spectrum-alias-component-text-color-default)
|
|
197
|
+
)}#button:hover{background-color:var(
|
|
198
|
+
--spectrum-picker-m-texticon-background-color-hover,var(--spectrum-alias-component-background-color-hover)
|
|
199
|
+
);border-color:var(
|
|
200
|
+
--spectrum-picker-m-texticon-border-color-hover,var(--spectrum-alias-component-border-color-hover)
|
|
201
|
+
);color:var(
|
|
202
|
+
--spectrum-picker-m-texticon-text-color-hover,var(--spectrum-alias-component-text-color-hover)
|
|
203
|
+
)}#button:hover .picker{color:var(
|
|
204
|
+
--spectrum-picker-m-texticon-icon-color-hover,var(--spectrum-alias-component-icon-color-hover)
|
|
205
|
+
)}#button:active,:host([open]) #button{background-color:var(
|
|
206
|
+
--spectrum-picker-m-texticon-background-color-down,var(--spectrum-alias-component-background-color-down)
|
|
207
|
+
);border-color:var(
|
|
208
|
+
--spectrum-picker-m-texticon-border-color-down,var(--spectrum-alias-component-border-color-down)
|
|
209
|
+
)}#button:active.placeholder #label,:host([open]) #button.placeholder #label{color:var(
|
|
210
|
+
--spectrum-picker-m-texticon-placeholder-text-color-down,var(--spectrum-alias-placeholder-text-color-down)
|
|
211
|
+
)}#button.focus-visible,:host([focused]) #button{background-color:var(
|
|
212
|
+
--spectrum-picker-m-texticon-background-color-key-focus,var(--spectrum-alias-component-background-color-key-focus)
|
|
213
|
+
);border-color:var(
|
|
214
|
+
--spectrum-picker-m-texticon-border-color-key-focus,var(--spectrum-alias-component-border-color-key-focus)
|
|
215
|
+
);box-shadow:0 0 0 var(--spectrum-picker-texticon-border-size-increase-focus) var(--spectrum-picker-quiet-border-color-key-focus);color:var(
|
|
216
|
+
--spectrum-picker-m-texticon-text-color-key-focus,var(--spectrum-alias-component-text-color-key-focus)
|
|
217
|
+
)}#button:focus-visible,:host([focused]) #button{background-color:var(
|
|
218
|
+
--spectrum-picker-m-texticon-background-color-key-focus,var(--spectrum-alias-component-background-color-key-focus)
|
|
219
|
+
);border-color:var(
|
|
220
|
+
--spectrum-picker-m-texticon-border-color-key-focus,var(--spectrum-alias-component-border-color-key-focus)
|
|
221
|
+
);box-shadow:0 0 0 var(--spectrum-picker-texticon-border-size-increase-focus) var(--spectrum-picker-quiet-border-color-key-focus);color:var(
|
|
222
|
+
--spectrum-picker-m-texticon-text-color-key-focus,var(--spectrum-alias-component-text-color-key-focus)
|
|
223
|
+
)}#button.focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(
|
|
224
|
+
--spectrum-picker-m-texticon-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)
|
|
225
|
+
)}#button:focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(
|
|
226
|
+
--spectrum-picker-m-texticon-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)
|
|
227
|
+
)}:host([invalid]) #button{border-color:var(
|
|
228
|
+
--spectrum-picker-m-texticon-border-color-error,var(--spectrum-semantic-negative-color-default)
|
|
229
|
+
)}:host([invalid]) #button .validation-icon{color:var(
|
|
230
|
+
--spectrum-picker-m-texticon-validation-icon-color-error,var(--spectrum-semantic-negative-icon-color)
|
|
231
|
+
)}:host([invalid]) #button:hover{border-color:var(
|
|
232
|
+
--spectrum-picker-m-texticon-border-color-error-hover,var(--spectrum-semantic-negative-color-hover)
|
|
233
|
+
)}:host([invalid]) #button:active,:host([invalid][open]) #button{border-color:var(
|
|
234
|
+
--spectrum-picker-m-texticon-border-color-error-down,var(--spectrum-semantic-negative-color-down)
|
|
235
|
+
)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(
|
|
236
|
+
--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)
|
|
237
|
+
);box-shadow:0 0 0 var(--spectrum-picker-texticon-border-size-increase-focus) var(
|
|
238
|
+
--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)
|
|
239
|
+
)}:host([invalid]) #button:focus-visible,:host([invalid][focused]) #button{border-color:var(
|
|
240
|
+
--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)
|
|
241
|
+
);box-shadow:0 0 0 var(--spectrum-picker-texticon-border-size-increase-focus) var(
|
|
242
|
+
--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)
|
|
243
|
+
)}#button:disabled,:host([disabled]) #button{background-color:var(
|
|
244
|
+
--spectrum-picker-m-texticon-background-color-disabled,var(--spectrum-alias-component-background-color-disabled)
|
|
245
|
+
);color:var(
|
|
246
|
+
--spectrum-picker-m-texticon-text-color-disabled,var(--spectrum-alias-component-text-color-disabled)
|
|
247
|
+
)}#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(
|
|
248
|
+
--spectrum-picker-m-texticon-icon-color-disabled,var(--spectrum-alias-component-icon-color-disabled)
|
|
249
|
+
)}#button:disabled #label.placeholder,:host([disabled]) #button #label.placeholder{color:var(
|
|
250
|
+
--spectrum-picker-m-texticon-placeholder-text-color-disabled,var(--spectrum-alias-text-color-disabled)
|
|
251
|
+
)}.picker{color:var(
|
|
252
|
+
--spectrum-picker-m-texticon-icon-color,var(--spectrum-alias-component-icon-color-default)
|
|
253
|
+
)}#label.placeholder{color:var(
|
|
254
|
+
--spectrum-picker-m-texticon-placeholder-text-color,var(--spectrum-alias-placeholder-text-color)
|
|
255
|
+
)}#label.placeholder:hover{color:var(
|
|
256
|
+
--spectrum-picker-m-texticon-placeholder-text-color-hover,var(--spectrum-alias-placeholder-text-color-hover)
|
|
257
|
+
)}#label.placeholder:active{color:var(
|
|
258
|
+
--spectrum-picker-m-texticon-placeholder-text-color-mouse-focus,var(--spectrum-alias-placeholder-text-color-down)
|
|
259
|
+
)}:host([quiet]) #button{background-color:var(
|
|
260
|
+
--spectrum-picker-m-quiet-texticon-background-color,var(--spectrum-alias-component-background-color-quiet-default)
|
|
261
|
+
);border-color:var(
|
|
262
|
+
--spectrum-picker-m-quiet-texticon-border-color,var(--spectrum-alias-component-border-color-quiet-default)
|
|
263
|
+
);color:var(
|
|
264
|
+
--spectrum-picker-m-texticon-text-color,var(--spectrum-alias-component-text-color-default)
|
|
265
|
+
)}:host([quiet]) #button:hover{background-color:var(
|
|
266
|
+
--spectrum-picker-m-quiet-texticon-background-color-hover,var(--spectrum-alias-component-background-color-quiet-hover)
|
|
267
|
+
);color:var(
|
|
268
|
+
--spectrum-picker-m-texticon-text-color-hover,var(--spectrum-alias-component-text-color-hover)
|
|
269
|
+
)}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:var(
|
|
270
|
+
--spectrum-picker-quiet-background-color-key-focus
|
|
271
|
+
);box-shadow:0 2px 0 0 var(--spectrum-picker-quiet-border-color-key-focus)}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{background-color:var(
|
|
272
|
+
--spectrum-picker-quiet-background-color-key-focus
|
|
273
|
+
);box-shadow:0 2px 0 0 var(--spectrum-picker-quiet-border-color-key-focus)}:host([quiet]) #button.focus-visible.placeholder,:host([quiet][focused]) #button.placeholder{color:var(
|
|
274
|
+
--spectrum-picker-m-quiet-texticon-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)
|
|
275
|
+
)}:host([quiet]) #button:focus-visible.placeholder,:host([quiet][focused]) #button.placeholder{color:var(
|
|
276
|
+
--spectrum-picker-m-quiet-texticon-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)
|
|
277
|
+
)}:host([quiet]) #button.focus-visible .picker,:host([quiet][focused]) #button .picker{color:var(
|
|
278
|
+
--spectrum-picker-m-texticon-icon-color-key-focus,var(--spectrum-alias-component-icon-color-key-focus)
|
|
279
|
+
)}:host([quiet]) #button:focus-visible .picker,:host([quiet][focused]) #button .picker{color:var(
|
|
280
|
+
--spectrum-picker-m-texticon-icon-color-key-focus,var(--spectrum-alias-component-icon-color-key-focus)
|
|
281
|
+
)}:host([quiet]) #button.focus-visible:after,:host([quiet][focused]) #button:after{box-shadow:none}:host([quiet]) #button:focus-visible:after,:host([quiet][focused]) #button:after{box-shadow:none}:host([quiet]) #button:active,:host([quiet][open]) #button{background-color:var(
|
|
282
|
+
--spectrum-picker-m-quiet-texticon-background-color-down,var(--spectrum-alias-background-color-transparent)
|
|
283
|
+
);border-color:var(
|
|
284
|
+
--spectrum-picker-m-quiet-texticon-border-color-down,var(--spectrum-alias-component-border-color-quiet-down)
|
|
285
|
+
)}:host([quiet]) #button:active.focus-visible,:host([quiet][focused]) #button:active,:host([quiet][open]) #button.focus-visible,:host([quiet][open][focused]) #button{background-color:var(
|
|
286
|
+
--spectrum-picker-quiet-background-color-key-focus
|
|
287
|
+
);box-shadow:0 2px 0 0 var(--spectrum-picker-quiet-border-color-key-focus)}:host([quiet]) #button:active:focus-visible,:host([quiet][focused]) #button:active,:host([quiet][open]) #button:focus-visible,:host([quiet][open][focused]) #button{background-color:var(
|
|
288
|
+
--spectrum-picker-quiet-background-color-key-focus
|
|
289
|
+
);box-shadow:0 2px 0 0 var(--spectrum-picker-quiet-border-color-key-focus)}:host([quiet][invalid]) #button.focus-visible,:host([quiet][invalid][focused]) #button{box-shadow:0 2px 0 0 var(
|
|
290
|
+
--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)
|
|
291
|
+
)}:host([quiet][invalid]) #button:focus-visible,:host([quiet][invalid][focused]) #button{box-shadow:0 2px 0 0 var(
|
|
292
|
+
--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)
|
|
293
|
+
)}:host([quiet]) #button:disabled,:host([quiet][disabled]) #button{background-color:var(
|
|
294
|
+
--spectrum-picker-m-quiet-texticon-background-color-disabled,var(--spectrum-alias-component-background-color-quiet-disabled)
|
|
295
|
+
);color:var(
|
|
296
|
+
--spectrum-picker-m-texticon-text-color-disabled,var(--spectrum-alias-component-text-color-disabled)
|
|
297
|
+
)}: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%}: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(
|
|
298
|
+
--spectrum-picker-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)
|
|
299
|
+
)}:host([focused]:not([quiet])) #button .picker{color:var(
|
|
300
|
+
--spectrum-picker-icon-color-key-focus,var(--spectrum-alias-icon-color-focus)
|
|
301
|
+
)}.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}:host([dir=ltr]) #label.visually-hidden+.picker{margin-left:auto}:host([dir=rtl]) #label.visually-hidden+.picker{margin-right:auto}
|
|
302
|
+
`;
|
|
303
|
+
export default styles;
|
|
304
|
+
//# sourceMappingURL=picker.css.dev.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["picker.css.ts"],
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2022 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;-webkit-appearance:button;box-sizing:border-box;cursor:pointer;display:inline-flex;font-family:var(\n--spectrum-alias-body-text-font-family,var(--spectrum-global-font-family-base)\n);line-height:var(\n--spectrum-alias-component-text-line-height,var(--spectrum-global-font-line-height-small)\n);overflow:visible;position:relative;text-decoration:none;text-transform:none;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;user-select:none;-webkit-user-select:none;vertical-align:top}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;margin-bottom:-2px;margin-top:-2px;padding:0}#button:disabled{cursor:default}:host([dir=ltr]) #button{padding-left:var(\n--spectrum-picker-textonly-padding-left-adjusted\n);padding-right:var(--spectrum-picker-textonly-padding-right-adjusted)}:host([dir=rtl]) #button{padding-left:var(--spectrum-picker-textonly-padding-right-adjusted);padding-right:var(\n--spectrum-picker-textonly-padding-left-adjusted\n)}#button{align-items:center;border-radius:var(--spectrum-picker-texticon-border-radius);border-style:solid;border-width:var(--spectrum-picker-texticon-border-size);display:flex;height:var(--spectrum-picker-texticon-height);justify-content:center;margin:0;min-width:var(--spectrum-picker-texticon-min-width);padding-bottom:0;padding-top:0;transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);width:var(--spectrum-picker-texticon-width)}#button:disabled,:host([disabled]) #button{border-width:var(\n--spectrum-picker-texticon-disabled-border-size\n);cursor:default}:host([dir=ltr]) #button .icon{margin-right:var(\n--spectrum-picker-texticon-icon-gap\n)}:host([dir=rtl]) #button .icon{margin-left:var(\n--spectrum-picker-texticon-icon-gap\n)}.icon{flex-shrink:0}:host([dir=ltr]) #button #label+.icon{margin-left:calc((var(--spectrum-picker-textonly-padding-left-adjusted) - var(--spectrum-picker-padding-left-adjusted))*-1)}:host([dir=rtl]) #button #label+.icon{margin-right:calc((var(--spectrum-picker-textonly-padding-left-adjusted) - var(--spectrum-picker-padding-left-adjusted))*-1)}:host([size=s]){--spectrum-picker-texticon-border-size:var(\n--spectrum-picker-s-texticon-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-picker-texticon-text-size:var(\n--spectrum-picker-s-texticon-text-size,var(--spectrum-global-dimension-font-size-75)\n);--spectrum-picker-texticon-icon-gap:var(\n--spectrum-picker-s-texticon-icon-gap,var(--spectrum-global-dimension-size-85)\n);--spectrum-picker-texticon-placeholder-font-style:var(\n--spectrum-picker-s-texticon-placeholder-font-style,var(--spectrum-global-font-style-italic)\n);--spectrum-picker-texticon-placeholder-font-weight:var(\n--spectrum-picker-s-texticon-placeholder-font-weight,var(--spectrum-global-font-weight-regular)\n);--spectrum-picker-texticon-error-icon-margin-left:var(\n--spectrum-picker-s-texticon-error-icon-margin-left,var(--spectrum-global-dimension-size-100)\n);--spectrum-picker-texticon-ui-icon-gap:var(\n--spectrum-picker-s-texticon-ui-icon-gap,var(--spectrum-global-dimension-size-85)\n);--spectrum-picker-texticon-popover-max-width:var(\n--spectrum-picker-s-texticon-popover-max-width,var(--spectrum-global-dimension-size-1800)\n);--spectrum-picker-texticon-padding-left:var(\n--spectrum-picker-s-texticon-padding-left,var(--spectrum-global-dimension-size-85)\n);--spectrum-picker-texticon-height:var(\n--spectrum-picker-s-texticon-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-picker-texticon-min-width:var(\n--spectrum-picker-s-texticon-min-width,var(--spectrum-global-dimension-size-450)\n);--spectrum-picker-texticon-width:var(\n--spectrum-picker-s-texticon-width,var(--spectrum-global-dimension-size-2000)\n);--spectrum-picker-texticon-border-radius:var(\n--spectrum-picker-s-texticon-border-radius,var(--spectrum-alias-component-border-radius)\n);--spectrum-picker-textonly-border-size:var(\n--spectrum-picker-s-textonly-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-picker-textonly-padding-left:var(\n--spectrum-picker-s-textonly-padding-left,var(--spectrum-global-dimension-size-115)\n);--spectrum-picker-textonly-padding-right:var(\n--spectrum-picker-s-textonly-padding-right,var(--spectrum-global-dimension-size-115)\n);--spectrum-picker-textonly-border-radius:var(\n--spectrum-picker-s-textonly-border-radius,var(--spectrum-alias-component-border-radius)\n)}:host([size=m]){--spectrum-picker-texticon-padding-left:var(\n--spectrum-picker-m-texticon-padding-left\n);--spectrum-picker-texticon-border-size:var(\n--spectrum-picker-m-texticon-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-picker-texticon-text-size:var(\n--spectrum-picker-m-texticon-text-size,var(--spectrum-global-dimension-font-size-100)\n);--spectrum-picker-texticon-icon-gap:var(\n--spectrum-picker-m-texticon-icon-gap,var(--spectrum-global-dimension-size-100)\n);--spectrum-picker-texticon-placeholder-font-style:var(\n--spectrum-picker-m-texticon-placeholder-font-style,var(--spectrum-global-font-style-italic)\n);--spectrum-picker-texticon-placeholder-font-weight:var(\n--spectrum-picker-m-texticon-placeholder-font-weight,var(--spectrum-global-font-weight-regular)\n);--spectrum-picker-texticon-error-icon-margin-left:var(\n--spectrum-picker-m-texticon-error-icon-margin-left,var(--spectrum-global-dimension-size-150)\n);--spectrum-picker-texticon-ui-icon-gap:var(\n--spectrum-picker-m-texticon-ui-icon-gap,var(--spectrum-global-dimension-size-100)\n);--spectrum-picker-texticon-popover-max-width:var(\n--spectrum-picker-m-texticon-popover-max-width,var(--spectrum-global-dimension-size-2400)\n);--spectrum-picker-texticon-height:var(\n--spectrum-picker-m-texticon-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-picker-texticon-min-width:var(\n--spectrum-picker-m-texticon-min-width,var(--spectrum-global-dimension-size-600)\n);--spectrum-picker-texticon-width:var(\n--spectrum-picker-m-texticon-width,var(--spectrum-global-dimension-size-2400)\n);--spectrum-picker-texticon-border-radius:var(\n--spectrum-picker-m-texticon-border-radius,var(--spectrum-alias-component-border-radius)\n);--spectrum-picker-textonly-border-size:var(\n--spectrum-picker-m-textonly-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-picker-textonly-padding-left:var(\n--spectrum-picker-m-textonly-padding-left,var(--spectrum-global-dimension-size-150)\n);--spectrum-picker-textonly-padding-right:var(\n--spectrum-picker-m-textonly-padding-right,var(--spectrum-global-dimension-size-150)\n);--spectrum-picker-textonly-border-radius:var(\n--spectrum-picker-m-textonly-border-radius,var(--spectrum-alias-component-border-radius)\n)}:host([size=l]){--spectrum-picker-texticon-border-size:var(\n--spectrum-picker-l-texticon-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-picker-texticon-text-size:var(\n--spectrum-picker-l-texticon-text-size,var(--spectrum-global-dimension-font-size-200)\n);--spectrum-picker-texticon-icon-gap:var(\n--spectrum-picker-l-texticon-icon-gap,var(--spectrum-global-dimension-size-115)\n);--spectrum-picker-texticon-placeholder-font-style:var(\n--spectrum-picker-l-texticon-placeholder-font-style,var(--spectrum-global-font-style-italic)\n);--spectrum-picker-texticon-placeholder-font-weight:var(\n--spectrum-picker-l-texticon-placeholder-font-weight,var(--spectrum-global-font-weight-regular)\n);--spectrum-picker-texticon-error-icon-margin-left:var(\n--spectrum-picker-l-texticon-error-icon-margin-left,var(--spectrum-global-dimension-size-185)\n);--spectrum-picker-texticon-ui-icon-gap:var(\n--spectrum-picker-l-texticon-ui-icon-gap,var(--spectrum-global-dimension-size-115)\n);--spectrum-picker-texticon-popover-max-width:var(\n--spectrum-picker-l-texticon-popover-max-width,var(--spectrum-global-dimension-size-3000)\n);--spectrum-picker-texticon-padding-left:var(\n--spectrum-picker-l-texticon-padding-left,var(--spectrum-global-dimension-size-160)\n);--spectrum-picker-texticon-height:var(\n--spectrum-picker-l-texticon-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-picker-texticon-min-width:var(\n--spectrum-picker-l-texticon-min-width,var(--spectrum-global-dimension-size-750)\n);--spectrum-picker-texticon-width:var(\n--spectrum-picker-l-texticon-width,var(--spectrum-global-dimension-size-2500)\n);--spectrum-picker-texticon-border-radius:var(\n--spectrum-picker-l-texticon-border-radius,var(--spectrum-alias-component-border-radius)\n);--spectrum-picker-textonly-border-size:var(\n--spectrum-picker-l-textonly-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-picker-textonly-padding-left:var(\n--spectrum-picker-l-textonly-padding-left,var(--spectrum-global-dimension-size-185)\n);--spectrum-picker-textonly-padding-right:var(\n--spectrum-picker-l-textonly-padding-right,var(--spectrum-global-dimension-size-185)\n);--spectrum-picker-textonly-border-radius:var(\n--spectrum-picker-l-textonly-border-radius,var(--spectrum-alias-component-border-radius)\n)}:host([size=xl]){--spectrum-picker-texticon-border-size:var(\n--spectrum-picker-xl-texticon-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-picker-texticon-text-size:var(\n--spectrum-picker-xl-texticon-text-size,var(--spectrum-global-dimension-font-size-300)\n);--spectrum-picker-texticon-icon-gap:var(\n--spectrum-picker-xl-texticon-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-picker-texticon-placeholder-font-style:var(\n--spectrum-picker-xl-texticon-placeholder-font-style,var(--spectrum-global-font-style-italic)\n);--spectrum-picker-texticon-placeholder-font-weight:var(\n--spectrum-picker-xl-texticon-placeholder-font-weight,var(--spectrum-global-font-weight-regular)\n);--spectrum-picker-texticon-error-icon-margin-left:var(\n--spectrum-picker-xl-texticon-error-icon-margin-left,var(--spectrum-global-dimension-size-225)\n);--spectrum-picker-texticon-ui-icon-gap:var(\n--spectrum-picker-xl-texticon-ui-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-picker-texticon-popover-max-width:var(\n--spectrum-picker-xl-texticon-popover-max-width,var(--spectrum-global-dimension-size-3600)\n);--spectrum-picker-texticon-padding-left:var(\n--spectrum-picker-xl-texticon-padding-left,var(--spectrum-global-dimension-size-185)\n);--spectrum-picker-texticon-height:var(\n--spectrum-picker-xl-texticon-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-picker-texticon-min-width:var(\n--spectrum-picker-xl-texticon-min-width,var(--spectrum-global-dimension-size-900)\n);--spectrum-picker-texticon-width:var(\n--spectrum-picker-xl-texticon-width,var(--spectrum-global-dimension-size-3000)\n);--spectrum-picker-texticon-border-radius:var(\n--spectrum-picker-xl-texticon-border-radius,var(--spectrum-alias-component-border-radius)\n);--spectrum-picker-textonly-border-size:var(\n--spectrum-picker-xl-textonly-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-picker-textonly-padding-left:var(\n--spectrum-picker-xl-textonly-padding-left,var(--spectrum-global-dimension-size-225)\n);--spectrum-picker-textonly-padding-right:var(\n--spectrum-picker-xl-textonly-padding-right,var(--spectrum-global-dimension-size-225)\n);--spectrum-picker-textonly-border-radius:var(\n--spectrum-picker-xl-textonly-border-radius,var(--spectrum-alias-component-border-radius)\n)}:host{--spectrum-picker-texticon-min-width:var(\n--spectrum-global-dimension-size-400\n);--spectrum-picker-texticon-disabled-border-size:0;--spectrum-picker-texticon-popover-max-width:var(\n--spectrum-global-dimension-size-3000\n);--spectrum-picker-texticon-width:var(\n--spectrum-global-dimension-size-2400\n);--spectrum-picker-texticon-border-size-increase-focus:1px;--spectrum-picker-padding-left-adjusted:calc(var(--spectrum-picker-texticon-padding-left) - var(--spectrum-picker-texticon-border-size));--spectrum-picker-textonly-padding-left-adjusted:calc(var(--spectrum-picker-textonly-padding-left) - var(--spectrum-picker-textonly-border-size));--spectrum-picker-textonly-padding-right-adjusted:calc(var(--spectrum-picker-textonly-padding-right) - var(--spectrum-picker-textonly-border-size));--spectrum-picker-focus-ring-border-radius-adjusted:calc(var(--spectrum-picker-textonly-border-radius) + var(--spectrum-picker-focus-ring-gap))}:host{--spectrum-picker-focus-ring-gap:var(\n--spectrum-alias-component-focusring-gap,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-picker-focus-ring-size:var(\n--spectrum-alias-component-focusring-size,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-picker-focus-ring-color:var(\n--spectrum-picker-m-textonly-focusring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n)}#button{transition:border-color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}#button:after{border-radius:var(--spectrum-picker-focus-ring-border-radius-adjusted);bottom:0;content:\"\";left:0;margin:calc((var(--spectrum-picker-focus-ring-gap) + var(--spectrum-picker-textonly-border-size))*-1);pointer-events:none;position:absolute;right:0;top:0;transition:box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-in-out}#button.focus-visible{box-shadow:none}#button:focus-visible{box-shadow:none}#button.focus-visible:after{box-shadow:0 0 0 var(--spectrum-picker-focus-ring-size) var(--spectrum-picker-focus-ring-color)}#button:focus-visible:after{box-shadow:0 0 0 var(--spectrum-picker-focus-ring-size) var(--spectrum-picker-focus-ring-color)}:host([quiet]){--spectrum-picker-texticon-border-size:0;--spectrum-picker-texticon-border-radius:0;--spectrum-picker-textonly-padding-left:0;--spectrum-picker-textonly-padding-right:0;--spectrum-picker-quiet-background-color-key-focus:transparent;--spectrum-picker-quiet-border-color-key-focus:var(\n--spectrum-global-color-blue-400\n)}:host([quiet]) #button{min-width:0;width:auto}:host([quiet]) #button:disabled.focus-visible,:host([quiet][disabled]) #button.focus-visible{box-shadow:none}:host([quiet]) #button:disabled:focus-visible,:host([quiet][disabled]) #button:focus-visible{box-shadow:none}:host([dir=ltr]) #label{text-align:left}:host([dir=rtl]) #label{text-align:right}#label{flex:1 1 auto;font-size:var(--spectrum-picker-texticon-text-size);height:calc(var(--spectrum-picker-texticon-height) - var(--spectrum-picker-texticon-border-size)*2);line-height:calc(var(--spectrum-picker-texticon-height) - var(--spectrum-picker-texticon-border-size)*2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#label.placeholder{font-style:var(--spectrum-picker-texticon-placeholder-font-style);font-weight:var(\n--spectrum-picker-texticon-placeholder-font-weight\n);transition:color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}.picker{display:inline-block;flex-shrink:0;position:relative;transition:color var(--spectrum-global-animation-duration-100,.13s) ease-out;vertical-align:top}:host([dir=ltr]) .validation-icon{margin-left:var(\n--spectrum-picker-texticon-error-icon-margin-left\n)}:host([dir=rtl]) .validation-icon{margin-right:var(\n--spectrum-picker-texticon-error-icon-margin-left\n)}:host([dir=ltr]) #label~.picker{margin-left:var(\n--spectrum-picker-texticon-ui-icon-gap\n)}:host([dir=rtl]) #label~.picker{margin-right:var(\n--spectrum-picker-texticon-ui-icon-gap\n)}#popover{max-width:var(\n--spectrum-picker-texticon-popover-max-width\n)}:host([dir=ltr]) .spectrum-Picker-popover--quiet{margin-left:calc((var(\n--spectrum-picker-m-quiet-texticon-popover-offset-x,\nvar(--spectrum-global-dimension-size-150)\n) + var(\n--spectrum-popover-border-size,\nvar(--spectrum-alias-border-size-thin)\n))*-1)}:host([dir=rtl]) .spectrum-Picker-popover--quiet{margin-right:calc((var(\n--spectrum-picker-m-quiet-texticon-popover-offset-x,\nvar(--spectrum-global-dimension-size-150)\n) + var(\n--spectrum-popover-border-size,\nvar(--spectrum-alias-border-size-thin)\n))*-1)}#button{background-color:var(\n--spectrum-picker-m-texticon-background-color,var(--spectrum-alias-component-background-color-default)\n);border-color:var(\n--spectrum-picker-m-texticon-border-color,var(--spectrum-alias-component-border-color-default)\n);color:var(\n--spectrum-picker-m-texticon-text-color,var(--spectrum-alias-component-text-color-default)\n)}#button:hover{background-color:var(\n--spectrum-picker-m-texticon-background-color-hover,var(--spectrum-alias-component-background-color-hover)\n);border-color:var(\n--spectrum-picker-m-texticon-border-color-hover,var(--spectrum-alias-component-border-color-hover)\n);color:var(\n--spectrum-picker-m-texticon-text-color-hover,var(--spectrum-alias-component-text-color-hover)\n)}#button:hover .picker{color:var(\n--spectrum-picker-m-texticon-icon-color-hover,var(--spectrum-alias-component-icon-color-hover)\n)}#button:active,:host([open]) #button{background-color:var(\n--spectrum-picker-m-texticon-background-color-down,var(--spectrum-alias-component-background-color-down)\n);border-color:var(\n--spectrum-picker-m-texticon-border-color-down,var(--spectrum-alias-component-border-color-down)\n)}#button:active.placeholder #label,:host([open]) #button.placeholder #label{color:var(\n--spectrum-picker-m-texticon-placeholder-text-color-down,var(--spectrum-alias-placeholder-text-color-down)\n)}#button.focus-visible,:host([focused]) #button{background-color:var(\n--spectrum-picker-m-texticon-background-color-key-focus,var(--spectrum-alias-component-background-color-key-focus)\n);border-color:var(\n--spectrum-picker-m-texticon-border-color-key-focus,var(--spectrum-alias-component-border-color-key-focus)\n);box-shadow:0 0 0 var(--spectrum-picker-texticon-border-size-increase-focus) var(--spectrum-picker-quiet-border-color-key-focus);color:var(\n--spectrum-picker-m-texticon-text-color-key-focus,var(--spectrum-alias-component-text-color-key-focus)\n)}#button:focus-visible,:host([focused]) #button{background-color:var(\n--spectrum-picker-m-texticon-background-color-key-focus,var(--spectrum-alias-component-background-color-key-focus)\n);border-color:var(\n--spectrum-picker-m-texticon-border-color-key-focus,var(--spectrum-alias-component-border-color-key-focus)\n);box-shadow:0 0 0 var(--spectrum-picker-texticon-border-size-increase-focus) var(--spectrum-picker-quiet-border-color-key-focus);color:var(\n--spectrum-picker-m-texticon-text-color-key-focus,var(--spectrum-alias-component-text-color-key-focus)\n)}#button.focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--spectrum-picker-m-texticon-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)\n)}#button:focus-visible.placeholder,:host([focused]) #button.placeholder{color:var(\n--spectrum-picker-m-texticon-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)\n)}:host([invalid]) #button{border-color:var(\n--spectrum-picker-m-texticon-border-color-error,var(--spectrum-semantic-negative-color-default)\n)}:host([invalid]) #button .validation-icon{color:var(\n--spectrum-picker-m-texticon-validation-icon-color-error,var(--spectrum-semantic-negative-icon-color)\n)}:host([invalid]) #button:hover{border-color:var(\n--spectrum-picker-m-texticon-border-color-error-hover,var(--spectrum-semantic-negative-color-hover)\n)}:host([invalid]) #button:active,:host([invalid][open]) #button{border-color:var(\n--spectrum-picker-m-texticon-border-color-error-down,var(--spectrum-semantic-negative-color-down)\n)}:host([invalid]) #button.focus-visible,:host([invalid][focused]) #button{border-color:var(\n--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)\n);box-shadow:0 0 0 var(--spectrum-picker-texticon-border-size-increase-focus) var(\n--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)\n)}:host([invalid]) #button:focus-visible,:host([invalid][focused]) #button{border-color:var(\n--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)\n);box-shadow:0 0 0 var(--spectrum-picker-texticon-border-size-increase-focus) var(\n--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)\n)}#button:disabled,:host([disabled]) #button{background-color:var(\n--spectrum-picker-m-texticon-background-color-disabled,var(--spectrum-alias-component-background-color-disabled)\n);color:var(\n--spectrum-picker-m-texticon-text-color-disabled,var(--spectrum-alias-component-text-color-disabled)\n)}#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--spectrum-picker-m-texticon-icon-color-disabled,var(--spectrum-alias-component-icon-color-disabled)\n)}#button:disabled #label.placeholder,:host([disabled]) #button #label.placeholder{color:var(\n--spectrum-picker-m-texticon-placeholder-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n)}.picker{color:var(\n--spectrum-picker-m-texticon-icon-color,var(--spectrum-alias-component-icon-color-default)\n)}#label.placeholder{color:var(\n--spectrum-picker-m-texticon-placeholder-text-color,var(--spectrum-alias-placeholder-text-color)\n)}#label.placeholder:hover{color:var(\n--spectrum-picker-m-texticon-placeholder-text-color-hover,var(--spectrum-alias-placeholder-text-color-hover)\n)}#label.placeholder:active{color:var(\n--spectrum-picker-m-texticon-placeholder-text-color-mouse-focus,var(--spectrum-alias-placeholder-text-color-down)\n)}:host([quiet]) #button{background-color:var(\n--spectrum-picker-m-quiet-texticon-background-color,var(--spectrum-alias-component-background-color-quiet-default)\n);border-color:var(\n--spectrum-picker-m-quiet-texticon-border-color,var(--spectrum-alias-component-border-color-quiet-default)\n);color:var(\n--spectrum-picker-m-texticon-text-color,var(--spectrum-alias-component-text-color-default)\n)}:host([quiet]) #button:hover{background-color:var(\n--spectrum-picker-m-quiet-texticon-background-color-hover,var(--spectrum-alias-component-background-color-quiet-hover)\n);color:var(\n--spectrum-picker-m-texticon-text-color-hover,var(--spectrum-alias-component-text-color-hover)\n)}:host([quiet]) #button.focus-visible,:host([quiet][focused]) #button{background-color:var(\n--spectrum-picker-quiet-background-color-key-focus\n);box-shadow:0 2px 0 0 var(--spectrum-picker-quiet-border-color-key-focus)}:host([quiet]) #button:focus-visible,:host([quiet][focused]) #button{background-color:var(\n--spectrum-picker-quiet-background-color-key-focus\n);box-shadow:0 2px 0 0 var(--spectrum-picker-quiet-border-color-key-focus)}:host([quiet]) #button.focus-visible.placeholder,:host([quiet][focused]) #button.placeholder{color:var(\n--spectrum-picker-m-quiet-texticon-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)\n)}:host([quiet]) #button:focus-visible.placeholder,:host([quiet][focused]) #button.placeholder{color:var(\n--spectrum-picker-m-quiet-texticon-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover)\n)}:host([quiet]) #button.focus-visible .picker,:host([quiet][focused]) #button .picker{color:var(\n--spectrum-picker-m-texticon-icon-color-key-focus,var(--spectrum-alias-component-icon-color-key-focus)\n)}:host([quiet]) #button:focus-visible .picker,:host([quiet][focused]) #button .picker{color:var(\n--spectrum-picker-m-texticon-icon-color-key-focus,var(--spectrum-alias-component-icon-color-key-focus)\n)}:host([quiet]) #button.focus-visible:after,:host([quiet][focused]) #button:after{box-shadow:none}:host([quiet]) #button:focus-visible:after,:host([quiet][focused]) #button:after{box-shadow:none}:host([quiet]) #button:active,:host([quiet][open]) #button{background-color:var(\n--spectrum-picker-m-quiet-texticon-background-color-down,var(--spectrum-alias-background-color-transparent)\n);border-color:var(\n--spectrum-picker-m-quiet-texticon-border-color-down,var(--spectrum-alias-component-border-color-quiet-down)\n)}:host([quiet]) #button:active.focus-visible,:host([quiet][focused]) #button:active,:host([quiet][open]) #button.focus-visible,:host([quiet][open][focused]) #button{background-color:var(\n--spectrum-picker-quiet-background-color-key-focus\n);box-shadow:0 2px 0 0 var(--spectrum-picker-quiet-border-color-key-focus)}:host([quiet]) #button:active:focus-visible,:host([quiet][focused]) #button:active,:host([quiet][open]) #button:focus-visible,:host([quiet][open][focused]) #button{background-color:var(\n--spectrum-picker-quiet-background-color-key-focus\n);box-shadow:0 2px 0 0 var(--spectrum-picker-quiet-border-color-key-focus)}:host([quiet][invalid]) #button.focus-visible,:host([quiet][invalid][focused]) #button{box-shadow:0 2px 0 0 var(\n--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)\n)}:host([quiet][invalid]) #button:focus-visible,:host([quiet][invalid][focused]) #button{box-shadow:0 2px 0 0 var(\n--spectrum-picker-m-texticon-border-color-error-key-focus,var(--spectrum-alias-border-color-key-focus)\n)}:host([quiet]) #button:disabled,:host([quiet][disabled]) #button{background-color:var(\n--spectrum-picker-m-quiet-texticon-background-color-disabled,var(--spectrum-alias-component-background-color-quiet-disabled)\n);color:var(\n--spectrum-picker-m-texticon-text-color-disabled,var(--spectrum-alias-component-text-color-disabled)\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%}: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)}: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}:host([dir=ltr]) #label.visually-hidden+.picker{margin-left:auto}:host([dir=rtl]) #label.visually-hidden+.picker{margin-right:auto}\n`;\nexport default styles;"],
|
|
5
|
+
"mappings": "AAWA;AACA,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;AA6Sf,eAAe;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/src/picker.css.js
CHANGED
|
@@ -1,16 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
4
|
-
you may not use this file except in compliance with the License. You may obtain a copy
|
|
5
|
-
of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
6
|
-
|
|
7
|
-
Unless required by applicable law or agreed to in writing, software distributed under
|
|
8
|
-
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
9
|
-
OF ANY KIND, either express or implied. See the License for the specific language
|
|
10
|
-
governing permissions and limitations under the License.
|
|
11
|
-
*/
|
|
12
|
-
import { css } from '@spectrum-web-components/base';
|
|
13
|
-
const styles = css `
|
|
1
|
+
import { css } from "@spectrum-web-components/base";
|
|
2
|
+
const styles = css`
|
|
14
3
|
#button{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;box-sizing:border-box;cursor:pointer;display:inline-flex;font-family:var(
|
|
15
4
|
--spectrum-alias-body-text-font-family,var(--spectrum-global-font-family-base)
|
|
16
5
|
);line-height:var(
|
|
@@ -312,4 +301,4 @@ var(--spectrum-alias-border-size-thin)
|
|
|
312
301
|
)}.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}:host([dir=ltr]) #label.visually-hidden+.picker{margin-left:auto}:host([dir=rtl]) #label.visually-hidden+.picker{margin-right:auto}
|
|
313
302
|
`;
|
|
314
303
|
export default styles;
|
|
315
|
-
//# sourceMappingURL=picker.css.js.map
|
|
304
|
+
//# sourceMappingURL=picker.css.js.map
|