@solid-design-system/components 4.0.1 → 4.0.3

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@solid-design-system/components",
   "description": "Solid Design System: Components",
-  "version": "4.0.1",
+  "version": "4.0.3",
   "homepage": "https://solid-design-system.fe.union-investment.de/docs/",
   "author": "Union Investment",
   "license": "MIT",
@@ -93,6 +93,7 @@
     "globby": "^14.0.2",
     "gzip-size": "^7.0.0",
     "jsonata": "^2.0.6",
+    "lit-html": "^3.2.1",
     "minify-html-literals": "^1.3.5",
     "ora": "^8.1.1",
     "playwright": "^1.49.1",

package/cdn/chunks/chunk.ANSLHQOM.js

@@ -1,11 +0,0 @@
-import{a as U}from"./chunk.6HMIEKMA.js";import{a as K}from"./chunk.MX2AOQKK.js";import{a as A}from"./chunk.D7TMPF3D.js";import{a as H}from"./chunk.X2GM34WQ.js";import{a as L,d as P,e as R,f as w}from"./chunk.W7A3TU2Z.js";import{c as B}from"./chunk.3L472FD4.js";import{b as z}from"./chunk.65NSSTJE.js";import{a as C,c as E}from"./chunk.A3DKF5BY.js";import{a as $,b as F}from"./chunk.LFTAVPYP.js";import{a as S,d as T}from"./chunk.RQYP7MH5.js";import{a as x}from"./chunk.KLRPP4NQ.js";import{a as f}from"./chunk.E2DRD2OX.js";import{a as D}from"./chunk.6HO6CE4A.js";import{a as M}from"./chunk.26YUWEYR.js";import{a as r}from"./chunk.DCOFYPWX.js";import{a as k,b as o,c as h,d as c,h as I}from"./chunk.ERIS2E6E.js";import{b as V,e as d}from"./chunk.IRWHG2Q4.js";import{e as a}from"./chunk.TJOCV4DC.js";var s=class extends I{constructor(){super(...arguments);this.formControlController=new z(this,{assumeInteractionOn:["sd-blur","sd-input"]});this.hasSlotController=new D(this,"help-text","label");this.localize=new M(this);this.hasHover=!1;this.hasFocus=!1;this.displayInputValue="";this.selectedTextLabel="";this.selectedOptions=[];this.filteredOptions=[];this.allOptions=[];this.showValidStyle=!1;this.showInvalidStyle=!1;this.name="";this.value="";this.defaultValue="";this.size="lg";this.placeholder="";this.maxOptionsTagLabel=this.localize.term("tagsSelected");this.disabled=!1;this.clearable=!1;this.open=!1;this.hoist=!1;this.label="";this.placement="bottom";this.helpText="";this.form="";this.required=!1;this.currentPlacement=this.placement;this.getOption=H;this.multiple=!1;this.useTags=!0;this.maxOptionsVisible=3;this.styleOnValid=!1;this.filter=(t,e)=>{let i=w(t.value),l=w(t.getTextLabel()),n=w(e);return i.includes(n)||l.includes(n)};this.getTag=t=>d`<sd-tag ?disabled="${this.disabled}" part="tag" exportparts="
-              base:tag__base,
-              content:tag__content,
-              removable-indicator:tag__removable-indicator,
-            " size="${this.size==="sm"?"sm":"lg"}" removable @keydown="${e=>this.handleTagKeyDown(e,t)}" @sd-remove="${e=>this.handleTagRemove(e,t)}">${t.getTextLabel()}</sd-tag>`;this.handleDocumentFocusIn=t=>{let e=t.composedPath();this&&!e.includes(this)&&this.hide()};this.handleDocumentKeyDown=t=>{if(t.target.closest(".combobox__clear")===null){if(t.key==="Escape"&&(this.open?(t.preventDefault(),t.stopPropagation(),this.hide(),this.displayInput.focus({preventScroll:!0})):this.displayInputValue=""),t.key==="Backspace"&&this.multiple&&this.displayInput.value===""){this.handleTagRemove(new CustomEvent("sd-remove"),this.selectedOptions[this.selectedOptions.length-1]),this.updateComplete.then(()=>this.displayInput.focus({preventScroll:!0}));return}if(t.key==="Enter"){let l=this.getCurrentOption(),n=t.metaKey||t.ctrlKey||t.shiftKey||t.altKey;if(!this.open&&!n){setTimeout(()=>{t.defaultPrevented||this.formControlController.submit()});return}if(!this.open||l!=null&&l.disabled)return;if(l&&!l.disabled){let p=this.value;this.multiple?(this.toggleOptionSelection(l),this.lastOption=l,this.setOrderedSelectedOptions(l),this.updateComplete.then(()=>{this.selectionChanged()})):(this.setOrderedSelectedOptions(l),this.setSelectedOptions(l)),this.updateComplete.then(()=>{this.displayInput.focus({preventScroll:!0}),this.value!==p&&(this.emit("sd-input"),this.emit("sd-change"))})}this.displayInput.focus({preventScroll:!0}),this.multiple||(this.hide(),this.displayInput.focus({preventScroll:!0}));return}["ArrowUp","ArrowDown"].includes(t.key)&&(t.preventDefault(),t.stopPropagation(),this.open||this.show(),this.selectNextOption(t.key==="ArrowDown")),["Home","End"].includes(t.key)&&(t.preventDefault(),t.stopPropagation(),t.key==="Home"?this.displayInput.setSelectionRange(0,0):t.key==="End"&&this.displayInput.setSelectionRange(this.displayInput.value.length,this.displayInput.value.length))}};this.handleDocumentMouseDown=t=>{let e=t.composedPath();this&&!e.includes(this)&&this.hide()}}connectedCallback(){super.connectedCallback(),this.open=!1}firstUpdated(){if(!this.multiple){let t=this.findOptionByValue(this.getSlottedOptions(),this.value);this.selectedTextLabel=(t==null?void 0:t.getTextLabel())||""}this.formControlController.updateValidity()}get validity(){return this.valueInput.validity}get validationMessage(){return this.valueInput.validationMessage}get options(){let t=e=>{let i=this.displayInput.value,l=this.getOption(e,i);return d`${typeof l=="string"?$(l):l}`};return this.filteredOptions.map(e=>e.tagName.toLowerCase()==="sd-optgroup"?(Array.from(e.children).forEach(i=>{i.tagName.toLowerCase()==="sd-option"&&t(i)}),e):t(e))}get tags(){return this.selectedOptions.length<=this.maxOptionsVisible?this.selectedOptions.map((t,e)=>{if(e<this.maxOptionsVisible||this.maxOptionsVisible<=0){let i=this.getTag(t,e);return d`<div @sd-remove="${l=>this.handleTagRemove(l,t)}">${typeof i=="string"?$(i):i}</div>`}return[d``]}):[d`<sd-tag ?disabled="${this.disabled}" part="tag" exportparts="
-              base:tag__base,
-              content:tag__content,
-              removable-indicator:tag__removable-indicator,
-            " size="${this.size==="sm"?"sm":"lg"}" removable @keydown="${t=>this.handleTagMaxOptionsKeyDown(t)}" @sd-remove="${t=>this.handleTagRemove(t)}">${this.selectedOptions.length} ${this.maxOptionsTagLabel}</sd-tag>`]}addOpenListeners(){document.addEventListener("focusin",this.handleDocumentFocusIn),document.addEventListener("mousedown",this.handleDocumentMouseDown),this.getRootNode()!==document&&this.getRootNode().addEventListener("focusin",this.handleDocumentFocusIn)}removeOpenListeners(){document.removeEventListener("focusin",this.handleDocumentFocusIn),document.removeEventListener("mousedown",this.handleDocumentMouseDown),this.getRootNode()!==document&&this.getRootNode().removeEventListener("focusin",this.handleDocumentFocusIn)}handleFocus(){this.hasFocus=!0,this.emit("sd-focus")}handleBlur(){this.hasFocus=!1,this.emit("sd-blur")}handleTagKeyDown(t,e){t.key==="Backspace"&&this.multiple&&(t.preventDefault(),t.stopPropagation(),this.handleTagRemove(new CustomEvent("sd-remove"),e),this.updateComplete.then(()=>this.displayInput.focus({preventScroll:!0})))}handleTagMaxOptionsKeyDown(t){t.key==="Backspace"&&this.multiple&&(t.preventDefault(),t.stopPropagation(),this.handleTagRemove(new CustomEvent("sd-remove"),this.selectedOptions[this.selectedOptions.length-1]),this.updateComplete.then(()=>this.displayInput.focus({preventScroll:!0})))}handleLabelClick(){this.displayInput.focus()}handleTagRemove(t,e){t.stopPropagation(),e||this.clearCombobox(),e&&!this.disabled&&(this.toggleOptionSelection(e,!1),this.setOrderedSelectedOptions(e),this.updateComplete.then(()=>{this.selectionChanged(),this.emit("sd-input"),this.emit("sd-change")}))}handleComboboxMouseDown(t){let i=t.composedPath().some(n=>n instanceof HTMLSlotElement&&n.name==="removable-indicator");if(this.disabled||i)return;(this.open?this.hide():this.show()).then(()=>{setTimeout(()=>this.displayInput.focus({preventScroll:!0}))})}handleComboboxKeyDown(t){t.key!=="Tab"&&this.handleDocumentKeyDown(t)}handleClearClick(t){t.stopPropagation(),this.clearCombobox()}handleNoResultsClick(t){t.preventDefault(),this.hide()}clearCombobox(){this.value!==""&&(this.value="",this.displayInputValue="",this.selectedTextLabel="",this.lastOption=void 0,this.selectedOptions=[],this.getSlottedOptions().forEach(t=>{t.selected=!1}),this.displayInput.focus({preventScroll:!0}),this.updateComplete.then(()=>{this.emit("sd-clear"),this.emit("sd-input"),this.emit("sd-change")}))}preventLoosingFocus(t){t.stopPropagation(),t.preventDefault()}handleOptionClick(t){let i=t.target.closest("sd-option"),l=this.value;i&&!i.disabled&&(this.multiple?(this.toggleOptionSelection(i),this.lastOption=i,this.setOrderedSelectedOptions(i),this.updateComplete.then(()=>{this.selectionChanged()})):(this.setOrderedSelectedOptions(i),this.setSelectedOptions(i)),this.updateComplete.then(()=>{this.displayInput.focus({preventScroll:!0}),this.value!==l&&(this.emit("sd-input"),this.emit("sd-change"))}),this.multiple||(this.hide(),this.displayInput.focus({preventScroll:!0})))}selectNextOption(t){let e=this.getAllFilteredOptions();if(e.length===0)return;let i=this.getCurrentOption(),l=e.indexOf(i),n=Math.max(0,l);if(t){let p=l+1;n=p>e.length-1?0:p}else{let p=l-1;n=p<0?e.length-1:p}this.setCurrentOption(e[n]),B(this.getCurrentOption(),this.listbox,"vertical","auto")}getAllFilteredOptions(){return[...this.filteredWrapper.querySelectorAll("sd-option")]}getCurrentOption(){return this.getAllFilteredOptions().find(t=>t.current)}setCurrentOption(t){let e=this.getAllFilteredOptions();this.displayInput.removeAttribute("aria-activedescendant"),e.forEach(i=>{i.current=!1,i.setAttribute("aria-selected","false")}),t&&(t.current=!0,t.setAttribute("aria-selected","true"),this.displayInput.setAttribute("aria-activedescendant",t.id))}toggleOptionSelection(t,e){let l=this.getSlottedOptions().find(n=>n.value&&t.value?n.value===t.value:n.getTextLabel()===t.getTextLabel());l&&(l.selected=e!=null?e:!l.selected)}findOptionByValue(t,e){if(e)return Array.isArray(e)?t.find(i=>e.includes(i.value)):t.find(i=>i.value===e)}selectedOptionsAndValueSynced(){var t;return!this.value&&this.selectedOptions.length===0?!0:Array.isArray(this.value)?this.value.length===this.selectedOptions.length:this.value===((t=this.selectedOptions[0])==null?void 0:t.value)}isOptionSelected(t){return t.value?this.value.includes(t.value):this.value.includes(t.getTextLabel())}syncSelectedOptionsAndValue(){return this.selectedOptionsAndValueSynced()?void 0:(this.getSlottedOptions().forEach(e=>{e.selected=!1}),this.selectedOptions=this.getSlottedOptions().filter(e=>this.isOptionSelected(e)),this.selectedOptions.forEach(e=>{e&&(e.selected=!0)}),Promise.resolve())}compareOptions(t,e){return t.value&&e.value?t.value===e.value:t.getTextLabel()===e.getTextLabel()}setSelectedOptions(t){this.getSlottedOptions().forEach(i=>{i.selected=this.compareOptions(i,t)}),this.selectionChanged()}setOrderedSelectedOptions(t){let e=this.getSlottedOptions().find(i=>this.compareOptions(i,t));this.multiple?this.selectedOptions.length>0&&e&&this.selectedOptions.find(i=>this.compareOptions(i,e))?this.selectedOptions=this.selectedOptions.filter(i=>!this.compareOptions(i,e)):this.selectedOptions=[...this.selectedOptions,e]:this.selectedOptions=[e]}selectionChanged(){var e,i,l;let t=this.selectedOptions.some(n=>n?this.isOptionSelected(n):!1);this.multiple?(!t&&this.selectedOptions.length>0?this.value=[...this.value,...this.selectedOptions.map(n=>n.value||n.getTextLabel())]:this.value=this.selectedOptions.map(n=>(n==null?void 0:n.value)||(n==null?void 0:n.getTextLabel())||""),this.displayInputValue=""):(this.value=((e=this.selectedOptions[0])==null?void 0:e.value)||((i=this.selectedOptions[0])==null?void 0:i.getTextLabel())||"",this.selectedTextLabel=((l=this.selectedOptions[0])==null?void 0:l.getTextLabel())||"",this.displayInputValue=""),this.updateComplete.then(()=>{this.formControlController.updateValidity()})}createComboboxOptionsFromQuery(t){let e=[];this.filteredOptions=this.getSlottedOptions().filter(i=>this.filter(i,t)||t==="").map(i=>{var y,O,m;let l=i.cloneNode(!0);if(l.current=l.value===((y=this.lastOption)==null?void 0:y.value),l.selected=i.selected,l.checkbox=i.checkbox,l.size=i.size,!(((O=i.parentElement)==null?void 0:O.tagName.toLowerCase())==="sd-optgroup"))return l;let p=i.parentElement,g=(m=p.querySelector('[slot="label"]'))==null?void 0:m.cloneNode(!0),u=e.find(b=>b.id===p.id);if(u){u==null||u.appendChild(l),g&&(u==null||u.appendChild(g));return}let v=p.cloneNode();return v.appendChild(l),g&&v.appendChild(g),e.push(v),v}).filter(Boolean)}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t),this.invalidMessage.textContent=t.target.validationMessage}handleMouseEnter(){this.hasHover=!0}handleMouseLeave(){this.hasHover=!1}handleCurrentPlacement(t){let e=t.detail;e&&(this.currentPlacement=e)}handleFilterChange(){this.createComboboxOptionsFromQuery(this.displayInputValue)}handleUseTagsChange(){let t=this.getAllFilteredOptions();customElements.get("sd-option")&&t.forEach(e=>{e.checkbox=this.multiple})}applySizeToOptions(){this.getSlottedOptions().forEach(t=>{t.size=this.size})}handleDisabledChange(){this.formControlController.setValidity(this.disabled),this.disabled&&(this.open=!1,this.handleOpenChange())}handleValueChange(){this.syncSelectedOptionsAndValue(),this.multiple?this.createComboboxOptionsFromQuery(this.displayInput.value):this.createComboboxOptionsFromQuery("")}handleDisplayInputValueChange(){this.createComboboxOptionsFromQuery(this.displayInputValue)}async handleOpenChange(){if(this.open&&!this.disabled){this.emit("sd-show"),this.addOpenListeners(),await T(this),this.listbox.hidden=!1,this.popup.active=!0;let{keyframes:i,options:l}=E(this,"combobox.show",{dir:this.localize.dir()});await S(this.popup.popup,i,l),this.emit("sd-after-show"),this.filteredOptions.length===0&&this.emit("sd-error");return}this.setCurrentOption(null),this.displayInput.removeAttribute("aria-activedescendant"),this.emit("sd-hide"),this.removeOpenListeners(),await T(this);let{keyframes:t,options:e}=E(this,"combobox.hide",{dir:this.localize.dir()});await S(this.popup.popup,t,e),this.listbox.hidden=!0,this.popup.active=!1,this.emit("sd-after-hide")}async show(){if(this.open||this.disabled){this.open=!1;return}return this.open=!0,Promise.race([x(this,"sd-after-show"),x(this,"sd-error")])}async hide(){if(!this.open||this.disabled){this.open=!1;return}return this.displayInputValue="",this.open=!1,x(this,"sd-after-hide")}checkValidity(){return this.valueInput.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.formControlController.fakeUserInteraction(),this.valueInput.reportValidity()}setCustomValidity(t){this.valueInput.setCustomValidity(t),this.formControlController.updateValidity()}focus(t){this.displayInput.focus(t)}blur(){this.displayInput.blur()}async handleInput(){let t=this.displayInput.value;this.displayInputValue=t,await this.updateComplete,this.open=this.filteredWrapper.children.length>0,this.formControlController.updateValidity(),this.emit("sd-input")}handleChange(){(!this.selectedOptions||!this.multiple)&&(this.selectedTextLabel=this.displayInput.value,this.updateComplete.then(()=>{this.formControlController.updateValidity()}),this.emit("sd-change"))}getSlottedOptions(){return P(L(this.defaultSlot)).flat()}getSlottedOptGroups(){return R(L(this.defaultSlot))}async handleDefaultSlotChange(){if(!customElements.get("sd-option")){customElements.whenDefined("sd-option").then(()=>this.handleDefaultSlotChange());return}let t=this.getSlottedOptions(),e=this.getSlottedOptGroups();this.applySizeToOptions();let i=this.findOptionByValue(t,this.value);this.selectedTextLabel=(i==null?void 0:i.getTextLabel())||"",t.forEach((l,n)=>{this.multiple&&(l.checkbox=!0),l.id=l.id||`sd-combobox-option-${n}`}),e.forEach((l,n)=>{l.id=l.id||`sd-combobox-optgroup-${n}`}),await this.syncSelectedOptionsAndValue(),this.multiple?this.createComboboxOptionsFromQuery(this.displayInputValue):this.createComboboxOptionsFromQuery("")}render(){let t={left:this.hasSlotController.test("left"),right:this.hasSlotController.test("right")},e=this.hasSlotController.test("label"),i=this.hasSlotController.test("help-text"),l=this.label?!0:!!e,n=this.helpText?!0:!!i,p=this.clearable&&!this.disabled,g=this.disabled?"disabled":this.hasFocus&&this.showInvalidStyle?"activeInvalid":this.hasFocus&&this.styleOnValid&&this.showValidStyle?"activeValid":this.hasFocus||this.open?"active":this.showInvalidStyle?"invalid":this.styleOnValid&&this.showValidStyle?"valid":"default",u=this.disabled?"cursor-not-allowed":"cursor-pointer",v=this.disabled?"text-neutral-500":"text-primary",y={sm:"ml-1",md:"ml-2",lg:"ml-2"}[this.size],O={sm:"mr-1",md:"mr-2",lg:"mr-2"}[this.size],m={sm:"text-base",md:"text-lg",lg:"text-xl"}[this.size];return d`<div part="form-control" class="${r("relative text-left",u,this.size==="sm"?"text-sm":"text-base",this.open&&"z-50")}"><label id="label" part="form-control-label" class="${l&&"inline-block mb-2"}" aria-hidden="${!l}" @click="${this.handleLabelClick}"><slot name="label">${this.label}</slot></label><div part="form-control-input" class="relative w-full bg-white text-black"><div part="border" class="${r("absolute top-0 w-full h-full pointer-events-none border rounded-default",this.hasHover&&"bg-neutral-200",{disabled:"border-neutral-500",readonly:"border-neutral-800",activeInvalid:"border-error border-2",activeValid:"border-success border-2",active:"border-primary border-2",invalid:"border-error",valid:"border-success",default:"border-neutral-800"}[g],this.open&&(this.currentPlacement==="bottom"?"rounded-bl-none rounded-br-none":"rounded-tl-none rounded-tr-none"))}"></div><sd-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${r("inline-flex relative w-full",this.currentPlacement==="bottom"?"origin-top":"origin-bottom")}" placement="${this.placement}" strategy="${this.hoist?"fixed":"absolute"}" flip shift sync="width" auto-size="vertical" auto-size-padding="10" exportparts="
-              popup:popup__content,
-            "><div part="combobox" class="${r("relative w-full px-4 flex flex-row items-center rounded-default",this.open&&"shadow",{sm:"py-1 min-h-[32px]",md:"py-1 min-h-[40px]",lg:"py-2 min-h-[48px]"}[this.size])}" slot="anchor" @keydown="${this.handleComboboxKeyDown}" @mousedown="${this.handleComboboxMouseDown}" @mouseenter="${this.handleMouseEnter}" @mouseleave="${this.handleMouseLeave}">${t.left?d`<slot part="left" name="left" class="${r("inline-flex",O,v,m)}"></slot>`:""} ${this.multiple&&this.useTags&&this.tags.length>0?d`<div part="tags" class="${r("flex items-center gap-1",O)}">${this.tags}</div>`:null} <input id="display-input" name="${this.name}" form="${this.form}" part="display-input" class="${r("appearance-none outline-none bg-transparent flex-auto min-w-0",u,this.selectedTextLabel&&!this.multiple?"placeholder-black":"placeholder-neutral-700")}" type="text" placeholder="${this.selectedTextLabel&&!this.multiple?this.selectedTextLabel:this.placeholder||this.localize.term("comboboxDefaultPlaceholder")}" .disabled="${this.disabled}" .value="${this.displayInputValue}" autocomplete="off" spellcheck="false" autocapitalize="off" aria-controls="listbox" aria-expanded="${this.open}" aria-haspopup="listbox" aria-labelledby="label" aria-disabled="${this.disabled}" aria-describedby="help-text invalid-message" aria-invalid="${this.showInvalidStyle}" role="combobox" tabindex="0" @focus="${this.handleFocus}" @blur="${this.handleBlur}" aria-autocomplete="list" aria-owns="listbox" @input="${this.handleInput}" @change="${this.handleChange}"><div aria-live="polite" id="control-value" class="absolute top-0 left-0 opacity-0 -z-10">${this.selectedOptions.map(b=>b==null?void 0:b.getTextLabel()).join(", ")}</div><input class="${r("value-input absolute top-0 left-0 w-full h-full opacity-0 -z-10",u)}" type="text" ?disabled="${this.disabled}" ?required="${this.required}" .value="${Array.isArray(this.value)?this.value.join(", "):this.value}" tabindex="-1" aria-controls="control-value" aria-hidden="true" @focus="${()=>this.focus()}" @invalid="${this.handleInvalid}"> ${p?d`<button part="clear-button" class="${r("flex justify-center",y,this.value.length>0?"visible":"invisible")}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.preventLoosingFocus}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-icon class="${r("text-icon-fill-neutral-800",m)}" name="closing-round" library="system"></sd-icon></slot></button>`:""} ${this.showInvalidStyle?d`<sd-icon part="invalid-icon" class="${r(y,m,"text-error")}" library="system" name="risk"></sd-icon>`:""} ${this.styleOnValid&&this.showValidStyle?d`<sd-icon part="valid-icon" class="${r("flex-shrink-0 text-success",y,m)}" library="system" name="status-check"></sd-icon>`:""}<slot name="right" part="right" class="${r("inline-flex ml-2 leading-[0]",this.disabled?"text-neutral-500":"text-primary",m)}"><sd-icon class="${r("transition-all",this.open?"rotate-180":"rotate-0")}" name="chevron-down" part="chevron" library="system" color="currentColor"></sd-icon></slot></div><div id="listbox" role="listbox" aria-expanded="${this.open}" aria-multiselectable="${this.multiple}" aria-labelledby="label" part="listbox" class="${r("bg-white px-2 py-3 relative border-primary overflow-y-auto",this.open&&"shadow",this.currentPlacement==="bottom"?"border-r-2 border-b-2 border-l-2 rounded-br-default rounded-bl-default":"border-r-2 border-t-2 border-l-2 rounded-tr-default rounded-tl-default")}" tabindex="-1" @mousedown="${this.preventLoosingFocus}" @mouseup="${this.handleOptionClick}"><div part="filtered-listbox" class="overflow-y-scroll">${this.filteredOptions.length===0?d`<span id="noResults" class="px-4 flex items-center w-full transition-all text-left text-base relative text-black py-3" aria-hidden="true" @click="${this.handleNoResultsClick}">${this.localize.term("noResults")}</span>`:this.options}</div><slot id="defaultOptionsSlot" class="hidden" @slotchange="${this.handleDefaultSlotChange}"></slot></div></sd-popup></div><div part="form-control-help-text" id="help-text" class="text-sm text-neutral-700" aria-hidden="${!n}"><slot name="help-text">${this.helpText}</slot></div></div>${this.formControlController.renderInvalidMessage()}`}};s.dependencies={"sd-icon":F,"sd-popup":K,"sd-tag":U},s.styles=[...I.styles,V`:host{display:block;position:relative;width:100%}:host([required]) #label:after{content:" *"}[part=listbox]{max-height:var(--auto-size-available-height,auto)}sd-popup::part(popup){z-index:var(--sd-z-index-dropdown,900)}sd-tag::part(base){border-radius:var(--sd-border-radius-default,.25rem);padding-left:var(--sd-spacing-1,.25rem);padding-right:var(--sd-spacing-1,.25rem)}sd-tag::part(content){display:inline-block;max-width:var(--tag-max-width,15ch);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sd-tag[size=lg]::part(base){padding-left:var(--sd-spacing-2,.5rem);padding-right:var(--sd-spacing-2,.5rem)}sd-tag[disabled=false]::part(base):hover{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-bg-opacity,1))}[part=filtered-listbox] sd-optgroup:first-of-type{--display-divider:none}mark{background-color:transparent;color:inherit;font-weight:700}`],a([c("sd-popup")],s.prototype,"popup",2),a([c('[part="combobox"]')],s.prototype,"combobox",2),a([c('[part="display-input"]')],s.prototype,"displayInput",2),a([c(".value-input")],s.prototype,"valueInput",2),a([c('[part="listbox"]')],s.prototype,"listbox",2),a([c('[part="tags"]')],s.prototype,"tagWrapper",2),a([c('[part="filtered-listbox"]')],s.prototype,"filteredWrapper",2),a([c("slot:not([name])")],s.prototype,"defaultSlot",2),a([c("#invalid-message")],s.prototype,"invalidMessage",2),a([h()],s.prototype,"hasHover",2),a([h()],s.prototype,"hasFocus",2),a([h()],s.prototype,"displayInputValue",2),a([h()],s.prototype,"selectedTextLabel",2),a([h()],s.prototype,"selectedOptions",2),a([h()],s.prototype,"filteredOptions",2),a([h()],s.prototype,"allOptions",2),a([h()],s.prototype,"lastOption",2),a([h()],s.prototype,"showValidStyle",2),a([h()],s.prototype,"showInvalidStyle",2),a([o()],s.prototype,"name",2),a([o({converter:{fromAttribute:t=>t.split(" "),toAttribute:t=>t.join(" ")}})],s.prototype,"value",2),a([A()],s.prototype,"defaultValue",2),a([o({reflect:!0})],s.prototype,"size",2),a([o()],s.prototype,"placeholder",2),a([o({attribute:"max-options-tag-label"})],s.prototype,"maxOptionsTagLabel",2),a([o({reflect:!0,type:Boolean})],s.prototype,"disabled",2),a([o({type:Boolean})],s.prototype,"clearable",2),a([o({reflect:!0,type:Boolean})],s.prototype,"open",2),a([o({type:Boolean})],s.prototype,"hoist",2),a([o()],s.prototype,"label",2),a([o({reflect:!0})],s.prototype,"placement",2),a([o({attribute:"help-text"})],s.prototype,"helpText",2),a([o({reflect:!0})],s.prototype,"form",2),a([o({reflect:!0,type:Boolean})],s.prototype,"required",2),a([h()],s.prototype,"currentPlacement",2),a([o()],s.prototype,"getOption",2),a([o({type:Boolean,reflect:!0})],s.prototype,"multiple",2),a([o({type:Boolean,reflect:!0})],s.prototype,"useTags",2),a([o({attribute:"max-options-visible",type:Number})],s.prototype,"maxOptionsVisible",2),a([o({type:Boolean,reflect:!0,attribute:"style-on-valid"})],s.prototype,"styleOnValid",2),a([o()],s.prototype,"filter",2),a([o()],s.prototype,"getTag",2),a([f("filter",{waitUntilFirstUpdate:!0})],s.prototype,"handleFilterChange",1),a([f("useTags",{waitUntilFirstUpdate:!0})],s.prototype,"handleUseTagsChange",1),a([f("size",{waitUntilFirstUpdate:!0})],s.prototype,"applySizeToOptions",1),a([f("disabled",{waitUntilFirstUpdate:!0})],s.prototype,"handleDisabledChange",1),a([f("value",{waitUntilFirstUpdate:!0})],s.prototype,"handleValueChange",1),a([f("displayInputValue",{waitUntilFirstUpdate:!0})],s.prototype,"handleDisplayInputValueChange",1),a([f("open",{waitUntilFirstUpdate:!0})],s.prototype,"handleOpenChange",1),s=a([k("sd-combobox")],s);C("combobox.show",{keyframes:[{opacity:0,scale:.9},{opacity:1,scale:1}],options:{duration:100,easing:"ease"}});C("combobox.hide",{keyframes:[{opacity:1,scale:1},{opacity:0,scale:.9}],options:{duration:100,easing:"ease"}});export{s as a};

package/cdn-versioned/chunks/chunk.ANSLHQOM.js

@@ -1,11 +0,0 @@
-import{a as U}from"./chunk.6HMIEKMA.js";import{a as K}from"./chunk.MX2AOQKK.js";import{a as A}from"./chunk.D7TMPF3D.js";import{a as H}from"./chunk.X2GM34WQ.js";import{a as L,d as P,e as R,f as w}from"./chunk.W7A3TU2Z.js";import{c as B}from"./chunk.3L472FD4.js";import{b as z}from"./chunk.65NSSTJE.js";import{a as C,c as E}from"./chunk.A3DKF5BY.js";import{a as $,b as F}from"./chunk.LFTAVPYP.js";import{a as S,d as T}from"./chunk.RQYP7MH5.js";import{a as x}from"./chunk.KLRPP4NQ.js";import{a as f}from"./chunk.E2DRD2OX.js";import{a as D}from"./chunk.6HO6CE4A.js";import{a as M}from"./chunk.26YUWEYR.js";import{a as r}from"./chunk.DCOFYPWX.js";import{a as k,b as o,c as h,d as c,h as I}from"./chunk.ERIS2E6E.js";import{b as V,e as d}from"./chunk.IRWHG2Q4.js";import{e as a}from"./chunk.TJOCV4DC.js";var s=class extends I{constructor(){super(...arguments);this.formControlController=new z(this,{assumeInteractionOn:["sd-blur","sd-4-0-1-input"]});this.hasSlotController=new D(this,"help-text","label");this.localize=new M(this);this.hasHover=!1;this.hasFocus=!1;this.displayInputValue="";this.selectedTextLabel="";this.selectedOptions=[];this.filteredOptions=[];this.allOptions=[];this.showValidStyle=!1;this.showInvalidStyle=!1;this.name="";this.value="";this.defaultValue="";this.size="lg";this.placeholder="";this.maxOptionsTagLabel=this.localize.term("tagsSelected");this.disabled=!1;this.clearable=!1;this.open=!1;this.hoist=!1;this.label="";this.placement="bottom";this.helpText="";this.form="";this.required=!1;this.currentPlacement=this.placement;this.getOption=H;this.multiple=!1;this.useTags=!0;this.maxOptionsVisible=3;this.styleOnValid=!1;this.filter=(t,e)=>{let i=w(t.value),l=w(t.getTextLabel()),n=w(e);return i.includes(n)||l.includes(n)};this.getTag=t=>d`<sd-4-0-1-tag ?disabled="${this.disabled}" part="tag" exportparts="
-              base:tag__base,
-              content:tag__content,
-              removable-indicator:tag__removable-indicator,
-            " size="${this.size==="sm"?"sm":"lg"}" removable @keydown="${e=>this.handleTagKeyDown(e,t)}" @sd-remove="${e=>this.handleTagRemove(e,t)}">${t.getTextLabel()}</sd-4-0-1-tag>`;this.handleDocumentFocusIn=t=>{let e=t.composedPath();this&&!e.includes(this)&&this.hide()};this.handleDocumentKeyDown=t=>{if(t.target.closest(".combobox__clear")===null){if(t.key==="Escape"&&(this.open?(t.preventDefault(),t.stopPropagation(),this.hide(),this.displayInput.focus({preventScroll:!0})):this.displayInputValue=""),t.key==="Backspace"&&this.multiple&&this.displayInput.value===""){this.handleTagRemove(new CustomEvent("sd-remove"),this.selectedOptions[this.selectedOptions.length-1]),this.updateComplete.then(()=>this.displayInput.focus({preventScroll:!0}));return}if(t.key==="Enter"){let l=this.getCurrentOption(),n=t.metaKey||t.ctrlKey||t.shiftKey||t.altKey;if(!this.open&&!n){setTimeout(()=>{t.defaultPrevented||this.formControlController.submit()});return}if(!this.open||l!=null&&l.disabled)return;if(l&&!l.disabled){let p=this.value;this.multiple?(this.toggleOptionSelection(l),this.lastOption=l,this.setOrderedSelectedOptions(l),this.updateComplete.then(()=>{this.selectionChanged()})):(this.setOrderedSelectedOptions(l),this.setSelectedOptions(l)),this.updateComplete.then(()=>{this.displayInput.focus({preventScroll:!0}),this.value!==p&&(this.emit("sd-input"),this.emit("sd-change"))})}this.displayInput.focus({preventScroll:!0}),this.multiple||(this.hide(),this.displayInput.focus({preventScroll:!0}));return}["ArrowUp","ArrowDown"].includes(t.key)&&(t.preventDefault(),t.stopPropagation(),this.open||this.show(),this.selectNextOption(t.key==="ArrowDown")),["Home","End"].includes(t.key)&&(t.preventDefault(),t.stopPropagation(),t.key==="Home"?this.displayInput.setSelectionRange(0,0):t.key==="End"&&this.displayInput.setSelectionRange(this.displayInput.value.length,this.displayInput.value.length))}};this.handleDocumentMouseDown=t=>{let e=t.composedPath();this&&!e.includes(this)&&this.hide()}}connectedCallback(){super.connectedCallback(),this.open=!1}firstUpdated(){if(!this.multiple){let t=this.findOptionByValue(this.getSlottedOptions(),this.value);this.selectedTextLabel=(t==null?void 0:t.getTextLabel())||""}this.formControlController.updateValidity()}get validity(){return this.valueInput.validity}get validationMessage(){return this.valueInput.validationMessage}get options(){let t=e=>{let i=this.displayInput.value,l=this.getOption(e,i);return d`${typeof l=="string"?$(l):l}`};return this.filteredOptions.map(e=>e.tagName.toLowerCase()==="sd-4-0-1-optgroup"?(Array.from(e.children).forEach(i=>{i.tagName.toLowerCase()==="sd-4-0-1-option"&&t(i)}),e):t(e))}get tags(){return this.selectedOptions.length<=this.maxOptionsVisible?this.selectedOptions.map((t,e)=>{if(e<this.maxOptionsVisible||this.maxOptionsVisible<=0){let i=this.getTag(t,e);return d`<div @sd-remove="${l=>this.handleTagRemove(l,t)}">${typeof i=="string"?$(i):i}</div>`}return[d``]}):[d`<sd-4-0-1-tag ?disabled="${this.disabled}" part="tag" exportparts="
-              base:tag__base,
-              content:tag__content,
-              removable-indicator:tag__removable-indicator,
-            " size="${this.size==="sm"?"sm":"lg"}" removable @keydown="${t=>this.handleTagMaxOptionsKeyDown(t)}" @sd-remove="${t=>this.handleTagRemove(t)}">${this.selectedOptions.length} ${this.maxOptionsTagLabel}</sd-4-0-1-tag>`]}addOpenListeners(){document.addEventListener("focusin",this.handleDocumentFocusIn),document.addEventListener("mousedown",this.handleDocumentMouseDown),this.getRootNode()!==document&&this.getRootNode().addEventListener("focusin",this.handleDocumentFocusIn)}removeOpenListeners(){document.removeEventListener("focusin",this.handleDocumentFocusIn),document.removeEventListener("mousedown",this.handleDocumentMouseDown),this.getRootNode()!==document&&this.getRootNode().removeEventListener("focusin",this.handleDocumentFocusIn)}handleFocus(){this.hasFocus=!0,this.emit("sd-focus")}handleBlur(){this.hasFocus=!1,this.emit("sd-blur")}handleTagKeyDown(t,e){t.key==="Backspace"&&this.multiple&&(t.preventDefault(),t.stopPropagation(),this.handleTagRemove(new CustomEvent("sd-remove"),e),this.updateComplete.then(()=>this.displayInput.focus({preventScroll:!0})))}handleTagMaxOptionsKeyDown(t){t.key==="Backspace"&&this.multiple&&(t.preventDefault(),t.stopPropagation(),this.handleTagRemove(new CustomEvent("sd-remove"),this.selectedOptions[this.selectedOptions.length-1]),this.updateComplete.then(()=>this.displayInput.focus({preventScroll:!0})))}handleLabelClick(){this.displayInput.focus()}handleTagRemove(t,e){t.stopPropagation(),e||this.clearCombobox(),e&&!this.disabled&&(this.toggleOptionSelection(e,!1),this.setOrderedSelectedOptions(e),this.updateComplete.then(()=>{this.selectionChanged(),this.emit("sd-input"),this.emit("sd-change")}))}handleComboboxMouseDown(t){let i=t.composedPath().some(n=>n instanceof HTMLSlotElement&&n.name==="removable-indicator");if(this.disabled||i)return;(this.open?this.hide():this.show()).then(()=>{setTimeout(()=>this.displayInput.focus({preventScroll:!0}))})}handleComboboxKeyDown(t){t.key!=="Tab"&&this.handleDocumentKeyDown(t)}handleClearClick(t){t.stopPropagation(),this.clearCombobox()}handleNoResultsClick(t){t.preventDefault(),this.hide()}clearCombobox(){this.value!==""&&(this.value="",this.displayInputValue="",this.selectedTextLabel="",this.lastOption=void 0,this.selectedOptions=[],this.getSlottedOptions().forEach(t=>{t.selected=!1}),this.displayInput.focus({preventScroll:!0}),this.updateComplete.then(()=>{this.emit("sd-clear"),this.emit("sd-input"),this.emit("sd-change")}))}preventLoosingFocus(t){t.stopPropagation(),t.preventDefault()}handleOptionClick(t){let i=t.target.closest("sd-4-0-1-option"),l=this.value;i&&!i.disabled&&(this.multiple?(this.toggleOptionSelection(i),this.lastOption=i,this.setOrderedSelectedOptions(i),this.updateComplete.then(()=>{this.selectionChanged()})):(this.setOrderedSelectedOptions(i),this.setSelectedOptions(i)),this.updateComplete.then(()=>{this.displayInput.focus({preventScroll:!0}),this.value!==l&&(this.emit("sd-input"),this.emit("sd-change"))}),this.multiple||(this.hide(),this.displayInput.focus({preventScroll:!0})))}selectNextOption(t){let e=this.getAllFilteredOptions();if(e.length===0)return;let i=this.getCurrentOption(),l=e.indexOf(i),n=Math.max(0,l);if(t){let p=l+1;n=p>e.length-1?0:p}else{let p=l-1;n=p<0?e.length-1:p}this.setCurrentOption(e[n]),B(this.getCurrentOption(),this.listbox,"vertical","auto")}getAllFilteredOptions(){return[...this.filteredWrapper.querySelectorAll("sd-4-0-1-option")]}getCurrentOption(){return this.getAllFilteredOptions().find(t=>t.current)}setCurrentOption(t){let e=this.getAllFilteredOptions();this.displayInput.removeAttribute("aria-activedescendant"),e.forEach(i=>{i.current=!1,i.setAttribute("aria-selected","false")}),t&&(t.current=!0,t.setAttribute("aria-selected","true"),this.displayInput.setAttribute("aria-activedescendant",t.id))}toggleOptionSelection(t,e){let l=this.getSlottedOptions().find(n=>n.value&&t.value?n.value===t.value:n.getTextLabel()===t.getTextLabel());l&&(l.selected=e!=null?e:!l.selected)}findOptionByValue(t,e){if(e)return Array.isArray(e)?t.find(i=>e.includes(i.value)):t.find(i=>i.value===e)}selectedOptionsAndValueSynced(){var t;return!this.value&&this.selectedOptions.length===0?!0:Array.isArray(this.value)?this.value.length===this.selectedOptions.length:this.value===((t=this.selectedOptions[0])==null?void 0:t.value)}isOptionSelected(t){return t.value?this.value.includes(t.value):this.value.includes(t.getTextLabel())}syncSelectedOptionsAndValue(){return this.selectedOptionsAndValueSynced()?void 0:(this.getSlottedOptions().forEach(e=>{e.selected=!1}),this.selectedOptions=this.getSlottedOptions().filter(e=>this.isOptionSelected(e)),this.selectedOptions.forEach(e=>{e&&(e.selected=!0)}),Promise.resolve())}compareOptions(t,e){return t.value&&e.value?t.value===e.value:t.getTextLabel()===e.getTextLabel()}setSelectedOptions(t){this.getSlottedOptions().forEach(i=>{i.selected=this.compareOptions(i,t)}),this.selectionChanged()}setOrderedSelectedOptions(t){let e=this.getSlottedOptions().find(i=>this.compareOptions(i,t));this.multiple?this.selectedOptions.length>0&&e&&this.selectedOptions.find(i=>this.compareOptions(i,e))?this.selectedOptions=this.selectedOptions.filter(i=>!this.compareOptions(i,e)):this.selectedOptions=[...this.selectedOptions,e]:this.selectedOptions=[e]}selectionChanged(){var e,i,l;let t=this.selectedOptions.some(n=>n?this.isOptionSelected(n):!1);this.multiple?(!t&&this.selectedOptions.length>0?this.value=[...this.value,...this.selectedOptions.map(n=>n.value||n.getTextLabel())]:this.value=this.selectedOptions.map(n=>(n==null?void 0:n.value)||(n==null?void 0:n.getTextLabel())||""),this.displayInputValue=""):(this.value=((e=this.selectedOptions[0])==null?void 0:e.value)||((i=this.selectedOptions[0])==null?void 0:i.getTextLabel())||"",this.selectedTextLabel=((l=this.selectedOptions[0])==null?void 0:l.getTextLabel())||"",this.displayInputValue=""),this.updateComplete.then(()=>{this.formControlController.updateValidity()})}createComboboxOptionsFromQuery(t){let e=[];this.filteredOptions=this.getSlottedOptions().filter(i=>this.filter(i,t)||t==="").map(i=>{var y,O,m;let l=i.cloneNode(!0);if(l.current=l.value===((y=this.lastOption)==null?void 0:y.value),l.selected=i.selected,l.checkbox=i.checkbox,l.size=i.size,!(((O=i.parentElement)==null?void 0:O.tagName.toLowerCase())==="sd-4-0-1-optgroup"))return l;let p=i.parentElement,g=(m=p.querySelector('[slot="label"]'))==null?void 0:m.cloneNode(!0),u=e.find(b=>b.id===p.id);if(u){u==null||u.appendChild(l),g&&(u==null||u.appendChild(g));return}let v=p.cloneNode();return v.appendChild(l),g&&v.appendChild(g),e.push(v),v}).filter(Boolean)}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t),this.invalidMessage.textContent=t.target.validationMessage}handleMouseEnter(){this.hasHover=!0}handleMouseLeave(){this.hasHover=!1}handleCurrentPlacement(t){let e=t.detail;e&&(this.currentPlacement=e)}handleFilterChange(){this.createComboboxOptionsFromQuery(this.displayInputValue)}handleUseTagsChange(){let t=this.getAllFilteredOptions();customElements.get("sd-4-0-1-option")&&t.forEach(e=>{e.checkbox=this.multiple})}applySizeToOptions(){this.getSlottedOptions().forEach(t=>{t.size=this.size})}handleDisabledChange(){this.formControlController.setValidity(this.disabled),this.disabled&&(this.open=!1,this.handleOpenChange())}handleValueChange(){this.syncSelectedOptionsAndValue(),this.multiple?this.createComboboxOptionsFromQuery(this.displayInput.value):this.createComboboxOptionsFromQuery("")}handleDisplayInputValueChange(){this.createComboboxOptionsFromQuery(this.displayInputValue)}async handleOpenChange(){if(this.open&&!this.disabled){this.emit("sd-show"),this.addOpenListeners(),await T(this),this.listbox.hidden=!1,this.popup.active=!0;let{keyframes:i,options:l}=E(this,"combobox.show",{dir:this.localize.dir()});await S(this.popup.popup,i,l),this.emit("sd-after-show"),this.filteredOptions.length===0&&this.emit("sd-error");return}this.setCurrentOption(null),this.displayInput.removeAttribute("aria-activedescendant"),this.emit("sd-hide"),this.removeOpenListeners(),await T(this);let{keyframes:t,options:e}=E(this,"combobox.hide",{dir:this.localize.dir()});await S(this.popup.popup,t,e),this.listbox.hidden=!0,this.popup.active=!1,this.emit("sd-after-hide")}async show(){if(this.open||this.disabled){this.open=!1;return}return this.open=!0,Promise.race([x(this,"sd-after-show"),x(this,"sd-error")])}async hide(){if(!this.open||this.disabled){this.open=!1;return}return this.displayInputValue="",this.open=!1,x(this,"sd-after-hide")}checkValidity(){return this.valueInput.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.formControlController.fakeUserInteraction(),this.valueInput.reportValidity()}setCustomValidity(t){this.valueInput.setCustomValidity(t),this.formControlController.updateValidity()}focus(t){this.displayInput.focus(t)}blur(){this.displayInput.blur()}async handleInput(){let t=this.displayInput.value;this.displayInputValue=t,await this.updateComplete,this.open=this.filteredWrapper.children.length>0,this.formControlController.updateValidity(),this.emit("sd-input")}handleChange(){(!this.selectedOptions||!this.multiple)&&(this.selectedTextLabel=this.displayInput.value,this.updateComplete.then(()=>{this.formControlController.updateValidity()}),this.emit("sd-change"))}getSlottedOptions(){return P(L(this.defaultSlot)).flat()}getSlottedOptGroups(){return R(L(this.defaultSlot))}async handleDefaultSlotChange(){if(!customElements.get("sd-4-0-1-option")){customElements.whenDefined("sd-4-0-1-option").then(()=>this.handleDefaultSlotChange());return}let t=this.getSlottedOptions(),e=this.getSlottedOptGroups();this.applySizeToOptions();let i=this.findOptionByValue(t,this.value);this.selectedTextLabel=(i==null?void 0:i.getTextLabel())||"",t.forEach((l,n)=>{this.multiple&&(l.checkbox=!0),l.id=l.id||`sd-4-0-1-combobox-option-${n}`}),e.forEach((l,n)=>{l.id=l.id||`sd-4-0-1-combobox-optgroup-${n}`}),await this.syncSelectedOptionsAndValue(),this.multiple?this.createComboboxOptionsFromQuery(this.displayInputValue):this.createComboboxOptionsFromQuery("")}render(){let t={left:this.hasSlotController.test("left"),right:this.hasSlotController.test("right")},e=this.hasSlotController.test("label"),i=this.hasSlotController.test("help-text"),l=this.label?!0:!!e,n=this.helpText?!0:!!i,p=this.clearable&&!this.disabled,g=this.disabled?"disabled":this.hasFocus&&this.showInvalidStyle?"activeInvalid":this.hasFocus&&this.styleOnValid&&this.showValidStyle?"activeValid":this.hasFocus||this.open?"active":this.showInvalidStyle?"invalid":this.styleOnValid&&this.showValidStyle?"valid":"default",u=this.disabled?"cursor-not-allowed":"cursor-pointer",v=this.disabled?"text-neutral-500":"text-primary",y={sm:"ml-1",md:"ml-2",lg:"ml-2"}[this.size],O={sm:"mr-1",md:"mr-2",lg:"mr-2"}[this.size],m={sm:"text-base",md:"text-lg",lg:"text-xl"}[this.size];return d`<div part="form-control" class="${r("relative text-left",u,this.size==="sm"?"text-sm":"text-base",this.open&&"z-50")}"><label id="label" part="form-control-label" class="${l&&"inline-block mb-2"}" aria-hidden="${!l}" @click="${this.handleLabelClick}"><slot name="label">${this.label}</slot></label><div part="form-control-input" class="relative w-full bg-white text-black"><div part="border" class="${r("absolute top-0 w-full h-full pointer-events-none border rounded-default",this.hasHover&&"bg-neutral-200",{disabled:"border-neutral-500",readonly:"border-neutral-800",activeInvalid:"border-error border-2",activeValid:"border-success border-2",active:"border-primary border-2",invalid:"border-error",valid:"border-success",default:"border-neutral-800"}[g],this.open&&(this.currentPlacement==="bottom"?"rounded-bl-none rounded-br-none":"rounded-tl-none rounded-tr-none"))}"></div><sd-4-0-1-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${r("inline-flex relative w-full",this.currentPlacement==="bottom"?"origin-top":"origin-bottom")}" placement="${this.placement}" strategy="${this.hoist?"fixed":"absolute"}" flip shift sync="width" auto-size="vertical" auto-size-padding="10" exportparts="
-              popup:popup__content,
-            "><div part="combobox" class="${r("relative w-full px-4 flex flex-row items-center rounded-default",this.open&&"shadow",{sm:"py-1 min-h-[32px]",md:"py-1 min-h-[40px]",lg:"py-2 min-h-[48px]"}[this.size])}" slot="anchor" @keydown="${this.handleComboboxKeyDown}" @mousedown="${this.handleComboboxMouseDown}" @mouseenter="${this.handleMouseEnter}" @mouseleave="${this.handleMouseLeave}">${t.left?d`<slot part="left" name="left" class="${r("inline-flex",O,v,m)}"></slot>`:""} ${this.multiple&&this.useTags&&this.tags.length>0?d`<div part="tags" class="${r("flex items-center gap-1",O)}">${this.tags}</div>`:null} <input id="display-input" name="${this.name}" form="${this.form}" part="display-input" class="${r("appearance-none outline-none bg-transparent flex-auto min-w-0",u,this.selectedTextLabel&&!this.multiple?"placeholder-black":"placeholder-neutral-700")}" type="text" placeholder="${this.selectedTextLabel&&!this.multiple?this.selectedTextLabel:this.placeholder||this.localize.term("comboboxDefaultPlaceholder")}" .disabled="${this.disabled}" .value="${this.displayInputValue}" autocomplete="off" spellcheck="false" autocapitalize="off" aria-controls="listbox" aria-expanded="${this.open}" aria-haspopup="listbox" aria-labelledby="label" aria-disabled="${this.disabled}" aria-describedby="help-text invalid-message" aria-invalid="${this.showInvalidStyle}" role="combobox" tabindex="0" @focus="${this.handleFocus}" @blur="${this.handleBlur}" aria-autocomplete="list" aria-owns="listbox" @input="${this.handleInput}" @change="${this.handleChange}"><div aria-live="polite" id="control-value" class="absolute top-0 left-0 opacity-0 -z-10">${this.selectedOptions.map(b=>b==null?void 0:b.getTextLabel()).join(", ")}</div><input class="${r("value-input absolute top-0 left-0 w-full h-full opacity-0 -z-10",u)}" type="text" ?disabled="${this.disabled}" ?required="${this.required}" .value="${Array.isArray(this.value)?this.value.join(", "):this.value}" tabindex="-1" aria-controls="control-value" aria-hidden="true" @focus="${()=>this.focus()}" @invalid="${this.handleInvalid}"> ${p?d`<button part="clear-button" class="${r("flex justify-center",y,this.value.length>0?"visible":"invisible")}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.preventLoosingFocus}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-4-0-1-icon class="${r("text-icon-fill-neutral-800",m)}" name="closing-round" library="system"></sd-4-0-1-icon></slot></button>`:""} ${this.showInvalidStyle?d`<sd-4-0-1-icon part="invalid-icon" class="${r(y,m,"text-error")}" library="system" name="risk"></sd-4-0-1-icon>`:""} ${this.styleOnValid&&this.showValidStyle?d`<sd-4-0-1-icon part="valid-icon" class="${r("flex-shrink-0 text-success",y,m)}" library="system" name="status-check"></sd-4-0-1-icon>`:""}<slot name="right" part="right" class="${r("inline-flex ml-2 leading-[0]",this.disabled?"text-neutral-500":"text-primary",m)}"><sd-4-0-1-icon class="${r("transition-all",this.open?"rotate-180":"rotate-0")}" name="chevron-down" part="chevron" library="system" color="currentColor"></sd-4-0-1-icon></slot></div><div id="listbox" role="listbox" aria-expanded="${this.open}" aria-multiselectable="${this.multiple}" aria-labelledby="label" part="listbox" class="${r("bg-white px-2 py-3 relative border-primary overflow-y-auto",this.open&&"shadow",this.currentPlacement==="bottom"?"border-r-2 border-b-2 border-l-2 rounded-br-default rounded-bl-default":"border-r-2 border-t-2 border-l-2 rounded-tr-default rounded-tl-default")}" tabindex="-1" @mousedown="${this.preventLoosingFocus}" @mouseup="${this.handleOptionClick}"><div part="filtered-listbox" class="overflow-y-scroll">${this.filteredOptions.length===0?d`<span id="noResults" class="px-4 flex items-center w-full transition-all text-left text-base relative text-black py-3" aria-hidden="true" @click="${this.handleNoResultsClick}">${this.localize.term("noResults")}</span>`:this.options}</div><slot id="defaultOptionsSlot" class="hidden" @slotchange="${this.handleDefaultSlotChange}"></slot></div></sd-4-0-1-popup></div><div part="form-control-help-text" id="help-text" class="text-sm text-neutral-700" aria-hidden="${!n}"><slot name="help-text">${this.helpText}</slot></div></div>${this.formControlController.renderInvalidMessage()}`}};s.dependencies={"sd-4-0-1-icon":F,"sd-4-0-1-popup":K,"sd-4-0-1-tag":U},s.styles=[...I.styles,V`:host{display:block;position:relative;width:100%}:host([required]) #label:after{content:" *"}[part=listbox]{max-height:var(--auto-size-available-height,auto)}sd-4-0-1-popup::part(popup){z-index:var(--sd-z-index-dropdown,900)}sd-4-0-1-tag::part(base){border-radius:var(--sd-border-radius-default,.25rem);padding-left:var(--sd-spacing-1,.25rem);padding-right:var(--sd-spacing-1,.25rem)}sd-4-0-1-tag::part(content){display:inline-block;max-width:var(--tag-max-width,15ch);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sd-4-0-1-tag[size=lg]::part(base){padding-left:var(--sd-spacing-2,.5rem);padding-right:var(--sd-spacing-2,.5rem)}sd-4-0-1-tag[disabled=false]::part(base):hover{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-bg-opacity,1))}[part=filtered-listbox] sd-4-0-1-optgroup:first-of-type{--display-divider:none}mark{background-color:transparent;color:inherit;font-weight:700}`],a([c("sd-4-0-1-popup")],s.prototype,"popup",2),a([c('[part="combobox"]')],s.prototype,"combobox",2),a([c('[part="display-input"]')],s.prototype,"displayInput",2),a([c(".value-input")],s.prototype,"valueInput",2),a([c('[part="listbox"]')],s.prototype,"listbox",2),a([c('[part="tags"]')],s.prototype,"tagWrapper",2),a([c('[part="filtered-listbox"]')],s.prototype,"filteredWrapper",2),a([c("slot:not([name])")],s.prototype,"defaultSlot",2),a([c("#invalid-message")],s.prototype,"invalidMessage",2),a([h()],s.prototype,"hasHover",2),a([h()],s.prototype,"hasFocus",2),a([h()],s.prototype,"displayInputValue",2),a([h()],s.prototype,"selectedTextLabel",2),a([h()],s.prototype,"selectedOptions",2),a([h()],s.prototype,"filteredOptions",2),a([h()],s.prototype,"allOptions",2),a([h()],s.prototype,"lastOption",2),a([h()],s.prototype,"showValidStyle",2),a([h()],s.prototype,"showInvalidStyle",2),a([o()],s.prototype,"name",2),a([o({converter:{fromAttribute:t=>t.split(" "),toAttribute:t=>t.join(" ")}})],s.prototype,"value",2),a([A()],s.prototype,"defaultValue",2),a([o({reflect:!0})],s.prototype,"size",2),a([o()],s.prototype,"placeholder",2),a([o({attribute:"max-options-tag-label"})],s.prototype,"maxOptionsTagLabel",2),a([o({reflect:!0,type:Boolean})],s.prototype,"disabled",2),a([o({type:Boolean})],s.prototype,"clearable",2),a([o({reflect:!0,type:Boolean})],s.prototype,"open",2),a([o({type:Boolean})],s.prototype,"hoist",2),a([o()],s.prototype,"label",2),a([o({reflect:!0})],s.prototype,"placement",2),a([o({attribute:"help-text"})],s.prototype,"helpText",2),a([o({reflect:!0})],s.prototype,"form",2),a([o({reflect:!0,type:Boolean})],s.prototype,"required",2),a([h()],s.prototype,"currentPlacement",2),a([o()],s.prototype,"getOption",2),a([o({type:Boolean,reflect:!0})],s.prototype,"multiple",2),a([o({type:Boolean,reflect:!0})],s.prototype,"useTags",2),a([o({attribute:"max-options-visible",type:Number})],s.prototype,"maxOptionsVisible",2),a([o({type:Boolean,reflect:!0,attribute:"style-on-valid"})],s.prototype,"styleOnValid",2),a([o()],s.prototype,"filter",2),a([o()],s.prototype,"getTag",2),a([f("filter",{waitUntilFirstUpdate:!0})],s.prototype,"handleFilterChange",1),a([f("useTags",{waitUntilFirstUpdate:!0})],s.prototype,"handleUseTagsChange",1),a([f("size",{waitUntilFirstUpdate:!0})],s.prototype,"applySizeToOptions",1),a([f("disabled",{waitUntilFirstUpdate:!0})],s.prototype,"handleDisabledChange",1),a([f("value",{waitUntilFirstUpdate:!0})],s.prototype,"handleValueChange",1),a([f("displayInputValue",{waitUntilFirstUpdate:!0})],s.prototype,"handleDisplayInputValueChange",1),a([f("open",{waitUntilFirstUpdate:!0})],s.prototype,"handleOpenChange",1),s=a([k("sd-4-0-1-combobox")],s);C("combobox.show",{keyframes:[{opacity:0,scale:.9},{opacity:1,scale:1}],options:{duration:100,easing:"ease"}});C("combobox.hide",{keyframes:[{opacity:1,scale:1},{opacity:0,scale:.9}],options:{duration:100,easing:"ease"}});export{s as a};