@vielzeug/refine 1.1.3 → 1.3.0

package/dist/code-window.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"code-window.cjs","names":[],"sources":["../src/content/code-window/code-window.ts"],"sourcesContent":["import { define, html, prop } from '@vielzeug/ore';\nimport { when } from '@vielzeug/ore/directives';\nimport { computed } from '@vielzeug/ripple';\n\nimport componentStyles from './code-window.css?inline';\n\n/** `ore-code-window` variant */\nexport type CodeWindowVariant = 'code' | 'chat';\n\n/** `ore-code-window` component properties */\nexport type OreCodeWindowProps = {\n  /** Filename label shown after the language badge (`variant=\"code\"` only) */\n  filename?: string;\n  /** Language badge text, e.g. `\"ts\"`, `\"sh\"` (`variant=\"code\"` only) */\n  lang?: string;\n  /** Title string shown beside the traffic-light dots (`variant=\"chat\"` only) */\n  title?: string;\n  /**\n   * `\"code\"` (default) — header shows a language badge + filename.\n   * `\"chat\"` — header shows traffic-light dots + a title.\n   */\n  variant?: CodeWindowVariant;\n};\n\n/**\n * A styled window chrome for code blocks and AI/MCP conversation flows.\n *\n * Two variants:\n * - `variant=\"code\"` (default) — language badge + optional filename header.\n * - `variant=\"chat\"` — traffic-light dots + title header.\n *\n * @element ore-code-window\n *\n * @attr {'code'|'chat'} variant - Window style variant\n * @attr {string} lang - Language badge label (variant=\"code\" only)\n * @attr {string} filename - Filename shown next to the badge (variant=\"code\" only)\n * @attr {string} title - Label beside the dots (variant=\"chat\" only)\n *\n * @slot - Main body content (code, conversation turns, or any markup)\n * @slot header-end - Optional content appended to the trailing edge of the header\n *\n * @cssprop --code-window-bg - Window background color\n * @cssprop --code-window-header-bg - Header background color\n * @cssprop --code-window-border-color - Border color\n * @cssprop --code-window-radius - Border radius\n * @cssprop --code-window-shadow - Box shadow\n * @cssprop --code-window-body-padding - Body slot padding\n *\n * @part window - The root window element\n * @part header - The header bar\n * @part lang - The language badge (`variant=\"code\"`)\n * @part filename - The filename label (`variant=\"code\"`)\n * @part dots - The traffic-light dot container (`variant=\"chat\"`)\n * @part title - The title label (`variant=\"chat\"`)\n * @part body - The body container wrapping the default slot\n *\n * @example\n * ```html\n * <ore-code-window lang=\"ts\" filename=\"app.ts\">\n *   <pre>const x = 1;</pre>\n * </ore-code-window>\n *\n * <ore-code-window variant=\"chat\" title=\"MCP tool call\">\n *   <!-- conversation turns go here -->\n * </ore-code-window>\n * ```\n */\nexport const CODE_WINDOW_TAG = 'ore-code-window' as const;\ndefine<OreCodeWindowProps>(CODE_WINDOW_TAG, {\n  props: {\n    filename: prop.string(),\n    lang: prop.string('ts'),\n    title: prop.string('MCP tool call'),\n    variant: prop.oneOf(['code', 'chat'] as const, 'code'),\n  },\n  setup(props) {\n    const isCode = computed(() => props.variant.value === 'code');\n    const hasFilename = computed(() => Boolean(props.filename.value));\n\n    return html`\n      <div class=\"window\" part=\"window\">\n        <div class=\"header\" part=\"header\">\n          ${when(\n            isCode,\n            () => html`\n              <span class=\"lang\" part=\"lang\">${props.lang}</span>\n              ${when(hasFilename, () => html`<span class=\"filename\" part=\"filename\">${props.filename}</span>`)}\n            `,\n            () => html`\n              <div class=\"dots\" part=\"dots\" aria-hidden=\"true\"><span></span><span></span><span></span></div>\n              <span class=\"title\" part=\"title\">${props.title}</span>\n            `,\n          )}\n          <div class=\"header-spacer\"></div>\n          <slot name=\"header-end\"></slot>\n        </div>\n        <div class=\"body\" part=\"body\">\n          <slot></slot>\n        </div>\n      </div>\n    `;\n  },\n  styles: [componentStyles],\n});\n"],"mappings":"2RAmEA,IAAa,EAAkB,+BACJ,EAAiB,CAC1C,MAAO,CACL,SAAU,EAAA,KAAK,OAAO,EACtB,KAAM,EAAA,KAAK,OAAO,IAAI,EACtB,MAAO,EAAA,KAAK,OAAO,eAAe,EAClC,QAAS,EAAA,KAAK,MAAM,CAAC,OAAQ,MAAM,EAAY,MAAM,CACvD,EACA,MAAM,EAAO,CACX,IAAM,GAAA,EAAA,EAAA,SAAA,KAAwB,EAAM,QAAQ,QAAU,MAAM,EACtD,GAAA,EAAA,EAAA,SAAA,KAA6B,EAAQ,EAAM,SAAS,KAAM,EAEhE,MAAO,GAAA,IAAI;;;YAGH,EAAA,KACA,MACM,EAAA,IAAI;+CACyB,EAAM,KAAK;gBAC1C,EAAA,KAAK,MAAmB,EAAA,IAAI,0CAA0C,EAAM,SAAS,QAAQ,EAAE;kBAE7F,EAAA,IAAI;;iDAE2B,EAAM,MAAM;aAEnD,EAAE;;;;;;;;KASV,EACA,OAAQ,CAAC,EAAA,OAAe,CAC1B,CAAC"}
+{"version":3,"file":"code-window.cjs","names":[],"sources":["../src/content/code-window/code-window.ts"],"sourcesContent":["import { define, html, prop } from '@vielzeug/ore';\nimport { when } from '@vielzeug/ore/directives';\nimport { computed } from '@vielzeug/ripple';\n\nimport componentStyles from './code-window.css?inline';\n\n/** `ore-code-window` variant */\nexport type CodeWindowVariant = 'code' | 'chat';\n\n/** `ore-code-window` component properties */\nexport type OreCodeWindowProps = {\n  /** Filename label shown after the language badge (`variant=\"code\"` only) */\n  filename?: string;\n  /** Language badge text, e.g. `\"ts\"`, `\"sh\"` (`variant=\"code\"` only) */\n  lang?: string;\n  /** Title string shown beside the traffic-light dots (`variant=\"chat\"` only) */\n  title?: string;\n  /**\n   * `\"code\"` (default) — header shows a language badge + filename.\n   * `\"chat\"` — header shows traffic-light dots + a title.\n   */\n  variant?: CodeWindowVariant;\n};\n\n/**\n * A styled window chrome for code blocks and AI/MCP conversation flows.\n *\n * Two variants:\n * - `variant=\"code\"` (default) — language badge + optional filename header.\n * - `variant=\"chat\"` — traffic-light dots + title header.\n *\n * @element ore-code-window\n *\n * @attr {'code'|'chat'} variant - Window style variant\n * @attr {string} lang - Language badge label (variant=\"code\" only)\n * @attr {string} filename - Filename shown next to the badge (variant=\"code\" only)\n * @attr {string} title - Label beside the dots (variant=\"chat\" only)\n *\n * @slot - Main body content (code, conversation turns, or any markup)\n * @slot header-end - Optional content appended to the trailing edge of the header\n *\n * @cssprop --code-window-bg - Window background color\n * @cssprop --code-window-header-bg - Header background color\n * @cssprop --code-window-border-color - Border color\n * @cssprop --code-window-radius - Border radius\n * @cssprop --code-window-shadow - Box shadow\n * @cssprop --code-window-body-padding - Body slot padding\n *\n * @part window - The root window element\n * @part header - The header bar\n * @part lang - The language badge (`variant=\"code\"`)\n * @part filename - The filename label (`variant=\"code\"`)\n * @part dots - The traffic-light dot container (`variant=\"chat\"`)\n * @part title - The title label (`variant=\"chat\"`)\n * @part body - The body container wrapping the default slot\n *\n * @example\n * ```html\n * <ore-code-window lang=\"ts\" filename=\"app.ts\">\n *   <pre>const x = 1;</pre>\n * </ore-code-window>\n *\n * <ore-code-window variant=\"chat\" title=\"MCP tool call\">\n *   <!-- conversation turns go here -->\n * </ore-code-window>\n * ```\n */\nexport const CODE_WINDOW_TAG = 'ore-code-window' as const;\ndefine<OreCodeWindowProps>(CODE_WINDOW_TAG, {\n  props: {\n    filename: prop.string(),\n    lang: prop.string('ts'),\n    title: prop.string('MCP tool call'),\n    variant: prop.oneOf(['code', 'chat'] as const, 'code'),\n  },\n  setup(props) {\n    const isCode = computed(() => props.variant.value === 'code');\n    const hasFilename = computed(() => Boolean(props.filename.value));\n\n    return html`\n      <div class=\"window\" part=\"window\">\n        <div class=\"header\" part=\"header\">\n          ${when(\n            isCode,\n            () => html`\n              <span class=\"lang\" part=\"lang\">${props.lang}</span>\n              ${when(hasFilename, () => html`<span class=\"filename\" part=\"filename\">${props.filename}</span>`)}\n            `,\n            () => html`\n              <div class=\"dots\" part=\"dots\" aria-hidden=\"true\"><span></span><span></span><span></span></div>\n              <span class=\"title\" part=\"title\">${props.title}</span>\n            `,\n          )}\n          <div class=\"header-spacer\"></div>\n          <slot name=\"header-end\"></slot>\n        </div>\n        <div class=\"body\" part=\"body\">\n          <slot></slot>\n        </div>\n      </div>\n    `;\n  },\n  styles: [componentStyles],\n});\n"],"mappings":"oRAmEA,IAAa,EAAkB,+BACJ,EAAiB,CAC1C,MAAO,CACL,SAAU,EAAA,KAAK,OAAO,EACtB,KAAM,EAAA,KAAK,OAAO,IAAI,EACtB,MAAO,EAAA,KAAK,OAAO,eAAe,EAClC,QAAS,EAAA,KAAK,MAAM,CAAC,OAAQ,MAAM,EAAY,MAAM,CACvD,EACA,MAAM,EAAO,CACX,IAAM,GAAA,EAAA,EAAA,SAAA,KAAwB,EAAM,QAAQ,QAAU,MAAM,EACtD,GAAA,EAAA,EAAA,SAAA,KAA6B,EAAQ,EAAM,SAAS,KAAM,EAEhE,MAAO,GAAA,IAAI;;;YAGH,EAAA,KACA,MACM,EAAA,IAAI;+CACyB,EAAM,KAAK;gBAC1C,EAAA,KAAK,MAAmB,EAAA,IAAI,0CAA0C,EAAM,SAAS,QAAQ,EAAE;kBAE7F,EAAA,IAAI;;iDAE2B,EAAM,MAAM;aAEnD,EAAE;;;;;;;;KASV,EACA,OAAQ,CAAC,EAAA,OAAe,CAC1B,CAAC"}

package/dist/code-window.js

@@ -1,6 +1,6 @@
 import { when as e } from "./ore/dist/directives/when.js";
 import "./ore/dist/directives.js";
-import t from "./content/code-window/code-window.css?inline.js";
+import t from "./content/code-window/code-window.css.js";
 import { define as n, html as r, prop as i } from "@vielzeug/ore";
 import { computed as a } from "@vielzeug/ripple";
 //#region src/content/code-window/code-window.ts

package/dist/combobox.cjs

