@getflip/swirl-components 0.452.1 → 0.453.0

package/dist/components/swirl-search.js

@@ -1,115 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { c as classNames } from './index2.js';
-import { D as DesktopMediaQuery } from './media-query.service.js';
-import { d as defineCustomElement$3 } from './swirl-icon-cancel2.js';
-import { d as defineCustomElement$2 } from './swirl-icon-search2.js';
-
-const swirlSearchCss = ".sc-swirl-search-h{display:flex;width:100%}.sc-swirl-search-h *.sc-swirl-search{box-sizing:border-box}.search.sc-swirl-search{position:relative;display:flex;width:100%}.search--variant-outline.sc-swirl-search .search__input.sc-swirl-search{background-color:transparent;box-shadow:inset 0 0 0 var(--s-border-width-default) var(--s-border-strong)}.search--variant-ghost.sc-swirl-search .search__input.sc-swirl-search{background-color:transparent}.search--disabled.sc-swirl-search .search__icon.sc-swirl-search{color:var(--s-icon-disabled)}.search--disabled.sc-swirl-search .search__input.sc-swirl-search{color:var(--s-text-disabled)}.search--disabled.sc-swirl-search .search__input.sc-swirl-search::-moz-placeholder{color:var(--s-text-disabled)}.search--disabled.sc-swirl-search .search__input.sc-swirl-search::placeholder{color:var(--s-text-disabled)}.search__icon.sc-swirl-search{position:absolute;top:50%;left:var(--s-space-12);display:inline-flex;width:1.5rem;height:1.5rem;color:var(--s-icon-default);transform:translateY(-50%)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.search__icon.sc-swirl-search{width:1.25rem;height:1.25rem}}.search__input.sc-swirl-search{width:100%;height:2.5rem;padding-top:var(--s-space-8);padding-right:calc(var(--s-space-12) + 1.5rem + var(--s-space-8));padding-bottom:var(--s-space-8);padding-left:calc(var(--s-space-12) + 1.5rem + var(--s-space-8));border:none;border-radius:var(--s-border-radius-base);color:var(--s-text-default);background-color:var(--s-surface-raised-default);font:inherit;line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.search__input.sc-swirl-search:focus:not(:focus-visible){outline:none}.search__input.sc-swirl-search:focus-visible{outline-color:var(--s-focus-default)}.search__input.sc-swirl-search::-moz-placeholder{color:var(--s-text-subdued)}.search__input.sc-swirl-search::placeholder{color:var(--s-text-subdued)}.search__input.sc-swirl-search::-webkit-search-decoration,.search__input.sc-swirl-search::-webkit-search-cancel-button,.search__input.sc-swirl-search::-webkit-search-results-button,.search__input.sc-swirl-search::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.search__input.sc-swirl-search:not(:-moz-placeholder-shown)+.search__clear-button.sc-swirl-search{display:inline-flex}.search__input.sc-swirl-search:not(:placeholder-shown)+.search__clear-button.sc-swirl-search{display:inline-flex}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.search__input.sc-swirl-search{height:2.25rem;padding-left:calc(var(--s-space-8) + 1.5rem + var(--s-space-8));font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.search__clear-button.sc-swirl-search{position:absolute;top:50%;right:var(--s-space-12);display:none;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer;transform:translateY(-50%)}";
-
-const SwirlSearch$1 = /*@__PURE__*/ proxyCustomElement(class SwirlSearch extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.clear = createEvent(this, "clear", 7);
-        this.inputBlur = createEvent(this, "inputBlur", 7);
-        this.inputFocus = createEvent(this, "inputFocus", 7);
-        this.inputInput = createEvent(this, "inputInput", 7);
-        this.valueChange = createEvent(this, "valueChange", 7);
-        this.clearButtonLabel = "Clear search term";
-        this.placeholder = "Search …";
-        this.variant = "filled";
-        this.clearable = true;
-        this.mediaQueryUnsubscribe = () => { };
-        this.handleClear = () => {
-            this.input.value = "";
-            this.input.focus();
-            this.valueChange.emit("");
-            this.clear.emit();
-        };
-        this.onBlur = (event) => {
-            this.inputBlur.emit(event);
-        };
-        this.onChange = (event) => {
-            this.valueChange.emit(event.target.value);
-        };
-        this.onFocus = (event) => {
-            this.inputFocus.emit(event);
-        };
-        this.onInput = (event) => {
-            this.inputInput.emit(event.target.value);
-        };
-    }
-    componentDidLoad() {
-        this.mediaQueryUnsubscribe = DesktopMediaQuery.subscribe((isDesktop) => {
-            this.forceIconProps(isDesktop);
-        });
-        // see https://stackoverflow.com/a/27314017
-        if (this.autoFocus) {
-            setTimeout(() => {
-                this.input.focus();
-            });
-        }
-    }
-    disconnectedCallback() {
-        this.mediaQueryUnsubscribe();
-    }
-    forceIconProps(smallIcon) {
-        if (!Boolean(this.iconEl)) {
-            return;
-        }
-        const icon = this.iconEl.children[0];
-        icon?.setAttribute("size", smallIcon ? "20" : "24");
-    }
-    onKeyDown(event) {
-        if ((event.code === "KeyK" || event.code === "Slash") &&
-            (event.ctrlKey || event.metaKey)) {
-            this.input.focus();
-        }
-    }
-    render() {
-        const className = classNames("search", `search--variant-${this.variant}`, {
-            "search--disabled": this.disabled,
-        });
-        return (h(Host, { key: '0f630711e4962a8fd678a4fefe295fa3c515c056' }, h("span", { key: '8d5be9748521ce0010da5064ffe92a191e7e4f42', class: className, ref: (el) => (this.iconEl = el) }, h("swirl-icon-search", { key: '2967fea8aa9642d43361a488a8dd66b724348949', "aria-hidden": "true", class: "search__icon" }), h("input", { key: '3b4c4dfe8545468ee325071dfc6791af187700af', "aria-disabled": this.disabled ? "true" : undefined, "aria-label": this.label, autoComplete: "off", autoFocus: this.autoFocus, class: "search__input", disabled: this.disabled, id: this.inputId, inputMode: "search", name: this.inputName, onBlur: this.onBlur, onChange: this.onChange, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.input = el), type: "search", value: this.value }), !this.disabled && this.clearable && (h("button", { key: '3860feb2b8bbdcf3460ffee9dcfd7dc7d5519137', "aria-label": this.clearButtonLabel, class: "search__clear-button", onClick: this.handleClear, type: "button" }, h("swirl-icon-cancel", { key: 'cea745efe5b8abb5cfa16d69463a9ce9a01bede9' }))))));
-    }
-    static get style() { return swirlSearchCss; }
-}, [2, "swirl-search", {
-        "autoFocus": [4, "auto-focus"],
-        "clearButtonLabel": [1, "clear-button-label"],
-        "disabled": [4],
-        "inputName": [1, "input-name"],
-        "inputId": [1, "input-id"],
-        "label": [1],
-        "placeholder": [1],
-        "value": [1025],
-        "variant": [1],
-        "clearable": [4]
-    }, [[8, "keydown", "onKeyDown"]]]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["swirl-search", "swirl-icon-cancel", "swirl-icon-search"];
-    components.forEach(tagName => { switch (tagName) {
-        case "swirl-search":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SwirlSearch$1);
-            }
-            break;
-        case "swirl-icon-cancel":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "swirl-icon-search":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const SwirlSearch = SwirlSearch$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { SwirlSearch, defineCustomElement };
+import{proxyCustomElement as s,HTMLElement as e,createEvent as r,h as a,Host as i,transformTag as c}from"@stencil/core/internal/client";import{c as t}from"./index2.js";import{D as h}from"./media-query.service.js";import{d as o}from"./swirl-icon-cancel2.js";import{d as l}from"./swirl-icon-search2.js";const n=s(class extends e{constructor(s){super(),!1!==s&&this.__registerHost(),this.clear=r(this,"clear",7),this.inputBlur=r(this,"inputBlur",7),this.inputFocus=r(this,"inputFocus",7),this.inputInput=r(this,"inputInput",7),this.valueChange=r(this,"valueChange",7),this.clearButtonLabel="Clear search term",this.placeholder="Search …",this.variant="filled",this.clearable=!0,this.mediaQueryUnsubscribe=()=>{},this.handleClear=()=>{this.input.value="",this.input.focus(),this.valueChange.emit(""),this.clear.emit()},this.onBlur=s=>{this.inputBlur.emit(s)},this.onChange=s=>{this.valueChange.emit(s.target.value)},this.onFocus=s=>{this.inputFocus.emit(s)},this.onInput=s=>{this.inputInput.emit(s.target.value)}}componentDidLoad(){this.mediaQueryUnsubscribe=h.subscribe((s=>{this.forceIconProps(s)})),this.autoFocus&&setTimeout((()=>{this.input.focus()}))}disconnectedCallback(){this.mediaQueryUnsubscribe()}forceIconProps(s){if(!this.iconEl)return;const e=this.iconEl.children[0];e?.setAttribute("size",s?"20":"24")}onKeyDown(s){"KeyK"!==s.code&&"Slash"!==s.code||!s.ctrlKey&&!s.metaKey||this.input.focus()}render(){const s=t("search","search--variant-"+this.variant,{"search--disabled":this.disabled});return a(i,{key:"0f630711e4962a8fd678a4fefe295fa3c515c056"},a("span",{key:"8d5be9748521ce0010da5064ffe92a191e7e4f42",class:s,ref:s=>this.iconEl=s},a("swirl-icon-search",{key:"2967fea8aa9642d43361a488a8dd66b724348949","aria-hidden":"true",class:"search__icon"}),a("input",{key:"3b4c4dfe8545468ee325071dfc6791af187700af","aria-disabled":this.disabled?"true":void 0,"aria-label":this.label,autoComplete:"off",autoFocus:this.autoFocus,class:"search__input",disabled:this.disabled,id:this.inputId,inputMode:"search",name:this.inputName,onBlur:this.onBlur,onChange:this.onChange,onFocus:this.onFocus,onInput:this.onInput,placeholder:this.placeholder,ref:s=>this.input=s,type:"search",value:this.value}),!this.disabled&&this.clearable&&a("button",{key:"3860feb2b8bbdcf3460ffee9dcfd7dc7d5519137","aria-label":this.clearButtonLabel,class:"search__clear-button",onClick:this.handleClear,type:"button"},a("swirl-icon-cancel",{key:"cea745efe5b8abb5cfa16d69463a9ce9a01bede9"}))))}static get style(){return".sc-swirl-search-h{display:flex;width:100%}.sc-swirl-search-h *.sc-swirl-search{box-sizing:border-box}.search.sc-swirl-search{position:relative;display:flex;width:100%}.search--variant-outline.sc-swirl-search .search__input.sc-swirl-search{background-color:transparent;box-shadow:inset 0 0 0 var(--s-border-width-default) var(--s-border-strong)}.search--variant-ghost.sc-swirl-search .search__input.sc-swirl-search{background-color:transparent}.search--disabled.sc-swirl-search .search__icon.sc-swirl-search{color:var(--s-icon-disabled)}.search--disabled.sc-swirl-search .search__input.sc-swirl-search{color:var(--s-text-disabled)}.search--disabled.sc-swirl-search .search__input.sc-swirl-search::-moz-placeholder{color:var(--s-text-disabled)}.search--disabled.sc-swirl-search .search__input.sc-swirl-search::placeholder{color:var(--s-text-disabled)}.search__icon.sc-swirl-search{position:absolute;top:50%;left:var(--s-space-12);display:inline-flex;width:1.5rem;height:1.5rem;color:var(--s-icon-default);transform:translateY(-50%)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.search__icon.sc-swirl-search{width:1.25rem;height:1.25rem}}.search__input.sc-swirl-search{width:100%;height:2.5rem;padding-top:var(--s-space-8);padding-right:calc(var(--s-space-12) + 1.5rem + var(--s-space-8));padding-bottom:var(--s-space-8);padding-left:calc(var(--s-space-12) + 1.5rem + var(--s-space-8));border:none;border-radius:var(--s-border-radius-base);color:var(--s-text-default);background-color:var(--s-surface-raised-default);font:inherit;line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.search__input.sc-swirl-search:focus:not(:focus-visible){outline:none}.search__input.sc-swirl-search:focus-visible{outline-color:var(--s-focus-default)}.search__input.sc-swirl-search::-moz-placeholder{color:var(--s-text-subdued)}.search__input.sc-swirl-search::placeholder{color:var(--s-text-subdued)}.search__input.sc-swirl-search::-webkit-search-decoration,.search__input.sc-swirl-search::-webkit-search-cancel-button,.search__input.sc-swirl-search::-webkit-search-results-button,.search__input.sc-swirl-search::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.search__input.sc-swirl-search:not(:-moz-placeholder-shown)+.search__clear-button.sc-swirl-search{display:inline-flex}.search__input.sc-swirl-search:not(:placeholder-shown)+.search__clear-button.sc-swirl-search{display:inline-flex}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.search__input.sc-swirl-search{height:2.25rem;padding-left:calc(var(--s-space-8) + 1.5rem + var(--s-space-8));font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.search__clear-button.sc-swirl-search{position:absolute;top:50%;right:var(--s-space-12);display:none;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer;transform:translateY(-50%)}"}},[2,"swirl-search",{autoFocus:[4,"auto-focus"],clearButtonLabel:[1,"clear-button-label"],disabled:[4],inputName:[1,"input-name"],inputId:[1,"input-id"],label:[1],placeholder:[1],value:[1025],variant:[1],clearable:[4]},[[8,"keydown","onKeyDown"]]]),d=n,u=function(){"undefined"!=typeof customElements&&["swirl-search","swirl-icon-cancel","swirl-icon-search"].forEach((s=>{switch(s){case"swirl-search":customElements.get(c(s))||customElements.define(c(s),n);break;case"swirl-icon-cancel":customElements.get(c(s))||o();break;case"swirl-icon-search":customElements.get(c(s))||l()}}))};export{d as SwirlSearch,u as defineCustomElement}

package/dist/components/swirl-select.js

@@ -1,275 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { c as classNames } from './index2.js';
-import { q as querySelectorAllDeep } from './utils.js';
-import { d as defineCustomElement$h } from './swirl-icon-check-small2.js';
-import { d as defineCustomElement$g } from './swirl-icon-check-strong2.js';
-import { d as defineCustomElement$f } from './swirl-icon-close2.js';
-import { d as defineCustomElement$e } from './swirl-icon-drag-handle2.js';
-import { d as defineCustomElement$d } from './swirl-icon-expand-less2.js';
-import { d as defineCustomElement$c } from './swirl-icon-expand-more2.js';
-import { d as defineCustomElement$b } from './swirl-icon-search2.js';
-import { d as defineCustomElement$a } from './swirl-option-list2.js';
-import { d as defineCustomElement$9 } from './swirl-option-list-item2.js';
-import { d as defineCustomElement$8 } from './swirl-popover2.js';
-import { d as defineCustomElement$7 } from './swirl-popover-trigger2.js';
-import { d as defineCustomElement$6 } from './swirl-spinner2.js';
-import { d as defineCustomElement$5 } from './swirl-stack2.js';
-import { d as defineCustomElement$4 } from './swirl-tag2.js';
-import { d as defineCustomElement$3 } from './swirl-text2.js';
-import { d as defineCustomElement$2 } from './swirl-visually-hidden2.js';
-
-const swirlSelectCss = ".sc-swirl-select-h{display:block;width:100%}.sc-swirl-select-h *.sc-swirl-select{box-sizing:border-box}.select.sc-swirl-select{position:relative;display:flex;width:100%}.select.sc-swirl-select .sc-swirl-select::part(popover__content){margin-top:var(--s-space-16)}@media (min-width: 768px){.select.sc-swirl-select .sc-swirl-select::part(popover__scroll-container){padding-top:0}}.select--placement-top-start.sc-swirl-select .sc-swirl-select::part(popover__content){margin-top:-2.25rem}.select--multi.sc-swirl-select .select__input.sc-swirl-select{position:absolute;width:100%;height:100%;pointer-events:none;opacity:0}.select--multi.sc-swirl-select .select__multi-select-values.sc-swirl-select{display:flex}.select--disabled.sc-swirl-select .select__input.sc-swirl-select{color:var(--s-text-disabled)}.select--disabled.sc-swirl-select .select__indicator.sc-swirl-select{color:var(--s-icon-disabled)}.select--inline.sc-swirl-select .select__indicator.sc-swirl-select{transform:translateY(-50%)}.select--standalone.sc-swirl-select{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.select--standalone.sc-swirl-select .select__indicator.sc-swirl-select{position:relative;top:auto;right:auto;cursor:pointer;transform:none}.select--standalone.sc-swirl-select .select__input.sc-swirl-select{padding-right:var(--s-space-8);font-weight:var(--s-font-weight-medium);cursor:pointer}.select--standalone.sc-swirl-select .select__value-container.sc-swirl-select{width:-webkit-min-content;width:-moz-min-content;width:min-content}.select--search-loading.sc-swirl-select .select__search-input.sc-swirl-select{padding-right:calc(var(--s-space-12) + 1.5rem + var(--s-space-8))}.select__resize-helper.sc-swirl-select{display:block;width:auto;height:0;margin:0;padding:0;padding-right:calc(1.5rem + var(--s-space-8));padding-right:var(--s-space-8);font:inherit;font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left;white-space:pre;white-space:pre;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none;opacity:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.select__resize-helper.sc-swirl-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.select__input.sc-swirl-select{display:block;overflow:hidden;width:100%;height:1.25rem;margin:0;padding:0;padding-right:calc(1.5rem + var(--s-space-8));border:none;background-color:transparent;font:inherit;line-height:var(--s-line-height-base);text-align:left;white-space:nowrap;text-overflow:ellipsis;cursor:default}.select__input.sc-swirl-select:focus{outline:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.select__input.sc-swirl-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.select__multi-select-values.sc-swirl-select{display:none;overflow:hidden;width:100%;min-height:1.25rem;padding-right:calc(1.5rem + var(--s-space-8));flex-wrap:wrap;flex-shrink:0;gap:var(--s-space-8)}.select__multi-select-values.sc-swirl-select .sc-swirl-select::part(tag){height:1.25rem;padding:0 var(--s-space-4)}.select__indicator.sc-swirl-select{position:absolute;top:50%;right:0;display:inline-flex;color:var(--s-icon-default);transform:translateY(calc(-50% - var(--s-space-8)))}.select__search.sc-swirl-select{position:relative;display:flex;width:100%;padding:0.0625rem var(--s-space-8);border-bottom:0.0625rem solid var(--s-border-default);background-color:var(--s-surface-overlay-default)}@media (min-width: 768px){.select__search.sc-swirl-select{position:sticky;z-index:1;top:0;padding-top:var(--s-space-8);padding-right:0.0625rem;padding-left:0.0625rem}}.select__search-icon.sc-swirl-select{position:absolute;top:50%;left:calc(var(--s-space-8) * 2);display:inline-flex;color:var(--s-icon-default);transform:translateY(-50%)}@media (min-width: 768px){.select__search-icon.sc-swirl-select{left:var(--s-space-12);margin-top:var(--s-space-4);padding:0.0625rem}}.select__search-input.sc-swirl-select{width:100%;height:2.5rem;padding-right:var(--s-space-12);padding-left:calc(var(--s-space-12) + 1.25rem + var(--s-space-8));align-items:center;border:none;color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.select__search-input.sc-swirl-select:focus:not(:focus-visible){outline:none}.select__search-input.sc-swirl-select:focus-visible{outline-color:var(--s-focus-default)}.select__search-input.sc-swirl-select::-moz-placeholder{color:var(--s-text-subdued)}.select__search-input.sc-swirl-select::placeholder{color:var(--s-text-subdued)}.select__search-input.sc-swirl-select::-webkit-search-decoration,.select__search-input.sc-swirl-select::-webkit-search-cancel-button,.select__search-input.sc-swirl-select::-webkit-search-results-button,.select__search-input.sc-swirl-select::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.select__search-input.sc-swirl-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.select__search-spinner.sc-swirl-select{position:absolute;top:50%;right:var(--s-space-12);display:inline-flex;transform:translateY(-50%)}@media (min-width: 768px){.select__search-spinner.sc-swirl-select{margin-top:var(--s-space-4)}}.select__empty-list-label.sc-swirl-select{padding:var(--s-space-12) var(--s-space-12) 0}.select__empty-list-label.sc-swirl-select:not(:only-child){display:none}@media (min-width: 768px){.select__empty-list-label.sc-swirl-select{padding:var(--s-space-12) var(--s-space-12) var(--s-space-8)}}";
-
-const SwirlSelect$1 = /*@__PURE__*/ proxyCustomElement(class SwirlSelect extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.searchChange = createEvent(this, "searchChange", 7);
-        this.valueChange = createEvent(this, "valueChange", 7);
-        this.allowDeselect = true;
-        this.emptyListLabel = "No results found.";
-        this.searchInputLabel = "Search options";
-        this.selectId = Math.round(Math.random() * 1000000).toString();
-        this.options = [];
-        this.select = (event) => {
-            event.stopPropagation();
-            this.value = event.detail;
-            if (!this.multiSelect) {
-                this.swirlPopover.close();
-            }
-        };
-        this.unselectOption = (value) => {
-            if (!this.allowDeselect) {
-                return;
-            }
-            this.value = this.value.filter((v) => v !== value);
-        };
-        this.onSlotChange = () => {
-            this.updateOptions();
-        };
-        this.onOpen = (event) => {
-            this.placement = event.detail.position?.placement;
-            this.open = true;
-            if (this.withSearch && Boolean(this.searchInput)) {
-                this.searchInput.focus();
-            }
-            else {
-                this.optionList.querySelector('[tabIndex="0"]')?.focus();
-            }
-        };
-        this.onClose = () => {
-            if (Boolean(this.searchInput)) {
-                this.searchInput.value = "";
-                this.searchChange.emit("");
-            }
-            this.open = false;
-            this.input.focus();
-        };
-        this.onKeyDown = (event) => {
-            if (event.code === "Space" || event.code === "Enter") {
-                if (event.target === this.searchInput) {
-                    return;
-                }
-                event.preventDefault();
-                this.swirlPopover.open(this.el);
-            }
-            else if (event.code === "ArrowDown" &&
-                event.target === this.searchInput) {
-                this.optionList.querySelector('[tabIndex="0"]')?.focus();
-            }
-        };
-        this.onSearchInput = (event) => {
-            this.searchChange.emit(event.target.value);
-        };
-    }
-    componentWillLoad() {
-        queueMicrotask(() => {
-            this.updateOptions();
-            this.observeSlotChanges();
-        });
-    }
-    disconnectedCallback() {
-        this.observer?.disconnect();
-    }
-    onWindowFocusIn(event) {
-        if (event.target === this.el.querySelector("input")) {
-            event.stopImmediatePropagation();
-        }
-    }
-    onValueChange(newValue, oldValue) {
-        const isValueUnchanged = newValue?.length === oldValue?.length &&
-            newValue?.every((v) => oldValue?.includes(v));
-        if (isValueUnchanged) {
-            return;
-        }
-        this.valueChange.emit(this.value);
-    }
-    observeSlotChanges() {
-        this.observer = new MutationObserver(() => {
-            this.updateOptions();
-        });
-        this.observer.observe(this.el, {
-            childList: true,
-            subtree: true,
-        });
-    }
-    updateOptions() {
-        this.options = querySelectorAllDeep(this.el, "swirl-option-list-item");
-    }
-    getValueLabel() {
-        return Boolean(this.value)
-            ? this.value
-                ?.map((value) => this.options.find((option) => option.value === value)?.label)
-                .join(", ")
-            : "";
-    }
-    render() {
-        const label = this.getValueLabel();
-        const ariaInvalid = this.invalid === true || this.invalid === false
-            ? String(this.invalid)
-            : undefined;
-        const formControl = this.el.closest("swirl-form-control");
-        const offset = this.standalone
-            ? [-8, 0]
-            : formControl?.inline || formControl?.labelPosition === "outside"
-                ? [0, -12]
-                : [0, -16];
-        const className = classNames("select", `select--placement-${this.placement}`, {
-            "select--disabled": this.disabled,
-            "select--inline": this.inline,
-            "select--multi": this.multiSelect,
-            "select--search-loading": this.searchLoading,
-            "select--standalone": this.standalone,
-        });
-        return (h(Host, { key: '88ac09bff06fdd7dccafddd34e6d7ba69bd93c9d', onKeyDown: this.onKeyDown }, h("div", { key: '2a8070b88ce64c08cf1219f88b82fd469faf724d', class: className }, h("swirl-popover-trigger", { key: 'e789402316c6f30a05208e2f7275c8d1bd90c17a', swirlPopover: this.swirlPopover, setAriaAttributes: false }, h("swirl-stack", { key: '22af16eb09ce25f70924bf625b82810f31aa52bb', class: "select__value-container" }, this.standalone && (h("span", { key: 'ce70e26b8243f1cd6e43ccb49fee515990ab2a24', "aria-hidden": "true", class: "select__resize-helper" }, label)), h("input", { key: 'e4b7b281fbf902663dfad9feaca077176f7836ea', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, class: "select__input", disabled: this.disabled, readOnly: true, ref: (el) => (this.input = el), type: "text", value: label }))), h("span", { key: 'bec844bb1459cfa415b50df2d40d814d6610a90d', class: "select__multi-select-values" }, this.value
-            ?.map((value) => this.options.find((option) => option.value === value))
-            ?.map((option) => (h("swirl-tag", { "aria-hidden": "true", label: option?.label,
-            // eslint-disable-next-line react/jsx-no-bind
-            onRemove: () => this.unselectOption(option?.value), removable: !this.disabled && this.allowDeselect && !option?.disabled })))), h("span", { key: '976fd76951b2192a4c7124e26afb20f689932e87', class: "select__indicator" }, this.open ? (h("swirl-icon-expand-less", { size: this.standalone ? 20 : 24 })) : (h("swirl-icon-expand-more", { size: this.standalone ? 20 : 24 }))), h("swirl-popover", { key: '90796c1ca7e443048f2b2c54aed91ad28d462ab0', animation: "scale-in-y", class: "select__popover", id: `select-options-${this.selectId}`, label: this.label, offset: offset, onPopoverClose: this.onClose, onPopoverOpen: this.onOpen, ref: (el) => (this.swirlPopover = el), useContainerWidth: this.standalone ? false : "swirl-form-control" }, this.withSearch && (h("div", { key: 'c8c9f40e9641eb780c64a4e49d40ce6f5ee9b466', class: "select__search" }, h("swirl-icon-search", { key: '2051830347b627817cca0dde16821ce79227270e', class: "select__search-icon", size: 20 }), h("input", { key: '88111e05006f06afe8b71ee43119078a958ba40f', "aria-label": this.searchInputLabel, class: "select__search-input", onInput: this.onSearchInput, placeholder: this.searchPlaceholder, ref: (el) => (this.searchInput = el), type: "search" }), this.searchLoading && (h("swirl-spinner", { key: '96962823d98b2cc4fdc6bdd329222d602891bed3', class: "select__search-spinner", size: "s" })))), h("swirl-option-list", { key: 'f644de5808ea7be0b909f5e4e82dd57211737670', allowDeselect: this.allowDeselect, onValueChange: this.select, multiSelect: this.multiSelect, ref: (el) => (this.optionList = el), value: this.value }, !this.searchLoading && (h("div", { key: '00f486c5baf4f2467f87ba98044511e0ba91260c', "aria-disabled": "true", class: "select__empty-list-label", role: "option" }, h("swirl-text", { key: '290262f91fed06b1dde6764a10f71cc6458c1fa0', color: "subdued", weight: "medium" }, this.emptyListLabel))), h("slot", { key: 'd78c0d7402459d223a7217533ca2a9a2ee1a37aa', onSlotchange: this.onSlotChange }))))));
-    }
-    get el() { return this; }
-    static get watchers() { return {
-        "value": ["onValueChange"]
-    }; }
-    static get style() { return swirlSelectCss; }
-}, [6, "swirl-select", {
-        "allowDeselect": [4, "allow-deselect"],
-        "disabled": [4],
-        "emptyListLabel": [1, "empty-list-label"],
-        "inline": [4],
-        "invalid": [4],
-        "label": [1],
-        "multiSelect": [4, "multi-select"],
-        "required": [4],
-        "searchInputLabel": [1, "search-input-label"],
-        "searchLoading": [4, "search-loading"],
-        "searchPlaceholder": [1, "search-placeholder"],
-        "selectId": [1, "select-id"],
-        "standalone": [4],
-        "swirlAriaDescribedby": [1, "swirl-aria-describedby"],
-        "value": [1040],
-        "withSearch": [4, "with-search"],
-        "options": [32],
-        "open": [32],
-        "placement": [32]
-    }, [[8, "focusin", "onWindowFocusIn"]], {
-        "value": ["onValueChange"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["swirl-select", "swirl-icon-check-small", "swirl-icon-check-strong", "swirl-icon-close", "swirl-icon-drag-handle", "swirl-icon-expand-less", "swirl-icon-expand-more", "swirl-icon-search", "swirl-option-list", "swirl-option-list-item", "swirl-popover", "swirl-popover-trigger", "swirl-spinner", "swirl-stack", "swirl-tag", "swirl-text", "swirl-visually-hidden"];
-    components.forEach(tagName => { switch (tagName) {
-        case "swirl-select":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SwirlSelect$1);
-            }
-            break;
-        case "swirl-icon-check-small":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$h();
-            }
-            break;
-        case "swirl-icon-check-strong":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$g();
-            }
-            break;
-        case "swirl-icon-close":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$f();
-            }
-            break;
-        case "swirl-icon-drag-handle":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$e();
-            }
-            break;
-        case "swirl-icon-expand-less":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$d();
-            }
-            break;
-        case "swirl-icon-expand-more":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$c();
-            }
-            break;
-        case "swirl-icon-search":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$b();
-            }
-            break;
-        case "swirl-option-list":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$a();
-            }
-            break;
-        case "swirl-option-list-item":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$9();
-            }
-            break;
-        case "swirl-popover":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "swirl-popover-trigger":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "swirl-spinner":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "swirl-stack":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "swirl-tag":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "swirl-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "swirl-visually-hidden":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const SwirlSelect = SwirlSelect$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { SwirlSelect, defineCustomElement };
+import{proxyCustomElement as e,HTMLElement as s,createEvent as t,h as i,Host as l,transformTag as c}from"@stencil/core/internal/client";import{c as r}from"./index2.js";import{q as a}from"./utils.js";import{d as n}from"./swirl-icon-check-small2.js";import{d as o}from"./swirl-icon-check-strong2.js";import{d as h}from"./swirl-icon-close2.js";import{d}from"./swirl-icon-drag-handle2.js";import{d as p}from"./swirl-icon-expand-less2.js";import{d as w}from"./swirl-icon-expand-more2.js";import{d as m}from"./swirl-icon-search2.js";import{d as u}from"./swirl-option-list2.js";import{d as f}from"./swirl-option-list-item2.js";import{d as b}from"./swirl-popover2.js";import{d as v}from"./swirl-popover-trigger2.js";import{d as g}from"./swirl-spinner2.js";import{d as _}from"./swirl-stack2.js";import{d as k}from"./swirl-tag2.js";import{d as x}from"./swirl-text2.js";import{d as y}from"./swirl-visually-hidden2.js";const E=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.searchChange=t(this,"searchChange",7),this.valueChange=t(this,"valueChange",7),this.allowDeselect=!0,this.emptyListLabel="No results found.",this.searchInputLabel="Search options",this.selectId=""+Math.round(1e6*Math.random()),this.options=[],this.select=e=>{e.stopPropagation(),this.value=e.detail,this.multiSelect||this.swirlPopover.close()},this.unselectOption=e=>{this.allowDeselect&&(this.value=this.value.filter((s=>s!==e)))},this.onSlotChange=()=>{this.updateOptions()},this.onOpen=e=>{this.placement=e.detail.position?.placement,this.open=!0,this.withSearch&&this.searchInput?this.searchInput.focus():this.optionList.querySelector('[tabIndex="0"]')?.focus()},this.onClose=()=>{this.searchInput&&(this.searchInput.value="",this.searchChange.emit("")),this.open=!1,this.input.focus()},this.onKeyDown=e=>{if("Space"===e.code||"Enter"===e.code){if(e.target===this.searchInput)return;e.preventDefault(),this.swirlPopover.open(this.el)}else"ArrowDown"===e.code&&e.target===this.searchInput&&this.optionList.querySelector('[tabIndex="0"]')?.focus()},this.onSearchInput=e=>{this.searchChange.emit(e.target.value)}}componentWillLoad(){queueMicrotask((()=>{this.updateOptions(),this.observeSlotChanges()}))}disconnectedCallback(){this.observer?.disconnect()}onWindowFocusIn(e){e.target===this.el.querySelector("input")&&e.stopImmediatePropagation()}onValueChange(e,s){e?.length===s?.length&&e?.every((e=>s?.includes(e)))||this.valueChange.emit(this.value)}observeSlotChanges(){this.observer=new MutationObserver((()=>{this.updateOptions()})),this.observer.observe(this.el,{childList:!0,subtree:!0})}updateOptions(){this.options=a(this.el,"swirl-option-list-item")}getValueLabel(){return this.value?this.value?.map((e=>this.options.find((s=>s.value===e))?.label)).join(", "):""}render(){const e=this.getValueLabel(),s=!0===this.invalid||!1===this.invalid?this.invalid+"":void 0,t=this.el.closest("swirl-form-control"),c=this.standalone?[-8,0]:t?.inline||"outside"===t?.labelPosition?[0,-12]:[0,-16],a=r("select","select--placement-"+this.placement,{"select--disabled":this.disabled,"select--inline":this.inline,"select--multi":this.multiSelect,"select--search-loading":this.searchLoading,"select--standalone":this.standalone});return i(l,{key:"88ac09bff06fdd7dccafddd34e6d7ba69bd93c9d",onKeyDown:this.onKeyDown},i("div",{key:"2a8070b88ce64c08cf1219f88b82fd469faf724d",class:a},i("swirl-popover-trigger",{key:"e789402316c6f30a05208e2f7275c8d1bd90c17a",swirlPopover:this.swirlPopover,setAriaAttributes:!1},i("swirl-stack",{key:"22af16eb09ce25f70924bf625b82810f31aa52bb",class:"select__value-container"},this.standalone&&i("span",{key:"ce70e26b8243f1cd6e43ccb49fee515990ab2a24","aria-hidden":"true",class:"select__resize-helper"},e),i("input",{key:"e4b7b281fbf902663dfad9feaca077176f7836ea","aria-describedby":this.swirlAriaDescribedby,"aria-disabled":this.disabled?"true":void 0,"aria-invalid":s,class:"select__input",disabled:this.disabled,readOnly:!0,ref:e=>this.input=e,type:"text",value:e}))),i("span",{key:"bec844bb1459cfa415b50df2d40d814d6610a90d",class:"select__multi-select-values"},this.value?.map((e=>this.options.find((s=>s.value===e))))?.map((e=>i("swirl-tag",{"aria-hidden":"true",label:e?.label,onRemove:()=>this.unselectOption(e?.value),removable:!this.disabled&&this.allowDeselect&&!e?.disabled})))),i("span",{key:"976fd76951b2192a4c7124e26afb20f689932e87",class:"select__indicator"},i(this.open?"swirl-icon-expand-less":"swirl-icon-expand-more",{size:this.standalone?20:24})),i("swirl-popover",{key:"90796c1ca7e443048f2b2c54aed91ad28d462ab0",animation:"scale-in-y",class:"select__popover",id:"select-options-"+this.selectId,label:this.label,offset:c,onPopoverClose:this.onClose,onPopoverOpen:this.onOpen,ref:e=>this.swirlPopover=e,useContainerWidth:!this.standalone&&"swirl-form-control"},this.withSearch&&i("div",{key:"c8c9f40e9641eb780c64a4e49d40ce6f5ee9b466",class:"select__search"},i("swirl-icon-search",{key:"2051830347b627817cca0dde16821ce79227270e",class:"select__search-icon",size:20}),i("input",{key:"88111e05006f06afe8b71ee43119078a958ba40f","aria-label":this.searchInputLabel,class:"select__search-input",onInput:this.onSearchInput,placeholder:this.searchPlaceholder,ref:e=>this.searchInput=e,type:"search"}),this.searchLoading&&i("swirl-spinner",{key:"96962823d98b2cc4fdc6bdd329222d602891bed3",class:"select__search-spinner",size:"s"})),i("swirl-option-list",{key:"f644de5808ea7be0b909f5e4e82dd57211737670",allowDeselect:this.allowDeselect,onValueChange:this.select,multiSelect:this.multiSelect,ref:e=>this.optionList=e,value:this.value},!this.searchLoading&&i("div",{key:"00f486c5baf4f2467f87ba98044511e0ba91260c","aria-disabled":"true",class:"select__empty-list-label",role:"option"},i("swirl-text",{key:"290262f91fed06b1dde6764a10f71cc6458c1fa0",color:"subdued",weight:"medium"},this.emptyListLabel)),i("slot",{key:"d78c0d7402459d223a7217533ca2a9a2ee1a37aa",onSlotchange:this.onSlotChange})))))}get el(){return this}static get watchers(){return{value:[{onValueChange:0}]}}static get style(){return'.sc-swirl-select-h{display:block;width:100%}.sc-swirl-select-h *.sc-swirl-select{box-sizing:border-box}.select.sc-swirl-select{position:relative;display:flex;width:100%}.select.sc-swirl-select .sc-swirl-select::part(popover__content),.select.sc-swirl-select .sc-swirl-select [part~="popover__content"]{margin-top:var(--s-space-16)}@media (min-width: 768px){.select.sc-swirl-select .sc-swirl-select::part(popover__scroll-container){padding-top:0}}.select--placement-top-start.sc-swirl-select .sc-swirl-select::part(popover__content),.select--placement-top-start.sc-swirl-select .sc-swirl-select [part~="popover__content"]{margin-top:-2.25rem}.select--multi.sc-swirl-select .select__input.sc-swirl-select{position:absolute;width:100%;height:100%;pointer-events:none;opacity:0}.select--multi.sc-swirl-select .select__multi-select-values.sc-swirl-select{display:flex}.select--disabled.sc-swirl-select .select__input.sc-swirl-select{color:var(--s-text-disabled)}.select--disabled.sc-swirl-select .select__indicator.sc-swirl-select{color:var(--s-icon-disabled)}.select--inline.sc-swirl-select .select__indicator.sc-swirl-select{transform:translateY(-50%)}.select--standalone.sc-swirl-select{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.select--standalone.sc-swirl-select .select__indicator.sc-swirl-select{position:relative;top:auto;right:auto;cursor:pointer;transform:none}.select--standalone.sc-swirl-select .select__input.sc-swirl-select{padding-right:var(--s-space-8);font-weight:var(--s-font-weight-medium);cursor:pointer}.select--standalone.sc-swirl-select .select__value-container.sc-swirl-select{width:-webkit-min-content;width:-moz-min-content;width:min-content}.select--search-loading.sc-swirl-select .select__search-input.sc-swirl-select{padding-right:calc(var(--s-space-12) + 1.5rem + var(--s-space-8))}.select__resize-helper.sc-swirl-select{display:block;width:auto;height:0;margin:0;padding:0;padding-right:calc(1.5rem + var(--s-space-8));padding-right:var(--s-space-8);font:inherit;font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left;white-space:pre;white-space:pre;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none;opacity:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.select__resize-helper.sc-swirl-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.select__input.sc-swirl-select{display:block;overflow:hidden;width:100%;height:1.25rem;margin:0;padding:0;padding-right:calc(1.5rem + var(--s-space-8));border:none;background-color:transparent;font:inherit;line-height:var(--s-line-height-base);text-align:left;white-space:nowrap;text-overflow:ellipsis;cursor:default}.select__input.sc-swirl-select:focus{outline:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.select__input.sc-swirl-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.select__multi-select-values.sc-swirl-select{display:none;overflow:hidden;width:100%;min-height:1.25rem;padding-right:calc(1.5rem + var(--s-space-8));flex-wrap:wrap;flex-shrink:0;gap:var(--s-space-8)}.select__multi-select-values.sc-swirl-select .sc-swirl-select::part(tag),.select__multi-select-values.sc-swirl-select .sc-swirl-select [part~="tag"]{height:1.25rem;padding:0 var(--s-space-4)}.select__indicator.sc-swirl-select{position:absolute;top:50%;right:0;display:inline-flex;color:var(--s-icon-default);transform:translateY(calc(-50% - var(--s-space-8)))}.select__search.sc-swirl-select{position:relative;display:flex;width:100%;padding:0.0625rem var(--s-space-8);border-bottom:0.0625rem solid var(--s-border-default);background-color:var(--s-surface-overlay-default)}@media (min-width: 768px){.select__search.sc-swirl-select{position:sticky;z-index:1;top:0;padding-top:var(--s-space-8);padding-right:0.0625rem;padding-left:0.0625rem}}.select__search-icon.sc-swirl-select{position:absolute;top:50%;left:calc(var(--s-space-8) * 2);display:inline-flex;color:var(--s-icon-default);transform:translateY(-50%)}@media (min-width: 768px){.select__search-icon.sc-swirl-select{left:var(--s-space-12);margin-top:var(--s-space-4);padding:0.0625rem}}.select__search-input.sc-swirl-select{width:100%;height:2.5rem;padding-right:var(--s-space-12);padding-left:calc(var(--s-space-12) + 1.25rem + var(--s-space-8));align-items:center;border:none;color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.select__search-input.sc-swirl-select:focus:not(:focus-visible){outline:none}.select__search-input.sc-swirl-select:focus-visible{outline-color:var(--s-focus-default)}.select__search-input.sc-swirl-select::-moz-placeholder{color:var(--s-text-subdued)}.select__search-input.sc-swirl-select::placeholder{color:var(--s-text-subdued)}.select__search-input.sc-swirl-select::-webkit-search-decoration,.select__search-input.sc-swirl-select::-webkit-search-cancel-button,.select__search-input.sc-swirl-select::-webkit-search-results-button,.select__search-input.sc-swirl-select::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.select__search-input.sc-swirl-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.select__search-spinner.sc-swirl-select{position:absolute;top:50%;right:var(--s-space-12);display:inline-flex;transform:translateY(-50%)}@media (min-width: 768px){.select__search-spinner.sc-swirl-select{margin-top:var(--s-space-4)}}.select__empty-list-label.sc-swirl-select{padding:var(--s-space-12) var(--s-space-12) 0}.select__empty-list-label.sc-swirl-select:not(:only-child){display:none}@media (min-width: 768px){.select__empty-list-label.sc-swirl-select{padding:var(--s-space-12) var(--s-space-12) var(--s-space-8)}}'}},[262,"swirl-select",{allowDeselect:[4,"allow-deselect"],disabled:[4],emptyListLabel:[1,"empty-list-label"],inline:[4],invalid:[4],label:[1],multiSelect:[4,"multi-select"],required:[4],searchInputLabel:[1,"search-input-label"],searchLoading:[4,"search-loading"],searchPlaceholder:[1,"search-placeholder"],selectId:[1,"select-id"],standalone:[4],swirlAriaDescribedby:[1,"swirl-aria-describedby"],value:[1040],withSearch:[4,"with-search"],options:[32],open:[32],placement:[32]},[[8,"focusin","onWindowFocusIn"]],{value:[{onValueChange:0}]}]),j=E,z=function(){"undefined"!=typeof customElements&&["swirl-select","swirl-icon-check-small","swirl-icon-check-strong","swirl-icon-close","swirl-icon-drag-handle","swirl-icon-expand-less","swirl-icon-expand-more","swirl-icon-search","swirl-option-list","swirl-option-list-item","swirl-popover","swirl-popover-trigger","swirl-spinner","swirl-stack","swirl-tag","swirl-text","swirl-visually-hidden"].forEach((e=>{switch(e){case"swirl-select":customElements.get(c(e))||customElements.define(c(e),E);break;case"swirl-icon-check-small":customElements.get(c(e))||n();break;case"swirl-icon-check-strong":customElements.get(c(e))||o();break;case"swirl-icon-close":customElements.get(c(e))||h();break;case"swirl-icon-drag-handle":customElements.get(c(e))||d();break;case"swirl-icon-expand-less":customElements.get(c(e))||p();break;case"swirl-icon-expand-more":customElements.get(c(e))||w();break;case"swirl-icon-search":customElements.get(c(e))||m();break;case"swirl-option-list":customElements.get(c(e))||u();break;case"swirl-option-list-item":customElements.get(c(e))||f();break;case"swirl-popover":customElements.get(c(e))||b();break;case"swirl-popover-trigger":customElements.get(c(e))||v();break;case"swirl-spinner":customElements.get(c(e))||g();break;case"swirl-stack":customElements.get(c(e))||_();break;case"swirl-tag":customElements.get(c(e))||k();break;case"swirl-text":customElements.get(c(e))||x();break;case"swirl-visually-hidden":customElements.get(c(e))||y()}}))};export{j as SwirlSelect,z as defineCustomElement}