@@ -1,27 +1,27 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/accessibility.css.cjs"),t=require("./headless/ore.cjs"),n=require("./headless/choice-field.cjs"),r=require("./headless/keyboard.cjs"),i=require("./headless/option-list.cjs"),a=require("./inputs/shared/form-context.cjs"),o=require("./inputs/combobox/combobox-options.cjs"),s=require("./inputs/combobox/combobox.css?inline.cjs");let c=require("@vielzeug/ore"),l=require("@vielzeug/ripple");var u=`ore-combobox`;(0,c.define)(u,{formAssociated:!0,props:{autoclose:c.prop.bool(!1),color:c.prop.string(),creatable:c.prop.bool(!1),disabled:c.prop.bool(!1),error:c.prop.string(),fullwidth:c.prop.bool(!1),helper:c.prop.string(),label:c.prop.string(),"label-placement":c.prop.oneOf([`inset`,`outside`],`inset`),loading:c.prop.bool(!1),multiple:c.prop.bool(!1),name:c.prop.string(),"no-filter":c.prop.bool(!1),options:c.prop.data(),placeholder:c.prop.string(`Select...`),rounded:c.prop.string(),size:c.prop.string(),value:c.prop.string(),variant:c.prop.string()},setup(e,{bind:s,el:u,emit:d,onCleanup:f,onElement:ee,watch:p}){let te=(0,c.inject)(a.FORM_CTX),m=a.useFormContext(s,e,te),h=(0,l.signal)(``),g=null,_=null,v=null,y=null,b=(0,c.ref)(),x=t.lifecycleSignal(f),S=null,C=n.createChoiceField({disabled:m.disabled,error:e.error,getFormField:()=>S,helper:e.helper,label:e.label,labelPlacement:e[`label-placement`],multiple:e.multiple,prefix:`combobox`,signal:x,validateOn:te?.validateOn,value:e.value}),w=(0,l.signal)([]),T=i.createOptionList({getBoundary:()=>u,getFocusedOptionElement:()=>v?.querySelector(`[data-focused]`)??null,getItems:()=>w.value,getOptionId:e=>`${C.fieldId}-opt-${e}`,getPanel:()=>v,getReference:()=>_,getTrigger:()=>g,isDisabled:()=>C.disabled.value,onClose:e=>{d(`close`,{reason:e}),x.aborted||pe(),C.triggerValidation(`blur`)},onOpen:e=>d(`open`,{reason:e}),restoreFocus:!1,signal:x}),{disabled:E,fieldId:D,selectedValues:O,triggerValidation:k}=C;S=(0,c.useField)({disabled:C.disabled,toFormValue:e=>e,value:C.formValue});let{focusedIndex:A,isOpen:j,scrollFocusedIntoView:ne,updatePosition:re}=T,M=()=>!!e.multiple.value,ie=()=>!!e.creatable.value,ae=()=>!!e[`no-filter`].value;s({attr:{open:()=>j.value?!0:void 0,size:m.size,variant:m.variant}});let N=null,P=!1,F=(0,l.computed)(()=>O.value[0]??``);Object.defineProperty(u,"value",{configurable:!0,get:()=>M()?O.value:F.value,set:e=>{let t=e;if(Array.isArray(t)){C.setValues(t.map(e=>String(e??``)));return}if(t==null||t===``){C.clear();return}C.setValues([String(t)])}});let oe=()=>O.value.length>0;function I(){g?.focus()}let L=(0,l.signal)([]),R=(0,l.signal)([]),se=()=>!!e.loading.value;function ce(e){return{disabled:!!e.disabled,iconEl:e.iconEl??null,label:e.label??e.value,value:e.value}}let z=(0,l.computed)(()=>{let t=e.options.value,n=Array.isArray(t)?t.map(ce):L.value;return R.value.length===0?n:[...n,...R.value]}),B={clear:()=>{C.clear()},remove:e=>{C.removeValue(e)},select:e=>{C.selectValue(e)},toggle:e=>{C.toggleValue(e)}};function V(e=Array.from(u.children)){if(L.value=o.parseSlottedOptions(e),!M()){let e=z.value.find(e=>e.value===F.value);h.value=e?.label??F.value}}V(),p(()=>{let e=o.filterOptions(z.value,h.value,ae());w.value=M()?e.filter(e=>!O.value.includes(e.value)):e});let H=(0,l.computed)(()=>o.getCreatableLabel(h.value,ie(),w.value)),le=()=>M()&&O.value.length>0?``:e.placeholder.value||``,ue=(0,l.computed)(()=>O.value),de=(0,l.computed)(()=>O.value.map(e=>z.value.find(t=>t.value===e)?.label??e));function U(e){d(`change`,{labels:de.value,originalEvent:e,values:ue.value})}function fe(e){e.stopPropagation();let t=e.detail?.value;t!==void 0&&(B.remove(t),U(e),k(`change`))}function pe(){if(!M()){let e=z.value.find(e=>e.value===F.value);P=!0,h.value=e?.label??``,Promise.resolve().then(()=>{P=!1});return}h.value=``}p(()=>{if(j.value&&!M()&&F.value&&A.value===-1&&h.value===``){let e=w.value.findIndex(e=>e.value===F.value);e>=0&&T.set(e)}});function W(e=!0,t=`programmatic`){if(e&&(N=h.value,h.value=``),!M()&&F.value){let e=o.filterOptions(z.value,``,ae()).findIndex(e=>e.value===F.value);e>=0&&T.set(e)}T.open(t),!M()&&F.value&&A.value>=0&&requestAnimationFrame(()=>{ne()})}function G(e=`programmatic`){T.close(e)}let me=r.createInteraction({disabled:E,onPress:()=>{j.value||W(!0,`click`),I()}}),he=r.createInteraction({disabled:E,keys:[`Enter`],onPress:e=>{let t=w.value;j.value&&A.value>=0&&A.value<t.length?K(t[A.value],e):j.value&&A.value===-1&&H.value?X(h.value,e):j.value||W(!0,`keyboard`)}});function K(t,n){t.disabled||(M()?(B.toggle(t.value),h.value=``,U(n),k(`change`),e.autoclose.value&&G(),I(),requestAnimationFrame(()=>I())):(B.select(t.value),h.value=t.label,U(n),k(`change`),G(),I()))}function q(e){let t=e.getAttribute(`data-option-index`),n=t?Number(t):-1;if(Number.isInteger(n)&&n>=0&&n<w.value.length)return w.value[n]??null;let r=e.getAttribute(`data-option-value`);if(r){let e=w.value.find(e=>e.value===r);if(e)return e}let i=e.querySelector(`span`)?.textContent?.trim()??e.textContent?.trim()??``;return i?w.value.find(e=>e.label===i||e.value===i)??null:null}function ge(e){e.stopPropagation(),B.clear(),h.value=``,U(e),k(`change`),I()}function J(e){let t=e.target,n=t.value;if(!P&&n!==h.value){if(h.value=n,!M()){let e=O.value[0],t=e?z.value.find(t=>t.value===e)?.label??e:``;n===``&&N===t&&(N=null)}T.navigate(`first`),j.value||W(!1,`keyboard`),d(`search`,{query:t.value})}}function Y(){}function _e(e){if(!E.value&&!T.handleKeydown(e))switch(e.key){case`ArrowDown`:e.preventDefault(),j.value?T.navigate(`next`):(W(!0,`keyboard`),T.navigate(`first`));break;case`ArrowUp`:e.preventDefault(),j.value?T.navigate(`prev`):W(!0,`keyboard`);break;case`Backspace`:M()&&!h.value&&O.value.length>0&&(C.removeValue(O.value[O.value.length-1]??``),U(e),k(`change`));break;case`Enter`:he.handleKeydown(e);break;case`Tab`:G(`programmatic`);break;default:break}}function X(e,t){let n=e.trim();if(!n)return;let r={disabled:!1,iconEl:null,label:n,value:o.makeCreatableValue(n)};R.value=[...R.value,r],K(r,t)}let ve=(()=>{let e=new MutationObserver(()=>{V()});return e.observe(u,{attributeFilter:[`disabled`,`label`,`value`],attributes:!0,childList:!0,subtree:!0}),()=>e.disconnect()})(),ye=e=>{let t=e.target;if(!(t instanceof Element))return;let n=t.closest(`.option`);if(!n)return;let r=q(n);if(!r||r.disabled)return;let i=w.value.findIndex(e=>e.value===r.value);i>=0&&T.set(i)},Z=u.shadowRoot;Z&&Z.addEventListener(`pointermove`,ye);let be=e=>{let t=e=>{let t=e.target;if(!(t instanceof Element))return;if(t.closest(`.no-results-create`)){e.preventDefault(),e.stopPropagation(),X(h.value,e);return}let n=t.closest(`.option`);if(!n)return;e.preventDefault(),e.stopPropagation();let r=q(n);r&&K(r,e)},n=e=>{let t=e.target;if(!(t instanceof Element))return;let n=t.closest(`.option`);if(!n)return;let r=q(n);if(!r)return;let i=w.value.findIndex(e=>e.value===r.value);i>=0&&T.set(i)};return e.addEventListener(`click`,t),e.addEventListener(`pointermove`,n),()=>{e.removeEventListener(`click`,t),e.removeEventListener(`pointermove`,n)}},Q=null,$=null,xe=e=>{y=e,$!==e&&(Q?.(),Q=null,$=null,e&&(Q=be(e),$=e))},Se=()=>{y&&($===y&&Q||(Q?.(),Q=be(y),$=y))};return p(()=>{Se(),j.value?(v&&`showPopover`in v&&!v.matches(`:popover-open`)&&v.showPopover(),re()):v&&`hidePopover`in v&&v.matches(`:popover-open`)&&v.hidePopover()}),ee(b,e=>{_=e;let t=e.shadowRoot?.querySelector(`input`)??null;if(!t)return;g=t,t.setAttribute(`role`,`combobox`),t.setAttribute(`autocomplete`,`off`),t.setAttribute(`aria-autocomplete`,`list`),t.setAttribute(`aria-haspopup`,`listbox`),t.setAttribute(`spellcheck`,`false`),t.setAttribute(`aria-controls`,`${D}-listbox`);let n=()=>{j.value||W(!0,`click`),I()};return t.addEventListener(`input`,J),t.addEventListener(`keydown`,_e),t.addEventListener(`focus`,Y),t.addEventListener(`click`,n),()=>{g=null,_=null,t.removeEventListener(`input`,J),t.removeEventListener(`keydown`,_e),t.removeEventListener(`focus`,Y),t.removeEventListener(`click`,n)}}),p(()=>{if(!b.value)return;let t=g;t&&(t.setAttribute(`aria-expanded`,String(j.value)),E.value?t.setAttribute(`aria-disabled`,`true`):t.removeAttribute(`aria-disabled`),e.error.value?(t.setAttribute(`aria-invalid`,`true`),t.setAttribute(`aria-errormessage`,`${D}-error`)):(t.removeAttribute(`aria-invalid`),t.removeAttribute(`aria-errormessage`)))}),p(()=>{if(!b.value)return;let e=g;e&&e.value!==h.value&&(e.value=h.value)}),f(()=>{Z?.removeEventListener(`pointermove`,ye),Q?.(),Q=null,$=null,ve()}),c.html`
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/accessibility.css.cjs"),t=require("./headless/ore.cjs"),n=require("./headless/choice-field.cjs"),r=require("./headless/keyboard.cjs"),i=require("./headless/option-list.cjs"),ee=require("./ore/dist/forms/field.cjs");require("./ore/dist/forms.cjs");const a=require("./inputs/shared/form-context.cjs"),o=require("./inputs/combobox/combobox-options.cjs"),s=require("./inputs/combobox/combobox.css.cjs");let c=require("@vielzeug/ore"),l=require("@vielzeug/ripple");var u=`ore-combobox`;(0,c.define)(u,{formAssociated:!0,props:{autoclose:c.prop.bool(!1),color:c.prop.string(),creatable:c.prop.bool(!1),disabled:c.prop.bool(!1),error:c.prop.string(),fullwidth:c.prop.bool(!1),helper:c.prop.string(),label:c.prop.string(),"label-placement":c.prop.oneOf([`inset`,`outside`],`inset`),loading:c.prop.bool(!1),multiple:c.prop.bool(!1),name:c.prop.string(),"no-filter":c.prop.bool(!1),options:c.prop.data(),placeholder:c.prop.string(`Select...`),rounded:c.prop.string(),size:c.prop.string(),value:c.prop.string(),variant:c.prop.string()},setup(e){let s=(0,c.getHost)(),u=(0,c.useEmit)(),d=c.watchEffect,f=(0,c.inject)(a.FORM_CTX),p=a.useFormContext(e,f),m=(0,l.signal)(``),h=null,g=null,_=null,v=null,y=(0,c.ref)(),b=t.lifecycleSignal(c.onCleanup),x=null,S=n.createChoiceField({disabled:p.disabled,error:e.error,getFormField:()=>x,helper:e.helper,label:e.label,labelPlacement:e[`label-placement`],multiple:e.multiple,prefix:`combobox`,signal:b,validateOn:f?.validateOn,value:e.value}),C=(0,l.signal)([]),w=i.createOptionList({getBoundary:()=>s,getFocusedOptionElement:()=>_?.querySelector(`[data-focused]`)??null,getItems:()=>C.value,getOptionId:e=>`${S.fieldId}-opt-${e}`,getPanel:()=>_,getReference:()=>g,getTrigger:()=>h,isDisabled:()=>S.disabled.value,onClose:e=>{u(`close`,{reason:e}),b.aborted||de(),S.triggerValidation(`blur`)},onOpen:e=>u(`open`,{reason:e}),restoreFocus:!1,signal:b}),{disabled:T,fieldId:E,selectedValues:D,triggerValidation:O}=S;x=ee.useField({disabled:S.disabled,toFormValue:e=>e,value:S.formValue});let{focusedIndex:k,isOpen:A,scrollFocusedIntoView:te,updatePosition:ne}=w,j=()=>!!e.multiple.value,re=()=>!!e.creatable.value,M=()=>!!e[`no-filter`].value;(0,c.bind)({attr:{open:()=>A.value?!0:void 0,size:p.size,variant:p.variant}});let N=null,P=!1,F=(0,l.computed)(()=>D.value[0]??``);Object.defineProperty(s,"value",{configurable:!0,get:()=>j()?D.value:F.value,set:e=>{let t=e;if(Array.isArray(t)){S.setValues(t.map(e=>String(e??``)));return}if(t==null||t===``){S.clear();return}S.setValues([String(t)])}});let ie=()=>D.value.length>0;function I(){h?.focus()}let L=(0,l.signal)([]),R=(0,l.signal)([]),ae=()=>!!e.loading.value;function oe(e){return{disabled:!!e.disabled,iconEl:e.iconEl??null,label:e.label??e.value,value:e.value}}let z=(0,l.computed)(()=>{let t=e.options.value,n=Array.isArray(t)?t.map(oe):L.value;return R.value.length===0?n:[...n,...R.value]}),B={clear:()=>{S.clear()},remove:e=>{S.removeValue(e)},select:e=>{S.selectValue(e)},toggle:e=>{S.toggleValue(e)}};function V(e=Array.from(s.children)){if(L.value=o.parseSlottedOptions(e),!j()){let e=z.value.find(e=>e.value===F.value);m.value=e?.label??F.value}}V(),d(()=>{let e=o.filterOptions(z.value,m.value,M());C.value=j()?e.filter(e=>!D.value.includes(e.value)):e});let H=(0,l.computed)(()=>o.getCreatableLabel(m.value,re(),C.value)),se=()=>j()&&D.value.length>0?``:e.placeholder.value||``,ce=(0,l.computed)(()=>D.value),le=(0,l.computed)(()=>D.value.map(e=>z.value.find(t=>t.value===e)?.label??e));function U(e){u(`change`,{labels:le.value,originalEvent:e,values:ce.value})}function ue(e){e.stopPropagation();let t=e.detail?.value;t!==void 0&&(B.remove(t),U(e),O(`change`))}function de(){if(!j()){let e=z.value.find(e=>e.value===F.value);P=!0,m.value=e?.label??``,Promise.resolve().then(()=>{P=!1});return}m.value=``}d(()=>{if(A.value&&!j()&&F.value&&k.value===-1&&m.value===``){let e=C.value.findIndex(e=>e.value===F.value);e>=0&&w.set(e)}});function W(e=!0,t=`programmatic`){if(e&&(N=m.value,m.value=``),!j()&&F.value){let e=o.filterOptions(z.value,``,M()).findIndex(e=>e.value===F.value);e>=0&&w.set(e)}w.open(t),!j()&&F.value&&k.value>=0&&requestAnimationFrame(()=>{te()})}function G(e=`programmatic`){w.close(e)}let fe=r.createInteraction({disabled:T,onPress:()=>{A.value||W(!0,`click`),I()}}),pe=r.createInteraction({disabled:T,keys:[`Enter`],onPress:e=>{let t=C.value;A.value&&k.value>=0&&k.value<t.length?K(t[k.value],e):A.value&&k.value===-1&&H.value?he(m.value,e):A.value||W(!0,`keyboard`)}});function K(t,n){t.disabled||(j()?(B.toggle(t.value),m.value=``,U(n),O(`change`),e.autoclose.value&&G(),I(),requestAnimationFrame(()=>I())):(B.select(t.value),m.value=t.label,U(n),O(`change`),G(),I()))}function q(e){let t=e.getAttribute(`data-option-index`),n=t?Number(t):-1;if(Number.isInteger(n)&&n>=0&&n<C.value.length)return C.value[n]??null;let r=e.getAttribute(`data-option-value`);if(r){let e=C.value.find(e=>e.value===r);if(e)return e}let i=e.querySelector(`span`)?.textContent?.trim()??e.textContent?.trim()??``;return i?C.value.find(e=>e.label===i||e.value===i)??null:null}function me(e){e.stopPropagation(),B.clear(),m.value=``,U(e),O(`change`),I()}function J(e){let t=e.target,n=t.value;if(!P&&n!==m.value){if(m.value=n,!j()){let e=D.value[0],t=e?z.value.find(t=>t.value===e)?.label??e:``;n===``&&N===t&&(N=null)}w.navigate(`first`),A.value||W(!1,`keyboard`),u(`search`,{query:t.value})}}function Y(){}function X(e){if(!T.value&&!w.handleKeydown(e))switch(e.key){case`ArrowDown`:e.preventDefault(),A.value?w.navigate(`next`):(W(!0,`keyboard`),w.navigate(`first`));break;case`ArrowUp`:e.preventDefault(),A.value?w.navigate(`prev`):W(!0,`keyboard`);break;case`Backspace`:j()&&!m.value&&D.value.length>0&&(S.removeValue(D.value[D.value.length-1]??``),U(e),O(`change`));break;case`Enter`:pe.handleKeydown(e);break;case`Tab`:G(`programmatic`);break;default:break}}function he(e,t){let n=e.trim();if(!n)return;let r={disabled:!1,iconEl:null,label:n,value:o.makeCreatableValue(n)};R.value=[...R.value,r],K(r,t)}let ge=(()=>{let e=new MutationObserver(()=>{V()});return e.observe(s,{attributeFilter:[`disabled`,`label`,`value`],attributes:!0,childList:!0,subtree:!0}),()=>e.disconnect()})(),_e=e=>{let t=e.target;if(!(t instanceof Element))return;let n=t.closest(`.option`);if(!n)return;let r=q(n);if(!r||r.disabled)return;let i=C.value.findIndex(e=>e.value===r.value);i>=0&&w.set(i)},Z=s.shadowRoot;Z&&Z.addEventListener(`pointermove`,_e);let ve=e=>{let t=e=>{let t=e.target;if(!(t instanceof Element))return;if(t.closest(`.no-results-create`)){e.preventDefault(),e.stopPropagation(),he(m.value,e);return}let n=t.closest(`.option`);if(!n)return;e.preventDefault(),e.stopPropagation();let r=q(n);r&&K(r,e)},n=e=>{let t=e.target;if(!(t instanceof Element))return;let n=t.closest(`.option`);if(!n)return;let r=q(n);if(!r)return;let i=C.value.findIndex(e=>e.value===r.value);i>=0&&w.set(i)};return e.addEventListener(`click`,t),e.addEventListener(`pointermove`,n),()=>{e.removeEventListener(`click`,t),e.removeEventListener(`pointermove`,n)}},Q=null,$=null,ye=e=>{v=e,$!==e&&(Q?.(),Q=null,$=null,e&&(Q=ve(e),$=e))},be=()=>{v&&($===v&&Q||(Q?.(),Q=ve(v),$=v))};return d(()=>{be(),A.value?(_&&`showPopover`in _&&!_.matches(`:popover-open`)&&_.showPopover(),ne()):_&&`hidePopover`in _&&_.matches(`:popover-open`)&&_.hidePopover()}),(0,c.onElement)(y,e=>{g=e;let t=e.shadowRoot?.querySelector(`input`)??null;if(!t)return;h=t,t.setAttribute(`role`,`combobox`),t.setAttribute(`autocomplete`,`off`),t.setAttribute(`aria-autocomplete`,`list`),t.setAttribute(`aria-haspopup`,`listbox`),t.setAttribute(`spellcheck`,`false`),t.setAttribute(`aria-controls`,`${E}-listbox`);let n=()=>{A.value||W(!0,`click`),I()};return t.addEventListener(`input`,J),t.addEventListener(`keydown`,X),t.addEventListener(`focus`,Y),t.addEventListener(`click`,n),()=>{h=null,g=null,t.removeEventListener(`input`,J),t.removeEventListener(`keydown`,X),t.removeEventListener(`focus`,Y),t.removeEventListener(`click`,n)}}),d(()=>{if(!y.value)return;let t=h;t&&(t.setAttribute(`aria-expanded`,String(A.value)),T.value?t.setAttribute(`aria-disabled`,`true`):t.removeAttribute(`aria-disabled`),e.error.value?(t.setAttribute(`aria-invalid`,`true`),t.setAttribute(`aria-errormessage`,`${E}-error`)):(t.removeAttribute(`aria-invalid`),t.removeAttribute(`aria-errormessage`)))}),d(()=>{if(!y.value)return;let e=h;e&&e.value!==m.value&&(e.value=m.value)}),(0,c.onCleanup)(()=>{Z?.removeEventListener(`pointermove`,_e),Q?.(),Q=null,$=null,ge()}),c.html`
       <slot></slot>
       <ore-input
         class="trigger"
-        ref=${b}
+        ref=${y}
         :label="${()=>e.label.value??``}"
-        :placeholder="${le}"
+        :placeholder="${se}"
         :label-placement="${()=>e[`label-placement`].value??`inset`}"
         :color="${()=>e.color?.value??void 0}"
-        :size="${()=>m.size?.value??void 0}"
-        :variant="${()=>m.variant?.value??void 0}"
+        :size="${()=>p.size?.value??void 0}"
+        :variant="${()=>p.variant?.value??void 0}"
         :rounded="${()=>e.rounded?.value??void 0}"
         :helper="${()=>e.helper.value??``}"
         :error="${()=>e.error.value??``}"
-        ?disabled="${E}"
+        ?disabled="${T}"
         ?required="${()=>!1}"
         ?fullwidth="${()=>e.fullwidth.value?!0:void 0}"
         :name="${()=>e.name.value??``}"
-        @click="${e=>{me.handleClick(e)}}"
+        @click="${e=>{fe.handleClick(e)}}"
         part="wrapper">
         <div slot="prefix" class="chips-row">
           <!-- Keep chip list diffing isolated so input node identity stays stable. -->
           <span class="chips-list">
-            ${()=>(M()?O.value:[]).map(t=>c.html`
+            ${()=>(j()?D.value:[]).map(t=>c.html`
                   <ore-chip
                     value=${t}
                     label=${z.value.find(e=>e.value===t)?.label??t}
@@ -29,7 +29,7 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
                     variant="flat"
                     size="sm"
                     color="${e.color}"
-                    @remove=${fe}>
+                    @remove=${ue}>
                     ${z.value.find(e=>e.value===t)?.label??t}
                   </ore-chip>
                 `)}
@@ -42,8 +42,8 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
             type="button"
             aria-label="Clear"
             tabindex="-1"
-            ?hidden=${()=>!oe()}
-            @click="${ge}">
+            ?hidden=${()=>!ie()}
+            @click="${me}">
             <ore-icon name="x" size="12" stroke-width="2.5" aria-hidden="true"></ore-icon>
           </button>
           <span class="combobox-suffix-end">
@@ -56,7 +56,7 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
       </ore-input>
       <span
         class="sr-only"
-        id="${()=>`${D}-error`}"
+        id="${()=>`${E}-error`}"
         role="alert"
         aria-live="assertive"
         ?hidden="${()=>!e.error.value}"
@@ -65,32 +65,32 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
       <div
         class="dropdown"
         part="dropdown"
-        id="${()=>`${D}-dropdown`}"
+        id="${()=>`${E}-dropdown`}"
         popover="manual"
-        ?data-open=${()=>j.value}
-        ref=${e=>{v=e}}>
+        ?data-open=${()=>A.value}
+        ref=${e=>{_=e}}>
         <div
           role="listbox"
-          id="${()=>`${D}-listbox`}"
-          :style="${()=>j.value&&w.value.length>0?`height:${w.value.length*36}px;`:``}"
+          id="${()=>`${E}-listbox`}"
+          :style="${()=>A.value&&C.value.length>0?`height:${C.value.length*36}px;`:``}"
           aria-label="${()=>e.label.value||e.placeholder.value||`Options`}"
-          ref=${e=>{xe(e)}}>
-          ${()=>j.value?se()?c.html`<div class="dropdown-loading">Loading...</div>`:w.value.length===0?H.value?c.html`<button
+          ref=${e=>{ye(e)}}>
+          ${()=>A.value?ae()?c.html`<div class="dropdown-loading">Loading...</div>`:C.value.length===0?H.value?c.html`<button
                   type="button"
                   class="no-results-create"
-                  ?data-focused=${()=>A.value===-1}>
+                  ?data-focused=${()=>k.value===-1}>
                   ${H.value}
-                </button>`:c.html`<div class="no-results" role="presentation">No results found</div>`:w.value.map((e,t)=>c.html`<div
+                </button>`:c.html`<div class="no-results" role="presentation">No results found</div>`:C.value.map((e,t)=>c.html`<div
                 class="option"
                 role="option"
-                id="${`${D}-opt-${t}`}"
+                id="${`${E}-opt-${t}`}"
                 data-option-index="${t}"
                 data-option-value="${e.value}"
-                :aria-selected="${()=>String(M()?O.value.includes(e.value):F.value===e.value)}"
+                :aria-selected="${()=>String(j()?D.value.includes(e.value):F.value===e.value)}"
                 aria-disabled="${String(e.disabled)}"
                 style="${`position:absolute;top:0;left:0;right:0;transform:translateY(${t*36}px);`}"
-                ?data-focused=${()=>A.value===t}
-                ?data-selected=${()=>M()?O.value.includes(e.value):F.value===e.value}
+                ?data-focused=${()=>k.value===t}
+                ?data-selected=${()=>j()?D.value.includes(e.value):F.value===e.value}
                 ?data-disabled=${e.disabled}>
                 <span>${e.label}</span>
                 <span class="option-check" aria-hidden="true"

package/dist/combobox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.cjs","names":[],"sources":["../src/inputs/combobox/combobox.ts"],"sourcesContent":["import { define, useField, html, inject, prop, ref } from '@vielzeug/ore';\nimport { computed, signal } from '@vielzeug/ripple';\n\nimport type { AddEventListeners, ComponentSize, RoundedSize, ThemeColor } from '../../types';\nimport type { OreComboboxEvents, OreComboboxProps, ComboboxOptionInput, ComboboxOptionItem } from './combobox.types';\n\nimport {\n  lifecycleSignal,\n  createChoiceField,\n  createInteraction,\n  createOptionList,\n  type DialogCloseReason,\n  type OverlayOpenReason,\n} from '../../headless';\nimport { reducedMotionMixin, srOnlyMixin } from '../../styles';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport { filterOptions, getCreatableLabel, makeCreatableValue, parseSlottedOptions } from './combobox-options';\nimport '../../feedback/chip/chip';\nimport '../input/input';\nimport componentStyles from './combobox.css?inline';\n\nexport type { OreComboboxEvents, OreComboboxProps } from './combobox.types';\n\n/**\n * A searchable select field with multiple selection, custom option creation, and large-list support.\n *\n * @element ore-combobox\n *\n * @attr {string} value - Selected value(s). Use comma-separated for multiple.\n * @attr {boolean} multiple - Enable multiple selection\n * @attr {boolean} creatable - Allow users to create custom options from search query\n * @attr {boolean} no-filter - Disable client-side filtering (useful for server-side search)\n * @attr {string} placeholder - Placeholder text\n *\n * @fires {CustomEvent} change - Emitted when selection changes. detail: { value: string | string[], values: string[], labels: string[] }\n * @fires {CustomEvent} search - Emitted when user types. detail: { query: string }\n *\n * @slot - Slotted combobox options and option groups\n * @cssprop --combobox-dropdown-bg - Dropdown panel background color\n * @cssprop --combobox-dropdown-border-color - Dropdown panel border color\n * @cssprop --combobox-option-hover-bg - Option background on hover\n * @cssprop --combobox-option-focus-bg - Option background when keyboard-focused\n * @cssprop --combobox-option-selected-bg - Option background when selected\n * @cssprop --combobox-option-selected-focus-bg - Option background when selected and focused\n * @cssprop --input-bg - Field background (passed through to ore-input)\n * @cssprop --input-border-color - Field border color (passed through to ore-input)\n *\n * @part wrapper - Root wrapper around the entire field\n * @part label - Label element shown inside or outside the field\n * @part field - Field container that holds the trigger input and clear button\n * @part input - Search input used to filter and select options\n * @part clear-btn - Button that clears the current selection/query\n * @part dropdown - Popup list container for options\n * @part helper-text - Helper text displayed below the field\n * @example\n * ```html\n * <ore-combobox label=\"Country\" name=\"country\">\n *   <ore-combobox-option value=\"us\">United States</ore-combobox-option>\n *   <ore-combobox-option value=\"gb\">United Kingdom</ore-combobox-option>\n *   <ore-combobox-option value=\"de\" disabled>Germany</ore-combobox-option>\n * </ore-combobox>\n * ```\n */\nexport const COMBOBOX_TAG = 'ore-combobox' as const;\ndefine<OreComboboxProps, OreComboboxEvents>(COMBOBOX_TAG, {\n  formAssociated: true,\n  props: {\n    autoclose: prop.bool(false),\n    color: prop.string<ThemeColor>(),\n    creatable: prop.bool(false),\n    disabled: prop.bool(false),\n    error: prop.string(),\n    fullwidth: prop.bool(false),\n    helper: prop.string(),\n    label: prop.string(),\n    'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n    loading: prop.bool(false),\n    multiple: prop.bool(false),\n    name: prop.string(),\n    'no-filter': prop.bool(false),\n    options: prop.data<ComboboxOptionInput[]>(),\n    placeholder: prop.string('Select...'),\n    rounded: prop.string<RoundedSize>(),\n    size: prop.string<ComponentSize>(),\n    value: prop.string(),\n    variant: prop.string<'flat' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n  },\n  setup(props, { bind, el, emit, onCleanup, onElement, watch }) {\n    const formCtx = inject(FORM_CTX);\n    const fCtxProps = useFormContext(bind, props, formCtx);\n    const query = signal('');\n\n    // Element refs needed by the composite option-list factory.\n    let inputEl: HTMLInputElement | null = null;\n    let fieldEl: HTMLElement | null = null; // set to the ore-input host once it mounts\n    let dropdownEl: HTMLElement | null = null;\n    let listboxEl: HTMLElement | null = null;\n\n    // Ref to the ore-input host; resolved when the template renders.\n    const bitInputRef = ref<HTMLElement>();\n\n    const abortSignal = lifecycleSignal(onCleanup);\n    let _formField: { reportValidity(): void } | null = null;\n    const choice = createChoiceField({\n      disabled: fCtxProps.disabled,\n      error: props.error,\n      getFormField: () => _formField,\n      helper: props.helper,\n      label: props.label,\n      labelPlacement: props['label-placement'],\n      multiple: props.multiple,\n      prefix: 'combobox',\n      signal: abortSignal,\n      validateOn: formCtx?.validateOn,\n      value: props.value,\n    });\n\n    // filteredOptions signal declared before optionList so the getItems getter\n    // captures the live signal reference rather than needing a factory indirection.\n    const filteredOptions = signal<ComboboxOptionItem[]>([]);\n\n    const optionList = createOptionList<ComboboxOptionItem>({\n      getBoundary: () => el,\n      getFocusedOptionElement: () => dropdownEl?.querySelector<HTMLElement>('[data-focused]') ?? null,\n      getItems: () => filteredOptions.value,\n      getOptionId: (index) => `${choice.fieldId}-opt-${index}`,\n      getPanel: () => dropdownEl,\n      getReference: () => fieldEl,\n      getTrigger: () => inputEl,\n      isDisabled: () => choice.disabled.value,\n      onClose: (reason) => {\n        emit('close', { reason });\n\n        if (!abortSignal.aborted) restoreQueryFromSelection();\n\n        choice.triggerValidation('blur');\n      },\n      onOpen: (reason) => emit('open', { reason }),\n      restoreFocus: false,\n      signal: abortSignal,\n    });\n\n    const { disabled: isDisabled, fieldId: comboId, selectedValues, triggerValidation } = choice;\n\n    _formField = useField<string>({ disabled: choice.disabled, toFormValue: (v) => v, value: choice.formValue });\n\n    const { focusedIndex, isOpen, scrollFocusedIntoView, updatePosition } = optionList;\n    // ── State ────────────────────────────────────────────────────────────────\n    const isMultiple = () => Boolean(props.multiple.value);\n    const isCreatable = () => Boolean(props.creatable.value);\n    const isNoFilter = () => Boolean(props['no-filter'].value);\n\n    bind({\n      attr: {\n        open: () => (isOpen.value ? true : undefined),\n        size: fCtxProps.size,\n        variant: fCtxProps.variant,\n      },\n    });\n\n    let lastQueryBeforeClear: string | null = null;\n    let isRestoringQuery = false;\n\n    // Convenience getter for single-select\n    const selectedValue = computed(() => selectedValues.value[0] ?? '');\n\n    // Expose .value as a JS property accessor on the host element\n    Object.defineProperty(el, 'value', {\n      configurable: true,\n      get: () => (isMultiple() ? selectedValues.value : selectedValue.value),\n      set: (val: unknown) => {\n        const v = val as string | string[] | null | undefined;\n\n        if (Array.isArray(v)) {\n          choice.setValues(v.map((entry) => String(entry ?? '')));\n\n          return;\n        }\n\n        if (v == null || v === '') {\n          choice.clear();\n\n          return;\n        }\n\n        choice.setValues([String(v)]);\n      },\n    });\n\n    const hasValue = () => selectedValues.value.length > 0;\n\n    function focusLiveInput() {\n      inputEl?.focus();\n    }\n\n    // ── Options ──────────────────────────────────────────────────────────────\n    const slottedOptions = signal<ComboboxOptionItem[]>([]);\n    const createdOptions = signal<ComboboxOptionItem[]>([]);\n    const isLoading = () => Boolean(props.loading.value);\n\n    function normalizeOption(option: ComboboxOptionInput): ComboboxOptionItem {\n      return {\n        disabled: Boolean(option.disabled),\n        iconEl: option.iconEl ?? null,\n        label: option.label ?? option.value,\n        value: option.value,\n      };\n    }\n\n    // Merged options: explicit prop value overrides slotted options.\n    const allOptions = computed<ComboboxOptionItem[]>(() => {\n      const optionsProp = props.options.value;\n      const base = Array.isArray(optionsProp) ? optionsProp.map(normalizeOption) : slottedOptions.value;\n\n      if (createdOptions.value.length === 0) return base;\n\n      return [...base, ...createdOptions.value];\n    });\n\n    const selectionController = {\n      clear: () => {\n        choice.clear();\n      },\n      remove: (key: string) => {\n        choice.removeValue(key);\n      },\n      select: (key: string) => {\n        choice.selectValue(key);\n      },\n      toggle: (key: string) => {\n        choice.toggleValue(key);\n      },\n    };\n\n    function readOptions(elements: Element[] = Array.from(el.children)) {\n      slottedOptions.value = parseSlottedOptions(elements);\n\n      if (!isMultiple()) {\n        const match = allOptions.value.find((option) => option.value === selectedValue.value);\n\n        query.value = match?.label ?? selectedValue.value;\n      }\n    }\n\n    // Initialize from light DOM immediately; onMounted/observer keep this in sync afterwards.\n    readOptions();\n\n    watch(() => {\n      const nextOptions = filterOptions(allOptions.value, query.value, isNoFilter());\n\n      filteredOptions.value = isMultiple()\n        ? nextOptions.filter((option) => !selectedValues.value.includes(option.value))\n        : nextOptions;\n    });\n\n    // \"Create\" option shown when creatable + query doesn't match any existing option\n    const creatableLabel = computed(() => {\n      return getCreatableLabel(query.value, isCreatable(), filteredOptions.value);\n    });\n    const inputPlaceholder = () =>\n      isMultiple() && selectedValues.value.length > 0 ? '' : props.placeholder.value || '';\n\n    const selectedValueItems = computed(() => selectedValues.value);\n    const selectedLabelItems = computed(() =>\n      selectedValues.value.map((value) => allOptions.value.find((option) => option.value === value)?.label ?? value),\n    );\n\n    function emitChange(originalEvent?: Event) {\n      emit('change', { labels: selectedLabelItems.value, originalEvent, values: selectedValueItems.value });\n    }\n\n    function removeChip(event: Event): void {\n      event.stopPropagation();\n\n      const value = (event as CustomEvent<{ value?: string }>).detail?.value;\n\n      if (value === undefined) return;\n\n      selectionController.remove(value);\n      emitChange(event);\n      triggerValidation('change');\n    }\n\n    function restoreQueryFromSelection() {\n      // Keep input text and selected value in sync whenever the popup closes.\n      if (!isMultiple()) {\n        const match = allOptions.value.find((option) => option.value === selectedValue.value);\n\n        isRestoringQuery = true;\n        query.value = match?.label ?? '';\n        Promise.resolve().then(() => {\n          isRestoringQuery = false;\n        });\n\n        return;\n      }\n\n      query.value = '';\n    }\n\n    watch(() => {\n      if (isOpen.value && !isMultiple() && selectedValue.value && focusedIndex.value === -1 && query.value === '') {\n        const selectedIndex = filteredOptions.value.findIndex((option) => option.value === selectedValue.value);\n\n        if (selectedIndex >= 0) {\n          optionList.set(selectedIndex);\n        }\n      }\n    });\n\n    // ── Open / Close ─────────────────────────────────────────────────────────\n    function openPopup(clearFilter = true, reason: OverlayOpenReason = 'programmatic') {\n      if (clearFilter) {\n        lastQueryBeforeClear = query.value;\n        query.value = '';\n      }\n\n      // Pre-compute focused index BEFORE opening so the first render has it set\n      if (!isMultiple() && selectedValue.value) {\n        const freshOptions = filterOptions(allOptions.value, '', isNoFilter());\n        const selectedIndex = freshOptions.findIndex((option) => option.value === selectedValue.value);\n\n        if (selectedIndex >= 0) {\n          optionList.set(selectedIndex);\n        }\n      }\n\n      optionList.open(reason);\n\n      if (!isMultiple() && selectedValue.value && focusedIndex.value >= 0) {\n        requestAnimationFrame(() => {\n          scrollFocusedIntoView();\n        });\n      }\n    }\n\n    function closePopup(reason: DialogCloseReason = 'programmatic') {\n      optionList.close(reason);\n    }\n\n    const fieldPress = createInteraction({\n      disabled: isDisabled,\n      onPress: () => {\n        if (!isOpen.value) openPopup(true, 'click');\n\n        focusLiveInput();\n      },\n    });\n\n    const enterPress = createInteraction({\n      disabled: isDisabled,\n      keys: ['Enter'],\n      onPress: (originalEvent: Event) => {\n        const opts = filteredOptions.value;\n\n        if (isOpen.value && focusedIndex.value >= 0 && focusedIndex.value < opts.length) {\n          selectOption(opts[focusedIndex.value], originalEvent);\n        } else if (isOpen.value && focusedIndex.value === -1 && creatableLabel.value) {\n          // Focused on the \"create\" item\n          createOption(query.value, originalEvent);\n        } else if (!isOpen.value) {\n          openPopup(true, 'keyboard');\n        }\n      },\n    });\n\n    // ── Selection ────────────────────────────────────────────────────────────\n    function selectOption(opt: ComboboxOptionItem, originalEvent?: Event) {\n      if (opt.disabled) return;\n\n      if (isMultiple()) {\n        selectionController.toggle(opt.value);\n        query.value = '';\n        emitChange(originalEvent);\n        triggerValidation('change');\n\n        if (props.autoclose.value) {\n          closePopup();\n        }\n\n        // Keep dropdown open in multiple mode (unless autoclose is true)\n        focusLiveInput();\n        requestAnimationFrame(() => focusLiveInput());\n      } else {\n        selectionController.select(opt.value);\n        query.value = opt.label;\n        emitChange(originalEvent);\n        triggerValidation('change');\n        closePopup();\n        focusLiveInput();\n      }\n    }\n    function resolveOptionFromElement(optionEl: HTMLElement): ComboboxOptionItem | null {\n      const indexAttr = optionEl.getAttribute('data-option-index');\n      const index = indexAttr ? Number(indexAttr) : -1;\n\n      if (Number.isInteger(index) && index >= 0 && index < filteredOptions.value.length) {\n        return filteredOptions.value[index] ?? null;\n      }\n\n      const valueAttr = optionEl.getAttribute('data-option-value');\n\n      if (valueAttr) {\n        const byValue = filteredOptions.value.find((option) => option.value === valueAttr);\n\n        if (byValue) return byValue;\n      }\n\n      const labelText = optionEl.querySelector('span')?.textContent?.trim() ?? optionEl.textContent?.trim() ?? '';\n\n      if (!labelText) return null;\n\n      return filteredOptions.value.find((option) => option.label === labelText || option.value === labelText) ?? null;\n    }\n    function clearValue(e: Event) {\n      e.stopPropagation();\n      selectionController.clear();\n      query.value = '';\n      emitChange(e);\n      triggerValidation('change');\n      focusLiveInput();\n    }\n    function handleInput(e: InputEvent) {\n      const target = e.target as HTMLInputElement;\n      const newValue = target.value;\n\n      // Skip all input processing if we're in the middle of restoring the query\n      // This prevents the clearing logic from firing during close/restore\n      if (isRestoringQuery) {\n        return;\n      }\n\n      if (newValue === query.value) return;\n\n      query.value = newValue;\n\n      if (!isMultiple()) {\n        const currentItem = selectedValues.value[0];\n        const currentLabel = currentItem\n          ? (allOptions.value.find((o) => o.value === currentItem)?.label ?? currentItem)\n          : '';\n\n        // Preserve the current selection while typing. Selection should only\n        // change when a new option is committed or when the user explicitly clears.\n        const isJustOpening = newValue === '' && lastQueryBeforeClear === currentLabel;\n\n        if (isJustOpening) {\n          lastQueryBeforeClear = null;\n        }\n      }\n\n      optionList.navigate('first');\n\n      if (!isOpen.value) openPopup(false, 'keyboard');\n\n      emit('search', { query: target.value });\n    }\n    function handleFocus() {\n      // Intentionally no-op: open only on explicit click or keyboard.\n      // Opening on every focus surprises users tabbing through a form.\n    }\n\n    // ── Keyboard Navigation ──────────────────────────────────────────────────\n    function handleKeydown(e: KeyboardEvent) {\n      if (isDisabled.value) return;\n\n      if (optionList.handleKeydown(e)) return;\n\n      switch (e.key) {\n        case 'ArrowDown':\n          e.preventDefault();\n\n          if (!isOpen.value) {\n            openPopup(true, 'keyboard');\n            optionList.navigate('first');\n          } else {\n            optionList.navigate('next');\n          }\n\n          break;\n        case 'ArrowUp':\n          e.preventDefault();\n\n          if (!isOpen.value) {\n            openPopup(true, 'keyboard');\n          } else {\n            optionList.navigate('prev');\n          }\n\n          break;\n        case 'Backspace':\n          // In multiple mode, remove the last chip when the input is empty\n          if (isMultiple() && !query.value && selectedValues.value.length > 0) {\n            choice.removeValue(selectedValues.value[selectedValues.value.length - 1] ?? '');\n            emitChange(e);\n            triggerValidation('change');\n          }\n\n          break;\n        case 'Enter':\n          enterPress.handleKeydown(e);\n\n          break;\n        case 'Tab':\n          closePopup('programmatic');\n          break;\n        default:\n          break;\n      }\n    }\n\n    // ── Create option ────────────────────────────────────────────────────────\n    function createOption(rawQuery: string, originalEvent?: Event) {\n      const actualLabel = rawQuery.trim();\n\n      if (!actualLabel) return;\n\n      const value = makeCreatableValue(actualLabel);\n      const newOpt: ComboboxOptionItem = { disabled: false, iconEl: null, label: actualLabel, value };\n\n      createdOptions.value = [...createdOptions.value, newOpt];\n      selectOption(newOpt, originalEvent);\n    }\n    // ── Lifecycle ────────────────────────────────────────────────────────────\n\n    const observeLightDomOptions = (): (() => void) => {\n      const observer = new MutationObserver(() => {\n        readOptions();\n      });\n\n      observer.observe(el, {\n        attributeFilter: ['disabled', 'label', 'value'],\n        attributes: true,\n        childList: true,\n        subtree: true,\n      });\n\n      return () => observer.disconnect();\n    };\n\n    const stopObserving = observeLightDomOptions();\n\n    const handleShadowOptionPointerMove = (event: PointerEvent): void => {\n      const target = event.target;\n\n      if (!(target instanceof Element)) return;\n\n      const optionEl = target.closest<HTMLElement>('.option');\n\n      if (!optionEl) return;\n\n      const option = resolveOptionFromElement(optionEl);\n\n      if (!option || option.disabled) return;\n\n      const focusedIdx = filteredOptions.value.findIndex((candidate) => candidate.value === option.value);\n\n      if (focusedIdx >= 0) {\n        optionList.set(focusedIdx);\n      }\n    };\n    const shadowRoot = el.shadowRoot;\n\n    if (shadowRoot) {\n      shadowRoot.addEventListener('pointermove', handleShadowOptionPointerMove as EventListener);\n    }\n\n    const createListboxListeners = (listEl: HTMLElement): (() => void) => {\n      const handleActivate = (event: Event) => {\n        const target = event.target;\n\n        if (!(target instanceof Element)) return;\n\n        const createRow = target.closest<HTMLElement>('.no-results-create');\n\n        if (createRow) {\n          event.preventDefault();\n          event.stopPropagation();\n          createOption(query.value, event);\n\n          return;\n        }\n\n        const optionEl = target.closest<HTMLElement>('.option');\n\n        if (!optionEl) return;\n\n        event.preventDefault();\n        event.stopPropagation();\n\n        const option = resolveOptionFromElement(optionEl);\n\n        if (!option) return;\n\n        selectOption(option, event);\n      };\n\n      const handlePointerMove = (event: PointerEvent) => {\n        const target = event.target;\n\n        if (!(target instanceof Element)) return;\n\n        const optionEl = target.closest<HTMLElement>('.option');\n\n        if (!optionEl) return;\n\n        const option = resolveOptionFromElement(optionEl);\n\n        if (!option) return;\n\n        const focusedIdx = filteredOptions.value.findIndex((candidate) => candidate.value === option.value);\n\n        if (focusedIdx >= 0) {\n          optionList.set(focusedIdx);\n        }\n      };\n\n      listEl.addEventListener('click', handleActivate);\n      listEl.addEventListener('pointermove', handlePointerMove);\n\n      return () => {\n        listEl.removeEventListener('click', handleActivate);\n        listEl.removeEventListener('pointermove', handlePointerMove);\n      };\n    };\n\n    let stopListboxListeners: (() => void) | null = null;\n    let listboxListenersTarget: HTMLElement | null = null;\n\n    const setListboxElement = (el: HTMLElement | null): void => {\n      listboxEl = el;\n\n      if (listboxListenersTarget === el) return;\n\n      stopListboxListeners?.();\n      stopListboxListeners = null;\n      listboxListenersTarget = null;\n\n      if (!el) return;\n\n      stopListboxListeners = createListboxListeners(el);\n      listboxListenersTarget = el;\n    };\n\n    const ensureListboxListeners = (): void => {\n      if (!listboxEl) return;\n\n      if (listboxListenersTarget === listboxEl && stopListboxListeners) return;\n\n      stopListboxListeners?.();\n      stopListboxListeners = createListboxListeners(listboxEl);\n      listboxListenersTarget = listboxEl;\n    };\n\n    watch(() => {\n      ensureListboxListeners();\n\n      if (isOpen.value) {\n        if (dropdownEl && 'showPopover' in dropdownEl && !dropdownEl.matches(':popover-open')) dropdownEl.showPopover();\n\n        updatePosition();\n      } else {\n        if (dropdownEl && 'hidePopover' in dropdownEl && dropdownEl.matches(':popover-open')) dropdownEl.hidePopover();\n      }\n    });\n\n    // Once ore-input is in the DOM, grab its inner <input> from its shadow root\n    // and attach all combobox-specific ARIA + event handlers imperatively.\n    // MUST be registered before the ARIA effects below so inputEl is set first\n    // when bitInputRef fires (effects run in registration order).\n    onElement(bitInputRef, (bitInputEl) => {\n      fieldEl = bitInputEl;\n\n      const rawInput = bitInputEl.shadowRoot?.querySelector<HTMLInputElement>('input') ?? null;\n\n      if (!rawInput) return;\n\n      inputEl = rawInput;\n\n      rawInput.setAttribute('role', 'combobox');\n      rawInput.setAttribute('autocomplete', 'off');\n      rawInput.setAttribute('aria-autocomplete', 'list');\n      rawInput.setAttribute('aria-haspopup', 'listbox');\n      rawInput.setAttribute('spellcheck', 'false');\n      rawInput.setAttribute('aria-controls', `${comboId}-listbox`);\n\n      const handleInputClick = (): void => {\n        if (!isOpen.value) openPopup(true, 'click');\n\n        focusLiveInput();\n      };\n\n      rawInput.addEventListener('input', handleInput as EventListener);\n      rawInput.addEventListener('keydown', handleKeydown as EventListener);\n      rawInput.addEventListener('focus', handleFocus);\n      rawInput.addEventListener('click', handleInputClick);\n\n      return () => {\n        inputEl = null;\n        fieldEl = null;\n        rawInput.removeEventListener('input', handleInput as EventListener);\n        rawInput.removeEventListener('keydown', handleKeydown as EventListener);\n        rawInput.removeEventListener('focus', handleFocus);\n        rawInput.removeEventListener('click', handleInputClick);\n      };\n    });\n\n    // Reactively sync combobox-specific ARIA attrs that ore-input doesn't manage.\n    // Uses bitInputRef (a signal) as the gate so the effect re-runs when the\n    // inner input mounts — inputEl is a plain variable and would not trigger re-runs.\n    watch(() => {\n      if (!bitInputRef.value) return;\n\n      const el = inputEl;\n\n      if (!el) return;\n\n      el.setAttribute('aria-expanded', String(isOpen.value));\n\n      if (isDisabled.value) {\n        el.setAttribute('aria-disabled', 'true');\n      } else {\n        el.removeAttribute('aria-disabled');\n      }\n\n      if (props.error.value) {\n        el.setAttribute('aria-invalid', 'true');\n        el.setAttribute('aria-errormessage', `${comboId}-error`);\n      } else {\n        el.removeAttribute('aria-invalid');\n        el.removeAttribute('aria-errormessage');\n      }\n    });\n\n    // Reactively sync the query signal into the raw input value.\n    watch(() => {\n      if (!bitInputRef.value) return;\n\n      const el = inputEl;\n\n      if (!el) return;\n\n      if (el.value !== query.value) el.value = query.value;\n    });\n\n    onCleanup(() => {\n      shadowRoot?.removeEventListener('pointermove', handleShadowOptionPointerMove as EventListener);\n      stopListboxListeners?.();\n      stopListboxListeners = null;\n      listboxListenersTarget = null;\n      stopObserving();\n    });\n\n    const inputColor = () => props.color?.value ?? undefined;\n    const inputSize = () => fCtxProps.size?.value ?? undefined;\n    const inputVariant = () => fCtxProps.variant?.value ?? undefined;\n    const inputRounded = () => props.rounded?.value ?? undefined;\n    const inputFullwidth = () => (props.fullwidth.value ? true : undefined);\n\n    return html`\n      <slot></slot>\n      <ore-input\n        class=\"trigger\"\n        ref=${bitInputRef}\n        :label=\"${() => props.label.value ?? ''}\"\n        :placeholder=\"${inputPlaceholder}\"\n        :label-placement=\"${() => props['label-placement'].value ?? 'inset'}\"\n        :color=\"${inputColor}\"\n        :size=\"${inputSize}\"\n        :variant=\"${inputVariant}\"\n        :rounded=\"${inputRounded}\"\n        :helper=\"${() => props.helper.value ?? ''}\"\n        :error=\"${() => props.error.value ?? ''}\"\n        ?disabled=\"${isDisabled}\"\n        ?required=\"${() => false}\"\n        ?fullwidth=\"${inputFullwidth}\"\n        :name=\"${() => props.name.value ?? ''}\"\n        @click=\"${(e: MouseEvent) => {\n          fieldPress.handleClick(e);\n        }}\"\n        part=\"wrapper\">\n        <div slot=\"prefix\" class=\"chips-row\">\n          <!-- Keep chip list diffing isolated so input node identity stays stable. -->\n          <span class=\"chips-list\">\n            ${() =>\n              (isMultiple() ? selectedValues.value : []).map(\n                (value) => html`\n                  <ore-chip\n                    value=${value}\n                    label=${allOptions.value.find((option) => option.value === value)?.label ?? value}\n                    mode=\"removable\"\n                    variant=\"flat\"\n                    size=\"sm\"\n                    color=\"${props.color}\"\n                    @remove=${removeChip}>\n                    ${allOptions.value.find((option) => option.value === value)?.label ?? value}\n                  </ore-chip>\n                `,\n              )}\n          </span>\n        </div>\n        <span slot=\"suffix\" class=\"combobox-suffix\" aria-hidden=\"true\">\n          <button\n            class=\"clear-btn\"\n            part=\"clear-btn\"\n            type=\"button\"\n            aria-label=\"Clear\"\n            tabindex=\"-1\"\n            ?hidden=${() => !hasValue()}\n            @click=\"${clearValue}\">\n            <ore-icon name=\"x\" size=\"12\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n          </button>\n          <span class=\"combobox-suffix-end\">\n            <span class=\"loader\"></span>\n            <span class=\"chevron\">\n              <ore-icon name=\"chevron-down\" size=\"14\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n            </span>\n          </span>\n        </span>\n      </ore-input>\n      <span\n        class=\"sr-only\"\n        id=\"${() => `${comboId}-error`}\"\n        role=\"alert\"\n        aria-live=\"assertive\"\n        ?hidden=\"${() => !props.error.value}\"\n        >${() => props.error.value ?? ''}</span\n      >\n      <div\n        class=\"dropdown\"\n        part=\"dropdown\"\n        id=\"${() => `${comboId}-dropdown`}\"\n        popover=\"manual\"\n        ?data-open=${() => isOpen.value}\n        ref=${(el: HTMLElement | null) => {\n          dropdownEl = el;\n        }}>\n        <div\n          role=\"listbox\"\n          id=\"${() => `${comboId}-listbox`}\"\n          :style=\"${() =>\n            isOpen.value && filteredOptions.value.length > 0 ? `height:${filteredOptions.value.length * 36}px;` : ''}\"\n          aria-label=\"${() => props.label.value || props.placeholder.value || 'Options'}\"\n          ref=${(el: HTMLElement | null) => {\n            setListboxElement(el);\n          }}>\n          ${() => {\n            if (!isOpen.value) return '';\n\n            if (isLoading()) {\n              return html`<div class=\"dropdown-loading\">Loading...</div>`;\n            }\n\n            if (filteredOptions.value.length === 0) {\n              if (creatableLabel.value) {\n                return html`<button\n                  type=\"button\"\n                  class=\"no-results-create\"\n                  ?data-focused=${() => focusedIndex.value === -1}>\n                  ${creatableLabel.value}\n                </button>`;\n              }\n\n              return html`<div class=\"no-results\" role=\"presentation\">No results found</div>`;\n            }\n\n            return filteredOptions.value.map((option, index) => {\n              return html`<div\n                class=\"option\"\n                role=\"option\"\n                id=\"${`${comboId}-opt-${index}`}\"\n                data-option-index=\"${index}\"\n                data-option-value=\"${option.value}\"\n                :aria-selected=\"${() =>\n                  String(\n                    isMultiple() ? selectedValues.value.includes(option.value) : selectedValue.value === option.value,\n                  )}\"\n                aria-disabled=\"${String(option.disabled)}\"\n                style=\"${`position:absolute;top:0;left:0;right:0;transform:translateY(${index * 36}px);`}\"\n                ?data-focused=${() => focusedIndex.value === index}\n                ?data-selected=${() =>\n                  isMultiple() ? selectedValues.value.includes(option.value) : selectedValue.value === option.value}\n                ?data-disabled=${option.disabled}>\n                <span>${option.label}</span>\n                <span class=\"option-check\" aria-hidden=\"true\"\n                  ><ore-icon name=\"check\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon\n                ></span>\n              </div>`;\n            });\n          }}\n        </div>\n      </div>\n    `;\n  },\n  shadow: { delegatesFocus: true },\n  styles: [reducedMotionMixin, srOnlyMixin, componentStyles],\n}) as unknown as AddEventListeners<OreComboboxEvents>;\n"],"mappings":"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"}
+{"version":3,"file":"combobox.cjs","names":[],"sources":["../src/inputs/combobox/combobox.ts"],"sourcesContent":["import {\n  define,\n  html,\n  inject,\n  prop,\n  ref,\n  bind,\n  getHost,\n  onCleanup,\n  onElement,\n  useEmit,\n  watchEffect,\n} from '@vielzeug/ore';\nimport { useField } from '@vielzeug/ore/forms';\nimport { computed, signal } from '@vielzeug/ripple';\n\nimport type { AddEventListeners, ComponentSize, RoundedSize, ThemeColor } from '../../types';\nimport type { OreComboboxEvents, OreComboboxProps, ComboboxOptionInput, ComboboxOptionItem } from './combobox.types';\n\nimport {\n  lifecycleSignal,\n  createChoiceField,\n  createInteraction,\n  createOptionList,\n  type DialogCloseReason,\n  type OverlayOpenReason,\n} from '../../headless';\nimport { reducedMotionMixin, srOnlyMixin } from '../../styles';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport { filterOptions, getCreatableLabel, makeCreatableValue, parseSlottedOptions } from './combobox-options';\nimport '../../feedback/chip/chip';\nimport '../input/input';\nimport componentStyles from './combobox.css?inline';\n\nexport type { OreComboboxEvents, OreComboboxProps } from './combobox.types';\n\n/**\n * A searchable select field with multiple selection, custom option creation, and large-list support.\n *\n * @element ore-combobox\n *\n * @attr {string} value - Selected value(s). Use comma-separated for multiple.\n * @attr {boolean} multiple - Enable multiple selection\n * @attr {boolean} creatable - Allow users to create custom options from search query\n * @attr {boolean} no-filter - Disable client-side filtering (useful for server-side search)\n * @attr {string} placeholder - Placeholder text\n *\n * @fires {CustomEvent} change - Emitted when selection changes. detail: { value: string | string[], values: string[], labels: string[] }\n * @fires {CustomEvent} search - Emitted when user types. detail: { query: string }\n *\n * @slot - Slotted combobox options and option groups\n * @cssprop --combobox-dropdown-bg - Dropdown panel background color\n * @cssprop --combobox-dropdown-border-color - Dropdown panel border color\n * @cssprop --combobox-option-hover-bg - Option background on hover\n * @cssprop --combobox-option-focus-bg - Option background when keyboard-focused\n * @cssprop --combobox-option-selected-bg - Option background when selected\n * @cssprop --combobox-option-selected-focus-bg - Option background when selected and focused\n * @cssprop --input-bg - Field background (passed through to ore-input)\n * @cssprop --input-border-color - Field border color (passed through to ore-input)\n *\n * @part wrapper - Root wrapper around the entire field\n * @part label - Label element shown inside or outside the field\n * @part field - Field container that holds the trigger input and clear button\n * @part input - Search input used to filter and select options\n * @part clear-btn - Button that clears the current selection/query\n * @part dropdown - Popup list container for options\n * @part helper-text - Helper text displayed below the field\n * @example\n * ```html\n * <ore-combobox label=\"Country\" name=\"country\">\n *   <ore-combobox-option value=\"us\">United States</ore-combobox-option>\n *   <ore-combobox-option value=\"gb\">United Kingdom</ore-combobox-option>\n *   <ore-combobox-option value=\"de\" disabled>Germany</ore-combobox-option>\n * </ore-combobox>\n * ```\n */\nexport const COMBOBOX_TAG = 'ore-combobox' as const;\ndefine<OreComboboxProps>(COMBOBOX_TAG, {\n  formAssociated: true,\n  props: {\n    autoclose: prop.bool(false),\n    color: prop.string<ThemeColor>(),\n    creatable: prop.bool(false),\n    disabled: prop.bool(false),\n    error: prop.string(),\n    fullwidth: prop.bool(false),\n    helper: prop.string(),\n    label: prop.string(),\n    'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n    loading: prop.bool(false),\n    multiple: prop.bool(false),\n    name: prop.string(),\n    'no-filter': prop.bool(false),\n    options: prop.data<ComboboxOptionInput[]>(),\n    placeholder: prop.string('Select...'),\n    rounded: prop.string<RoundedSize>(),\n    size: prop.string<ComponentSize>(),\n    value: prop.string(),\n    variant: prop.string<'flat' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreComboboxEvents>();\n    const watch = watchEffect;\n\n    const formCtx = inject(FORM_CTX);\n    const fCtxProps = useFormContext(props, formCtx);\n    const query = signal('');\n\n    // Element refs needed by the composite option-list factory.\n    let inputEl: HTMLInputElement | null = null;\n    let fieldEl: HTMLElement | null = null; // set to the ore-input host once it mounts\n    let dropdownEl: HTMLElement | null = null;\n    let listboxEl: HTMLElement | null = null;\n\n    // Ref to the ore-input host; resolved when the template renders.\n    const bitInputRef = ref<HTMLElement>();\n\n    const abortSignal = lifecycleSignal(onCleanup);\n    let _formField: { reportValidity(): void } | null = null;\n    const choice = createChoiceField({\n      disabled: fCtxProps.disabled,\n      error: props.error,\n      getFormField: () => _formField,\n      helper: props.helper,\n      label: props.label,\n      labelPlacement: props['label-placement'],\n      multiple: props.multiple,\n      prefix: 'combobox',\n      signal: abortSignal,\n      validateOn: formCtx?.validateOn,\n      value: props.value,\n    });\n\n    // filteredOptions signal declared before optionList so the getItems getter\n    // captures the live signal reference rather than needing a factory indirection.\n    const filteredOptions = signal<ComboboxOptionItem[]>([]);\n\n    const optionList = createOptionList<ComboboxOptionItem>({\n      getBoundary: () => el,\n      getFocusedOptionElement: () => dropdownEl?.querySelector<HTMLElement>('[data-focused]') ?? null,\n      getItems: () => filteredOptions.value,\n      getOptionId: (index) => `${choice.fieldId}-opt-${index}`,\n      getPanel: () => dropdownEl,\n      getReference: () => fieldEl,\n      getTrigger: () => inputEl,\n      isDisabled: () => choice.disabled.value,\n      onClose: (reason) => {\n        emit('close', { reason });\n\n        if (!abortSignal.aborted) restoreQueryFromSelection();\n\n        choice.triggerValidation('blur');\n      },\n      onOpen: (reason) => emit('open', { reason }),\n      restoreFocus: false,\n      signal: abortSignal,\n    });\n\n    const { disabled: isDisabled, fieldId: comboId, selectedValues, triggerValidation } = choice;\n\n    _formField = useField<string>({ disabled: choice.disabled, toFormValue: (v) => v, value: choice.formValue });\n\n    const { focusedIndex, isOpen, scrollFocusedIntoView, updatePosition } = optionList;\n    // ── State ────────────────────────────────────────────────────────────────\n    const isMultiple = () => Boolean(props.multiple.value);\n    const isCreatable = () => Boolean(props.creatable.value);\n    const isNoFilter = () => Boolean(props['no-filter'].value);\n\n    bind({\n      attr: {\n        open: () => (isOpen.value ? true : undefined),\n        size: fCtxProps.size,\n        variant: fCtxProps.variant,\n      },\n    });\n\n    let lastQueryBeforeClear: string | null = null;\n    let isRestoringQuery = false;\n\n    // Convenience getter for single-select\n    const selectedValue = computed(() => selectedValues.value[0] ?? '');\n\n    // Expose .value as a JS property accessor on the host element\n    Object.defineProperty(el, 'value', {\n      configurable: true,\n      get: () => (isMultiple() ? selectedValues.value : selectedValue.value),\n      set: (val: unknown) => {\n        const v = val as string | string[] | null | undefined;\n\n        if (Array.isArray(v)) {\n          choice.setValues(v.map((entry) => String(entry ?? '')));\n\n          return;\n        }\n\n        if (v == null || v === '') {\n          choice.clear();\n\n          return;\n        }\n\n        choice.setValues([String(v)]);\n      },\n    });\n\n    const hasValue = () => selectedValues.value.length > 0;\n\n    function focusLiveInput() {\n      inputEl?.focus();\n    }\n\n    // ── Options ──────────────────────────────────────────────────────────────\n    const slottedOptions = signal<ComboboxOptionItem[]>([]);\n    const createdOptions = signal<ComboboxOptionItem[]>([]);\n    const isLoading = () => Boolean(props.loading.value);\n\n    function normalizeOption(option: ComboboxOptionInput): ComboboxOptionItem {\n      return {\n        disabled: Boolean(option.disabled),\n        iconEl: option.iconEl ?? null,\n        label: option.label ?? option.value,\n        value: option.value,\n      };\n    }\n\n    // Merged options: explicit prop value overrides slotted options.\n    const allOptions = computed<ComboboxOptionItem[]>(() => {\n      const optionsProp = props.options.value;\n      const base = Array.isArray(optionsProp) ? optionsProp.map(normalizeOption) : slottedOptions.value;\n\n      if (createdOptions.value.length === 0) return base;\n\n      return [...base, ...createdOptions.value];\n    });\n\n    const selectionController = {\n      clear: () => {\n        choice.clear();\n      },\n      remove: (key: string) => {\n        choice.removeValue(key);\n      },\n      select: (key: string) => {\n        choice.selectValue(key);\n      },\n      toggle: (key: string) => {\n        choice.toggleValue(key);\n      },\n    };\n\n    function readOptions(elements: Element[] = Array.from(el.children)) {\n      slottedOptions.value = parseSlottedOptions(elements);\n\n      if (!isMultiple()) {\n        const match = allOptions.value.find((option) => option.value === selectedValue.value);\n\n        query.value = match?.label ?? selectedValue.value;\n      }\n    }\n\n    // Initialize from light DOM immediately; onMounted/observer keep this in sync afterwards.\n    readOptions();\n\n    watch(() => {\n      const nextOptions = filterOptions(allOptions.value, query.value, isNoFilter());\n\n      filteredOptions.value = isMultiple()\n        ? nextOptions.filter((option) => !selectedValues.value.includes(option.value))\n        : nextOptions;\n    });\n\n    // \"Create\" option shown when creatable + query doesn't match any existing option\n    const creatableLabel = computed(() => {\n      return getCreatableLabel(query.value, isCreatable(), filteredOptions.value);\n    });\n    const inputPlaceholder = () =>\n      isMultiple() && selectedValues.value.length > 0 ? '' : props.placeholder.value || '';\n\n    const selectedValueItems = computed(() => selectedValues.value);\n    const selectedLabelItems = computed(() =>\n      selectedValues.value.map((value) => allOptions.value.find((option) => option.value === value)?.label ?? value),\n    );\n\n    function emitChange(originalEvent?: Event) {\n      emit('change', { labels: selectedLabelItems.value, originalEvent, values: selectedValueItems.value });\n    }\n\n    function removeChip(event: Event): void {\n      event.stopPropagation();\n\n      const value = (event as CustomEvent<{ value?: string }>).detail?.value;\n\n      if (value === undefined) return;\n\n      selectionController.remove(value);\n      emitChange(event);\n      triggerValidation('change');\n    }\n\n    function restoreQueryFromSelection() {\n      // Keep input text and selected value in sync whenever the popup closes.\n      if (!isMultiple()) {\n        const match = allOptions.value.find((option) => option.value === selectedValue.value);\n\n        isRestoringQuery = true;\n        query.value = match?.label ?? '';\n        Promise.resolve().then(() => {\n          isRestoringQuery = false;\n        });\n\n        return;\n      }\n\n      query.value = '';\n    }\n\n    watch(() => {\n      if (isOpen.value && !isMultiple() && selectedValue.value && focusedIndex.value === -1 && query.value === '') {\n        const selectedIndex = filteredOptions.value.findIndex((option) => option.value === selectedValue.value);\n\n        if (selectedIndex >= 0) {\n          optionList.set(selectedIndex);\n        }\n      }\n    });\n\n    // ── Open / Close ─────────────────────────────────────────────────────────\n    function openPopup(clearFilter = true, reason: OverlayOpenReason = 'programmatic') {\n      if (clearFilter) {\n        lastQueryBeforeClear = query.value;\n        query.value = '';\n      }\n\n      // Pre-compute focused index BEFORE opening so the first render has it set\n      if (!isMultiple() && selectedValue.value) {\n        const freshOptions = filterOptions(allOptions.value, '', isNoFilter());\n        const selectedIndex = freshOptions.findIndex((option) => option.value === selectedValue.value);\n\n        if (selectedIndex >= 0) {\n          optionList.set(selectedIndex);\n        }\n      }\n\n      optionList.open(reason);\n\n      if (!isMultiple() && selectedValue.value && focusedIndex.value >= 0) {\n        requestAnimationFrame(() => {\n          scrollFocusedIntoView();\n        });\n      }\n    }\n\n    function closePopup(reason: DialogCloseReason = 'programmatic') {\n      optionList.close(reason);\n    }\n\n    const fieldPress = createInteraction({\n      disabled: isDisabled,\n      onPress: () => {\n        if (!isOpen.value) openPopup(true, 'click');\n\n        focusLiveInput();\n      },\n    });\n\n    const enterPress = createInteraction({\n      disabled: isDisabled,\n      keys: ['Enter'],\n      onPress: (originalEvent: Event) => {\n        const opts = filteredOptions.value;\n\n        if (isOpen.value && focusedIndex.value >= 0 && focusedIndex.value < opts.length) {\n          selectOption(opts[focusedIndex.value], originalEvent);\n        } else if (isOpen.value && focusedIndex.value === -1 && creatableLabel.value) {\n          // Focused on the \"create\" item\n          createOption(query.value, originalEvent);\n        } else if (!isOpen.value) {\n          openPopup(true, 'keyboard');\n        }\n      },\n    });\n\n    // ── Selection ────────────────────────────────────────────────────────────\n    function selectOption(opt: ComboboxOptionItem, originalEvent?: Event) {\n      if (opt.disabled) return;\n\n      if (isMultiple()) {\n        selectionController.toggle(opt.value);\n        query.value = '';\n        emitChange(originalEvent);\n        triggerValidation('change');\n\n        if (props.autoclose.value) {\n          closePopup();\n        }\n\n        // Keep dropdown open in multiple mode (unless autoclose is true)\n        focusLiveInput();\n        requestAnimationFrame(() => focusLiveInput());\n      } else {\n        selectionController.select(opt.value);\n        query.value = opt.label;\n        emitChange(originalEvent);\n        triggerValidation('change');\n        closePopup();\n        focusLiveInput();\n      }\n    }\n    function resolveOptionFromElement(optionEl: HTMLElement): ComboboxOptionItem | null {\n      const indexAttr = optionEl.getAttribute('data-option-index');\n      const index = indexAttr ? Number(indexAttr) : -1;\n\n      if (Number.isInteger(index) && index >= 0 && index < filteredOptions.value.length) {\n        return filteredOptions.value[index] ?? null;\n      }\n\n      const valueAttr = optionEl.getAttribute('data-option-value');\n\n      if (valueAttr) {\n        const byValue = filteredOptions.value.find((option) => option.value === valueAttr);\n\n        if (byValue) return byValue;\n      }\n\n      const labelText = optionEl.querySelector('span')?.textContent?.trim() ?? optionEl.textContent?.trim() ?? '';\n\n      if (!labelText) return null;\n\n      return filteredOptions.value.find((option) => option.label === labelText || option.value === labelText) ?? null;\n    }\n    function clearValue(e: Event) {\n      e.stopPropagation();\n      selectionController.clear();\n      query.value = '';\n      emitChange(e);\n      triggerValidation('change');\n      focusLiveInput();\n    }\n    function handleInput(e: InputEvent) {\n      const target = e.target as HTMLInputElement;\n      const newValue = target.value;\n\n      // Skip all input processing if we're in the middle of restoring the query\n      // This prevents the clearing logic from firing during close/restore\n      if (isRestoringQuery) {\n        return;\n      }\n\n      if (newValue === query.value) return;\n\n      query.value = newValue;\n\n      if (!isMultiple()) {\n        const currentItem = selectedValues.value[0];\n        const currentLabel = currentItem\n          ? (allOptions.value.find((o) => o.value === currentItem)?.label ?? currentItem)\n          : '';\n\n        // Preserve the current selection while typing. Selection should only\n        // change when a new option is committed or when the user explicitly clears.\n        const isJustOpening = newValue === '' && lastQueryBeforeClear === currentLabel;\n\n        if (isJustOpening) {\n          lastQueryBeforeClear = null;\n        }\n      }\n\n      optionList.navigate('first');\n\n      if (!isOpen.value) openPopup(false, 'keyboard');\n\n      emit('search', { query: target.value });\n    }\n    function handleFocus() {\n      // Intentionally no-op: open only on explicit click or keyboard.\n      // Opening on every focus surprises users tabbing through a form.\n    }\n\n    // ── Keyboard Navigation ──────────────────────────────────────────────────\n    function handleKeydown(e: KeyboardEvent) {\n      if (isDisabled.value) return;\n\n      if (optionList.handleKeydown(e)) return;\n\n      switch (e.key) {\n        case 'ArrowDown':\n          e.preventDefault();\n\n          if (!isOpen.value) {\n            openPopup(true, 'keyboard');\n            optionList.navigate('first');\n          } else {\n            optionList.navigate('next');\n          }\n\n          break;\n        case 'ArrowUp':\n          e.preventDefault();\n\n          if (!isOpen.value) {\n            openPopup(true, 'keyboard');\n          } else {\n            optionList.navigate('prev');\n          }\n\n          break;\n        case 'Backspace':\n          // In multiple mode, remove the last chip when the input is empty\n          if (isMultiple() && !query.value && selectedValues.value.length > 0) {\n            choice.removeValue(selectedValues.value[selectedValues.value.length - 1] ?? '');\n            emitChange(e);\n            triggerValidation('change');\n          }\n\n          break;\n        case 'Enter':\n          enterPress.handleKeydown(e);\n\n          break;\n        case 'Tab':\n          closePopup('programmatic');\n          break;\n        default:\n          break;\n      }\n    }\n\n    // ── Create option ────────────────────────────────────────────────────────\n    function createOption(rawQuery: string, originalEvent?: Event) {\n      const actualLabel = rawQuery.trim();\n\n      if (!actualLabel) return;\n\n      const value = makeCreatableValue(actualLabel);\n      const newOpt: ComboboxOptionItem = { disabled: false, iconEl: null, label: actualLabel, value };\n\n      createdOptions.value = [...createdOptions.value, newOpt];\n      selectOption(newOpt, originalEvent);\n    }\n    // ── Lifecycle ────────────────────────────────────────────────────────────\n\n    const observeLightDomOptions = (): (() => void) => {\n      const observer = new MutationObserver(() => {\n        readOptions();\n      });\n\n      observer.observe(el, {\n        attributeFilter: ['disabled', 'label', 'value'],\n        attributes: true,\n        childList: true,\n        subtree: true,\n      });\n\n      return () => observer.disconnect();\n    };\n\n    const stopObserving = observeLightDomOptions();\n\n    const handleShadowOptionPointerMove = (event: PointerEvent): void => {\n      const target = event.target;\n\n      if (!(target instanceof Element)) return;\n\n      const optionEl = target.closest<HTMLElement>('.option');\n\n      if (!optionEl) return;\n\n      const option = resolveOptionFromElement(optionEl);\n\n      if (!option || option.disabled) return;\n\n      const focusedIdx = filteredOptions.value.findIndex((candidate) => candidate.value === option.value);\n\n      if (focusedIdx >= 0) {\n        optionList.set(focusedIdx);\n      }\n    };\n    const shadowRoot = el.shadowRoot;\n\n    if (shadowRoot) {\n      shadowRoot.addEventListener('pointermove', handleShadowOptionPointerMove as EventListener);\n    }\n\n    const createListboxListeners = (listEl: HTMLElement): (() => void) => {\n      const handleActivate = (event: Event) => {\n        const target = event.target;\n\n        if (!(target instanceof Element)) return;\n\n        const createRow = target.closest<HTMLElement>('.no-results-create');\n\n        if (createRow) {\n          event.preventDefault();\n          event.stopPropagation();\n          createOption(query.value, event);\n\n          return;\n        }\n\n        const optionEl = target.closest<HTMLElement>('.option');\n\n        if (!optionEl) return;\n\n        event.preventDefault();\n        event.stopPropagation();\n\n        const option = resolveOptionFromElement(optionEl);\n\n        if (!option) return;\n\n        selectOption(option, event);\n      };\n\n      const handlePointerMove = (event: PointerEvent) => {\n        const target = event.target;\n\n        if (!(target instanceof Element)) return;\n\n        const optionEl = target.closest<HTMLElement>('.option');\n\n        if (!optionEl) return;\n\n        const option = resolveOptionFromElement(optionEl);\n\n        if (!option) return;\n\n        const focusedIdx = filteredOptions.value.findIndex((candidate) => candidate.value === option.value);\n\n        if (focusedIdx >= 0) {\n          optionList.set(focusedIdx);\n        }\n      };\n\n      listEl.addEventListener('click', handleActivate);\n      listEl.addEventListener('pointermove', handlePointerMove);\n\n      return () => {\n        listEl.removeEventListener('click', handleActivate);\n        listEl.removeEventListener('pointermove', handlePointerMove);\n      };\n    };\n\n    let stopListboxListeners: (() => void) | null = null;\n    let listboxListenersTarget: HTMLElement | null = null;\n\n    const setListboxElement = (el: HTMLElement | null): void => {\n      listboxEl = el;\n\n      if (listboxListenersTarget === el) return;\n\n      stopListboxListeners?.();\n      stopListboxListeners = null;\n      listboxListenersTarget = null;\n\n      if (!el) return;\n\n      stopListboxListeners = createListboxListeners(el);\n      listboxListenersTarget = el;\n    };\n\n    const ensureListboxListeners = (): void => {\n      if (!listboxEl) return;\n\n      if (listboxListenersTarget === listboxEl && stopListboxListeners) return;\n\n      stopListboxListeners?.();\n      stopListboxListeners = createListboxListeners(listboxEl);\n      listboxListenersTarget = listboxEl;\n    };\n\n    watch(() => {\n      ensureListboxListeners();\n\n      if (isOpen.value) {\n        if (dropdownEl && 'showPopover' in dropdownEl && !dropdownEl.matches(':popover-open')) dropdownEl.showPopover();\n\n        updatePosition();\n      } else {\n        if (dropdownEl && 'hidePopover' in dropdownEl && dropdownEl.matches(':popover-open')) dropdownEl.hidePopover();\n      }\n    });\n\n    // Once ore-input is in the DOM, grab its inner <input> from its shadow root\n    // and attach all combobox-specific ARIA + event handlers imperatively.\n    // MUST be registered before the ARIA effects below so inputEl is set first\n    // when bitInputRef fires (effects run in registration order).\n    onElement(bitInputRef, (bitInputEl) => {\n      fieldEl = bitInputEl;\n\n      const rawInput = bitInputEl.shadowRoot?.querySelector<HTMLInputElement>('input') ?? null;\n\n      if (!rawInput) return;\n\n      inputEl = rawInput;\n\n      rawInput.setAttribute('role', 'combobox');\n      rawInput.setAttribute('autocomplete', 'off');\n      rawInput.setAttribute('aria-autocomplete', 'list');\n      rawInput.setAttribute('aria-haspopup', 'listbox');\n      rawInput.setAttribute('spellcheck', 'false');\n      rawInput.setAttribute('aria-controls', `${comboId}-listbox`);\n\n      const handleInputClick = (): void => {\n        if (!isOpen.value) openPopup(true, 'click');\n\n        focusLiveInput();\n      };\n\n      rawInput.addEventListener('input', handleInput as EventListener);\n      rawInput.addEventListener('keydown', handleKeydown as EventListener);\n      rawInput.addEventListener('focus', handleFocus);\n      rawInput.addEventListener('click', handleInputClick);\n\n      return () => {\n        inputEl = null;\n        fieldEl = null;\n        rawInput.removeEventListener('input', handleInput as EventListener);\n        rawInput.removeEventListener('keydown', handleKeydown as EventListener);\n        rawInput.removeEventListener('focus', handleFocus);\n        rawInput.removeEventListener('click', handleInputClick);\n      };\n    });\n\n    // Reactively sync combobox-specific ARIA attrs that ore-input doesn't manage.\n    // Uses bitInputRef (a signal) as the gate so the effect re-runs when the\n    // inner input mounts — inputEl is a plain variable and would not trigger re-runs.\n    watch(() => {\n      if (!bitInputRef.value) return;\n\n      const el = inputEl;\n\n      if (!el) return;\n\n      el.setAttribute('aria-expanded', String(isOpen.value));\n\n      if (isDisabled.value) {\n        el.setAttribute('aria-disabled', 'true');\n      } else {\n        el.removeAttribute('aria-disabled');\n      }\n\n      if (props.error.value) {\n        el.setAttribute('aria-invalid', 'true');\n        el.setAttribute('aria-errormessage', `${comboId}-error`);\n      } else {\n        el.removeAttribute('aria-invalid');\n        el.removeAttribute('aria-errormessage');\n      }\n    });\n\n    // Reactively sync the query signal into the raw input value.\n    watch(() => {\n      if (!bitInputRef.value) return;\n\n      const el = inputEl;\n\n      if (!el) return;\n\n      if (el.value !== query.value) el.value = query.value;\n    });\n\n    onCleanup(() => {\n      shadowRoot?.removeEventListener('pointermove', handleShadowOptionPointerMove as EventListener);\n      stopListboxListeners?.();\n      stopListboxListeners = null;\n      listboxListenersTarget = null;\n      stopObserving();\n    });\n\n    const inputColor = () => props.color?.value ?? undefined;\n    const inputSize = () => fCtxProps.size?.value ?? undefined;\n    const inputVariant = () => fCtxProps.variant?.value ?? undefined;\n    const inputRounded = () => props.rounded?.value ?? undefined;\n    const inputFullwidth = () => (props.fullwidth.value ? true : undefined);\n\n    return html`\n      <slot></slot>\n      <ore-input\n        class=\"trigger\"\n        ref=${bitInputRef}\n        :label=\"${() => props.label.value ?? ''}\"\n        :placeholder=\"${inputPlaceholder}\"\n        :label-placement=\"${() => props['label-placement'].value ?? 'inset'}\"\n        :color=\"${inputColor}\"\n        :size=\"${inputSize}\"\n        :variant=\"${inputVariant}\"\n        :rounded=\"${inputRounded}\"\n        :helper=\"${() => props.helper.value ?? ''}\"\n        :error=\"${() => props.error.value ?? ''}\"\n        ?disabled=\"${isDisabled}\"\n        ?required=\"${() => false}\"\n        ?fullwidth=\"${inputFullwidth}\"\n        :name=\"${() => props.name.value ?? ''}\"\n        @click=\"${(e: MouseEvent) => {\n          fieldPress.handleClick(e);\n        }}\"\n        part=\"wrapper\">\n        <div slot=\"prefix\" class=\"chips-row\">\n          <!-- Keep chip list diffing isolated so input node identity stays stable. -->\n          <span class=\"chips-list\">\n            ${() =>\n              (isMultiple() ? selectedValues.value : []).map(\n                (value) => html`\n                  <ore-chip\n                    value=${value}\n                    label=${allOptions.value.find((option) => option.value === value)?.label ?? value}\n                    mode=\"removable\"\n                    variant=\"flat\"\n                    size=\"sm\"\n                    color=\"${props.color}\"\n                    @remove=${removeChip}>\n                    ${allOptions.value.find((option) => option.value === value)?.label ?? value}\n                  </ore-chip>\n                `,\n              )}\n          </span>\n        </div>\n        <span slot=\"suffix\" class=\"combobox-suffix\" aria-hidden=\"true\">\n          <button\n            class=\"clear-btn\"\n            part=\"clear-btn\"\n            type=\"button\"\n            aria-label=\"Clear\"\n            tabindex=\"-1\"\n            ?hidden=${() => !hasValue()}\n            @click=\"${clearValue}\">\n            <ore-icon name=\"x\" size=\"12\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon>\n          </button>\n          <span class=\"combobox-suffix-end\">\n            <span class=\"loader\"></span>\n            <span class=\"chevron\">\n              <ore-icon name=\"chevron-down\" size=\"14\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n            </span>\n          </span>\n        </span>\n      </ore-input>\n      <span\n        class=\"sr-only\"\n        id=\"${() => `${comboId}-error`}\"\n        role=\"alert\"\n        aria-live=\"assertive\"\n        ?hidden=\"${() => !props.error.value}\"\n        >${() => props.error.value ?? ''}</span\n      >\n      <div\n        class=\"dropdown\"\n        part=\"dropdown\"\n        id=\"${() => `${comboId}-dropdown`}\"\n        popover=\"manual\"\n        ?data-open=${() => isOpen.value}\n        ref=${(el: HTMLElement | null) => {\n          dropdownEl = el;\n        }}>\n        <div\n          role=\"listbox\"\n          id=\"${() => `${comboId}-listbox`}\"\n          :style=\"${() =>\n            isOpen.value && filteredOptions.value.length > 0 ? `height:${filteredOptions.value.length * 36}px;` : ''}\"\n          aria-label=\"${() => props.label.value || props.placeholder.value || 'Options'}\"\n          ref=${(el: HTMLElement | null) => {\n            setListboxElement(el);\n          }}>\n          ${() => {\n            if (!isOpen.value) return '';\n\n            if (isLoading()) {\n              return html`<div class=\"dropdown-loading\">Loading...</div>`;\n            }\n\n            if (filteredOptions.value.length === 0) {\n              if (creatableLabel.value) {\n                return html`<button\n                  type=\"button\"\n                  class=\"no-results-create\"\n                  ?data-focused=${() => focusedIndex.value === -1}>\n                  ${creatableLabel.value}\n                </button>`;\n              }\n\n              return html`<div class=\"no-results\" role=\"presentation\">No results found</div>`;\n            }\n\n            return filteredOptions.value.map((option, index) => {\n              return html`<div\n                class=\"option\"\n                role=\"option\"\n                id=\"${`${comboId}-opt-${index}`}\"\n                data-option-index=\"${index}\"\n                data-option-value=\"${option.value}\"\n                :aria-selected=\"${() =>\n                  String(\n                    isMultiple() ? selectedValues.value.includes(option.value) : selectedValue.value === option.value,\n                  )}\"\n                aria-disabled=\"${String(option.disabled)}\"\n                style=\"${`position:absolute;top:0;left:0;right:0;transform:translateY(${index * 36}px);`}\"\n                ?data-focused=${() => focusedIndex.value === index}\n                ?data-selected=${() =>\n                  isMultiple() ? selectedValues.value.includes(option.value) : selectedValue.value === option.value}\n                ?data-disabled=${option.disabled}>\n                <span>${option.label}</span>\n                <span class=\"option-check\" aria-hidden=\"true\"\n                  ><ore-icon name=\"check\" size=\"14\" stroke-width=\"2.5\" aria-hidden=\"true\"></ore-icon\n                ></span>\n              </div>`;\n            });\n          }}\n        </div>\n      </div>\n    `;\n  },\n  shadow: { delegatesFocus: true },\n  styles: [reducedMotionMixin, srOnlyMixin, componentStyles],\n}) as unknown as AddEventListeners<OreComboboxEvents>;\n"],"mappings":"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"}