package/dist/components/swirl-separator.js

@@ -1,6 +1 @@
-import { S as SwirlSeparator$1, d as defineCustomElement$1 } from './swirl-separator2.js';
-
-const SwirlSeparator = SwirlSeparator$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { SwirlSeparator, defineCustomElement };
+import{S as r,d as s}from"./swirl-separator2.js";const o=r,a=s;export{o as SwirlSeparator,a as defineCustomElement}

package/dist/components/swirl-separator2.js

@@ -1,65 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host, Fragment } from '@stencil/core/internal/client';
-import { c as classNames } from './index2.js';
-
-const swirlSeparatorCss = ":host{display:flex;width:100%;align-items:center;gap:var(--s-space-8)}:host *{box-sizing:border-box}:host(.separator--orientation-vertical){display:inline-flex;width:auto;flex-direction:column}:host(.separator--orientation-vertical) .separator__line{width:var(--s-border-width-default);height:100%;min-height:1.125rem}:host(.separator--color-critical) .separator__line{background-color:var(--s-border-critical)}:host(.separator--color-critical) .separator__label{color:var(--s-text-subdued)}:host(.separator--color-strong) .separator__line{background-color:var(--s-border-strong)}:host(.separator--color-strong) .separator__label{color:var(--s-text-subdued)}:host(.separator--color-highlight) .separator__line{background-color:var(--s-border-highlight)}:host(.separator--color-highlight) .separator__label{color:var(--s-text-highlight)}.separator__line{display:block;width:100%;height:var(--s-border-width-default);background-color:var(--s-border-on-translucent)}.separator__label{flex-shrink:0;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;font-size:var(--s-font-size-sm);color:var(--s-text-disabled)}";
-
-const SwirlSeparator = /*@__PURE__*/ proxyCustomElement(class SwirlSeparator extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.borderColor = "default";
-        this.color = "default";
-        this.orientation = "horizontal";
-        this.semantics = "separator";
-        this.spacing = "8";
-    }
-    componentWillLoad() {
-        this.forceColor();
-    }
-    forceColor() {
-        if (this.borderColor !== "default") {
-            console.warn('[Swirl] The "borderColor" prop of swirl-separator is deprecated and will be removed with the next major release. Please use the "color" prop to achieve the same result.');
-            this.color = this.borderColor;
-        }
-    }
-    render() {
-        const styles = this.orientation === "horizontal"
-            ? {
-                paddingTop: `var(--s-space-${this.spacing})`,
-                paddingBottom: `var(--s-space-${this.spacing})`,
-            }
-            : {
-                paddingRight: `var(--s-space-${this.spacing})`,
-                paddingLeft: `var(--s-space-${this.spacing})`,
-            };
-        const className = classNames("separator", `separator--color-${this.color}`, `separator--orientation-${this.orientation}`);
-        const attributes = this.semantics === "separator"
-            ? { "aria-orientation": this.orientation }
-            : {};
-        return (h(Host, { key: '23acb3a29638b92737838e75a54d7616e6c9150e', ...attributes, class: className, role: this.semantics, style: styles }, h("span", { key: '3ebf80f47fb36438403551f560db91ecf7d7e559', class: "separator__line" }), this.label && (h(Fragment, { key: '84ac7960ba714ab27559751c11bd7c4b56ac3176' }, h("span", { key: '6f8dc3ad3bde938789e28ad05c67da657262a4d1', class: "separator__label" }, this.label), h("span", { key: '63ddb77ea887a890bb1731d12a939783b592e21a', class: "separator__line" })))));
-    }
-    static get style() { return swirlSeparatorCss; }
-}, [1, "swirl-separator", {
-        "borderColor": [1, "border-color"],
-        "color": [1025],
-        "label": [1],
-        "orientation": [1],
-        "semantics": [1],
-        "spacing": [1]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["swirl-separator"];
-    components.forEach(tagName => { switch (tagName) {
-        case "swirl-separator":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SwirlSeparator);
-            }
-            break;
-    } });
-}
-
-export { SwirlSeparator as S, defineCustomElement as d };
+import{proxyCustomElement as r,HTMLElement as t,h as e,Host as a,Fragment as o,transformTag as s}from"@stencil/core/internal/client";import{c as i}from"./index2.js";const l=r(class extends t{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.borderColor="default",this.color="default",this.orientation="horizontal",this.semantics="separator",this.spacing="8"}componentWillLoad(){this.forceColor()}forceColor(){"default"!==this.borderColor&&(console.warn('[Swirl] The "borderColor" prop of swirl-separator is deprecated and will be removed with the next major release. Please use the "color" prop to achieve the same result.'),this.color=this.borderColor)}render(){const r="horizontal"===this.orientation?{paddingTop:`var(--s-space-${this.spacing})`,paddingBottom:`var(--s-space-${this.spacing})`}:{paddingRight:`var(--s-space-${this.spacing})`,paddingLeft:`var(--s-space-${this.spacing})`},t=i("separator",`separator--color-${this.color}`,`separator--orientation-${this.orientation}`);return e(a,{key:"23acb3a29638b92737838e75a54d7616e6c9150e",..."separator"===this.semantics?{"aria-orientation":this.orientation}:{},class:t,role:this.semantics,style:r},e("span",{key:"3ebf80f47fb36438403551f560db91ecf7d7e559",class:"separator__line"}),this.label&&e(o,{key:"84ac7960ba714ab27559751c11bd7c4b56ac3176"},e("span",{key:"6f8dc3ad3bde938789e28ad05c67da657262a4d1",class:"separator__label"},this.label),e("span",{key:"63ddb77ea887a890bb1731d12a939783b592e21a",class:"separator__line"})))}static get style(){return":host{display:flex;width:100%;align-items:center;gap:var(--s-space-8)}:host *{box-sizing:border-box}:host(.separator--orientation-vertical){display:inline-flex;width:auto;flex-direction:column}:host(.separator--orientation-vertical) .separator__line{width:var(--s-border-width-default);height:100%;min-height:1.125rem}:host(.separator--color-critical) .separator__line{background-color:var(--s-border-critical)}:host(.separator--color-critical) .separator__label{color:var(--s-text-subdued)}:host(.separator--color-strong) .separator__line{background-color:var(--s-border-strong)}:host(.separator--color-strong) .separator__label{color:var(--s-text-subdued)}:host(.separator--color-highlight) .separator__line{background-color:var(--s-border-highlight)}:host(.separator--color-highlight) .separator__label{color:var(--s-text-highlight)}.separator__line{display:block;width:100%;height:var(--s-border-width-default);background-color:var(--s-border-on-translucent)}.separator__label{flex-shrink:0;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;font-size:var(--s-font-size-sm);color:var(--s-text-disabled)}"}},[1,"swirl-separator",{borderColor:[1,"border-color"],color:[1025],label:[1],orientation:[1],semantics:[1],spacing:[1]}]);function n(){"undefined"!=typeof customElements&&["swirl-separator"].forEach((r=>{"swirl-separator"===r&&(customElements.get(s(r))||customElements.define(s(r),l))}))}export{l as S,n as d}