@skdx/web-components 0.28.0 → 0.29.0

package/dist/select/SelectContent.js

@@ -1,5 +1,5 @@
-var p=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var n=(a,s,t,e)=>{for(var i=e>1?void 0:e?f(s,t):s,l=a.length-1,d;l>=0;l--)(d=a[l])&&(i=(e?d(s,t,i):d(i))||i);return e&&i&&p(s,t,i),i};import{css as v,html as m,LitElement as g}from"lit";import{property as r}from"lit/decorators.js";import{closestThroughPortal as y}from"../internal/closest.js";import{customElement as b}from"../internal/define.js";import{dispatchEscapeKeyDown as E,dispatchOutside as h,focusOutsideTarget as O,triggerContains as P}from"../internal/dismiss.js";import{optOutBoolean as L,positionFloating as w}from"../internal/positioning.js";import{hiddenHostStyles as A}from"../internal/styles.js";import{OPTION_SELECTOR as T}from"./Select.js";function D(a,s){let t=a.querySelector('[data-part="viewport"]')??a;if(t===s||!t.contains(s))return;let e=t.getBoundingClientRect(),i=s.getBoundingClientRect();t.scrollTop+=i.top-e.top-(e.height-i.height)/2}var o=class extends g{constructor(){super(...arguments);this.side="bottom";this.align="start";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.preventFocusSteal=t=>t.preventDefault();this.handleOutsidePointerDown=t=>{if(!this.root?.open)return;let e=t.target;this.contains(e)||P(this.root.triggerEl,e)||h(this,"pointer-down-outside",t)&&this.root.setOpen(!1)};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let e=O(t);!e||this.contains(e)||this.root.contains(e)||h(this,"focus-outside",t)&&this.root.setOpen(!1)};this.handleDocumentKeyDown=t=>{t.key!=="Escape"||!this.root?.open||(t.preventDefault(),E(this,t)&&(this.root.setOpen(!1),this.root.focusTrigger()))}}connectedCallback(){super.connectedCallback(),this.setAttribute("role","listbox"),this.tabIndex=-1,this.root=y(this,"skdx-select"),this.root&&(this.root.contentEl=this),this.root?.addEventListener("skdx-select-internal-update",this.onRootUpdate),this.addEventListener("mousedown",this.preventFocusSteal),document.addEventListener("keydown",this.handleDocumentKeyDown,!0),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.root&&(this.id?this.root.contentId=this.id:this.id=this.root.contentId),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-select-internal-update",this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),this.removeEventListener("mousedown",this.preventFocusSteal),document.removeEventListener("keydown",this.handleDocumentKeyDown,!0),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.cleanupPosition?.(),super.disconnectedCallback()}firstUpdated(){this.root?.open&&this.activate()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"start"),this.root?.multiple?(this.setAttribute("aria-multiselectable","true"),this.setAttribute("data-multiple","")):(this.removeAttribute("aria-multiselectable"),this.removeAttribute("data-multiple")),this.hidden=!t,t?this.activate():this.deactivate(),this.requestUpdate()}activate(){this.cleanupPosition||!this.root?.triggerEl||(this.cleanupPosition=w(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"select"}),requestAnimationFrame(()=>this.seedActiveOption()))}seedActiveOption(){let t=this.root;if(!t?.open)return;let e=t.openIntent;t.openIntent="selected";let i=Array.from(this.querySelectorAll(T)),l=i[0],d=i[i.length-1],u=this.querySelector('[role="option"][data-state="checked"]'),c=e==="first"?l:e==="last"?d:u??l;c&&(t.setActiveId(c.id),D(this,c))}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0}render(){return m`<slot></slot>`}};o.styles=[A,v`
+var p=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var s=(a,n,t,e)=>{for(var i=e>1?void 0:e?f(n,t):n,l=a.length-1,d;l>=0;l--)(d=a[l])&&(i=(e?d(n,t,i):d(i))||i);return e&&i&&p(n,t,i),i};import{css as m,html as v,LitElement as g}from"lit";import{property as r}from"lit/decorators.js";import{closestThroughPortal as b}from"../internal/closest.js";import{customElement as y}from"../internal/define.js";import{dispatchEscapeKeyDown as E,dispatchOutside as u,focusOutsideTarget as O,triggerContains as L}from"../internal/dismiss.js";import{optOutBoolean as P,positionFloating as A}from"../internal/positioning.js";import{hiddenHostStyles as w}from"../internal/styles.js";import{SELECT_FAMILY as h}from"./family.js";import{OPTION_SELECTOR as T}from"./Select.js";function D(a,n){let t=a.querySelector('[data-part="viewport"]')??a;if(t===n||!t.contains(n))return;let e=t.getBoundingClientRect(),i=n.getBoundingClientRect();t.scrollTop+=i.top-e.top-(e.height-i.height)/2}var o=class extends g{constructor(){super(...arguments);this.side="bottom";this.align="start";this.sideOffset=4;this.alignOffset=0;this.avoidCollisions=!0;this.collisionPadding=8;this.matchWidth=!1;this.root=null;this.onRootUpdate=()=>this.syncHostState();this.preventFocusSteal=t=>t.preventDefault();this.handleOutsidePointerDown=t=>{if(!this.root?.open)return;let e=t.target;this.contains(e)||L(this.root.triggerEl,e)||u(this,"pointer-down-outside",t)&&this.root.setOpen(!1)};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let e=O(t);!e||this.contains(e)||this.root.contains(e)||u(this,"focus-outside",t)&&this.root.setOpen(!1)};this.handleDocumentKeyDown=t=>{t.key!=="Escape"||!this.root?.open||(t.preventDefault(),E(this,t)&&(this.root.setOpen(!1),this.root.focusTrigger()))}}connectedCallback(){super.connectedCallback(),this.setAttribute("role","listbox"),this.tabIndex=-1,this.root=b(this,h.selector),this.root&&(this.root.contentEl=this),this.root?.addEventListener(h.event,this.onRootUpdate),this.addEventListener("mousedown",this.preventFocusSteal),document.addEventListener("keydown",this.handleDocumentKeyDown,!0),document.addEventListener("pointerdown",this.handleOutsidePointerDown),document.addEventListener("focusin",this.handleOutsideFocus),this.root&&(this.id?this.root.contentId=this.id:this.id=this.root.contentId),this.syncHostState()}disconnectedCallback(){this.root?.removeEventListener(h.event,this.onRootUpdate),this.root?.contentEl===this&&(this.root.contentEl=null),this.removeEventListener("mousedown",this.preventFocusSteal),document.removeEventListener("keydown",this.handleDocumentKeyDown,!0),document.removeEventListener("pointerdown",this.handleOutsidePointerDown),document.removeEventListener("focusin",this.handleOutsideFocus),this.cleanupPosition?.(),super.disconnectedCallback()}firstUpdated(){this.root?.open&&this.activate()}syncHostState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("data-side",this.side??"bottom"),this.setAttribute("data-align",this.align??"start"),this.root?.loading?(this.setAttribute("aria-busy","true"),this.setAttribute("data-loading","")):(this.removeAttribute("aria-busy"),this.removeAttribute("data-loading")),this.root?.multiple?(this.setAttribute("aria-multiselectable","true"),this.setAttribute("data-multiple","")):(this.removeAttribute("aria-multiselectable"),this.removeAttribute("data-multiple")),this.hidden=!t,t?this.activate():this.deactivate(),this.requestUpdate()}activate(){this.cleanupPosition||!this.root?.triggerEl||(this.cleanupPosition=A(this.root.triggerEl,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"select"}),requestAnimationFrame(()=>this.seedActiveOption()))}seedActiveOption(){let t=this.root;if(!t?.open)return;let e=t.openIntent;t.openIntent="selected";let i=Array.from(this.querySelectorAll(T)),l=i[0],d=i[i.length-1],c=this.querySelector('[role="option"][data-state="checked"]:not([data-skdx-select-all])')??l;e==="first"?c=l:e==="last"&&(c=d),c&&(t.setActiveId(c.id),D(this,c))}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0}render(){return v`<slot></slot>`}};o.styles=[w,m`
       :host {
         display: block;
       }
-    `],n([r({type:String})],o.prototype,"side",2),n([r({type:String})],o.prototype,"align",2),n([r({type:Number,attribute:"side-offset"})],o.prototype,"sideOffset",2),n([r({type:Number,attribute:"align-offset"})],o.prototype,"alignOffset",2),n([r({converter:L,attribute:"avoid-collisions"})],o.prototype,"avoidCollisions",2),n([r({type:Number,attribute:"collision-padding"})],o.prototype,"collisionPadding",2),n([r({attribute:!1})],o.prototype,"collisionBoundary",2),o=n([b("skdx-select-content","select","content")],o);export{o as SkdxSelectContent};
+    `],s([r({type:String})],o.prototype,"side",2),s([r({type:String})],o.prototype,"align",2),s([r({type:Number,attribute:"side-offset"})],o.prototype,"sideOffset",2),s([r({type:Number,attribute:"align-offset"})],o.prototype,"alignOffset",2),s([r({converter:P,attribute:"avoid-collisions"})],o.prototype,"avoidCollisions",2),s([r({type:Number,attribute:"collision-padding"})],o.prototype,"collisionPadding",2),s([r({attribute:!1})],o.prototype,"collisionBoundary",2),s([r({type:Boolean,reflect:!0,attribute:"data-match-width"})],o.prototype,"matchWidth",2),o=s([y("skdx-select-content","select","content")],o);export{o as SkdxSelectContent};

package/dist/select/SelectEmpty.cjs

@@ -0,0 +1,5 @@
+"use strict";var a=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var f=(o,e)=>{for(var r in e)a(o,r,{get:e[r],enumerable:!0})},k=(o,e,r,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of v(e))!b.call(o,t)&&t!==r&&a(o,t,{get:()=>e[t],enumerable:!(s=p(e,t))||s.enumerable});return o};var C=o=>k(a({},"__esModule",{value:!0}),o),m=(o,e,r,s)=>{for(var t=s>1?void 0:s?p(e,r):e,c=o.length-1,d;c>=0;c--)(d=o[c])&&(t=(s?d(e,r,t):d(t))||t);return s&&t&&a(e,r,t),t};var L={};f(L,{SkdxSelectEmpty:()=>l});module.exports=C(L);var i=require("lit"),h=require("../internal/closest.cjs"),u=require("../internal/define.cjs"),n=require("./family.cjs");var l=class extends i.LitElement{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.requestUpdate()}connectedCallback(){super.connectedCallback(),this.root=(0,h.closestThroughPortal)(this,n.SELECT_FAMILY.selector),this.root?.addEventListener(n.SELECT_FAMILY.event,this.onRootUpdate),this.setAttribute("role","presentation"),this.setAttribute("aria-live","polite")}disconnectedCallback(){this.root?.removeEventListener(n.SELECT_FAMILY.event,this.onRootUpdate),super.disconnectedCallback()}render(){return!this.root||this.root.itemCount>0?i.html``:i.html`<slot></slot>`}};l.styles=i.css`
+    :host {
+      display: block;
+    }
+  `,l=m([(0,u.customElement)("skdx-select-empty","select","empty")],l);0&&(module.exports={SkdxSelectEmpty});

package/dist/select/SelectEmpty.d.cts

@@ -0,0 +1,22 @@
+import { LitElement, type TemplateResult } from 'lit';
+/**
+ * Message shown in place of the option list when the filter leaves no `<skdx-select-item>` standing, rendered beside the `role="listbox"` with `aria-live="polite"`.
+ *
+ * @example
+ * ```html
+ * <skdx-select-empty>No results found</skdx-select-empty>
+ * ```
+ */
+export declare class SkdxSelectEmpty extends LitElement {
+    static styles: import("lit").CSSResult;
+    private root;
+    private readonly onRootUpdate;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-select-empty': SkdxSelectEmpty;
+    }
+}

package/dist/select/SelectEmpty.d.ts

@@ -0,0 +1,22 @@
+import { LitElement, type TemplateResult } from 'lit';
+/**
+ * Message shown in place of the option list when the filter leaves no `<skdx-select-item>` standing, rendered beside the `role="listbox"` with `aria-live="polite"`.
+ *
+ * @example
+ * ```html
+ * <skdx-select-empty>No results found</skdx-select-empty>
+ * ```
+ */
+export declare class SkdxSelectEmpty extends LitElement {
+    static styles: import("lit").CSSResult;
+    private root;
+    private readonly onRootUpdate;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-select-empty': SkdxSelectEmpty;
+    }
+}

package/dist/select/SelectEmpty.js

@@ -0,0 +1,5 @@
+var p=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var c=(s,t,i,r)=>{for(var e=r>1?void 0:r?m(t,i):t,l=s.length-1,a;l>=0;l--)(a=s[l])&&(e=(r?a(t,i,e):a(e))||e);return r&&e&&p(t,i,e),e};import{css as h,html as d,LitElement as u}from"lit";import{closestThroughPortal as v}from"../internal/closest.js";import{customElement as b}from"../internal/define.js";import{SELECT_FAMILY as n}from"./family.js";var o=class extends u{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.requestUpdate()}connectedCallback(){super.connectedCallback(),this.root=v(this,n.selector),this.root?.addEventListener(n.event,this.onRootUpdate),this.setAttribute("role","presentation"),this.setAttribute("aria-live","polite")}disconnectedCallback(){this.root?.removeEventListener(n.event,this.onRootUpdate),super.disconnectedCallback()}render(){return!this.root||this.root.itemCount>0?d``:d`<slot></slot>`}};o.styles=h`
+    :host {
+      display: block;
+    }
+  `,o=c([b("skdx-select-empty","select","empty")],o);export{o as SkdxSelectEmpty};

package/dist/select/SelectGroup.cjs

@@ -1,4 +1,4 @@
-"use strict";var i=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var u=Object.prototype.hasOwnProperty;var v=(r,e)=>{for(var t in e)i(r,t,{get:e[t],enumerable:!0})},f=(r,e,t,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let l of g(e))!u.call(r,l)&&l!==t&&i(r,l,{get:()=>e[l],enumerable:!(o=m(e,l))||o.enumerable});return r};var y=r=>f(i({},"__esModule",{value:!0}),r),c=(r,e,t,o)=>{for(var l=o>1?void 0:o?m(e,t):e,n=r.length-1,d;n>=0;n--)(d=r[n])&&(l=(o?d(e,t,l):d(l))||l);return o&&l&&i(e,t,l),l};var L={};v(L,{SkdxSelectGroup:()=>s});module.exports=y(L);var a=require("lit"),b=require("../internal/define.cjs"),h=require("../internal/ids.cjs"),p=require("../internal/styles.cjs");var s=class extends a.LitElement{constructor(){super(...arguments);this.onSlotChange=()=>this.nameFromLabel()}connectedCallback(){super.connectedCallback(),this.setAttribute("role","group"),this.nameFromLabel()}nameFromLabel(){let t=this.querySelector("skdx-select-label");if(!t){this.removeAttribute("aria-labelledby");return}t.id||(t.id=(0,h.nextId)("skdx-select-label")),this.setAttribute("aria-labelledby",t.id)}render(){return a.html`<slot @slotchange=${this.onSlotChange}></slot>`}};s.styles=[p.hiddenHostStyles,a.css`
+"use strict";var i=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var v=(r,e)=>{for(var t in e)i(r,t,{get:e[t],enumerable:!0})},y=(r,e,t,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let l of u(e))!g.call(r,l)&&l!==t&&i(r,l,{get:()=>e[l],enumerable:!(o=d(e,l))||o.enumerable});return r};var f=r=>y(i({},"__esModule",{value:!0}),r),c=(r,e,t,o)=>{for(var l=o>1?void 0:o?d(e,t):e,n=r.length-1,m;n>=0;n--)(m=r[n])&&(l=(o?m(e,t,l):m(l))||l);return o&&l&&i(e,t,l),l};var L={};v(L,{SkdxSelectGroup:()=>s});module.exports=f(L);var a=require("lit"),b=require("../internal/define.cjs"),p=require("../internal/ids.cjs"),h=require("../internal/styles.cjs");var s=class extends a.LitElement{constructor(){super(...arguments);this.onSlotChange=()=>this.nameFromLabel()}connectedCallback(){super.connectedCallback(),this.setAttribute("role","group"),this.nameFromLabel()}nameFromLabel(){let t=this.querySelector("skdx-select-label");if(!t){this.removeAttribute("aria-labelledby");return}t.id||(t.id=(0,p.nextId)("skdx-select-label")),this.setAttribute("aria-labelledby",t.id)}render(){return a.html`<slot @slotchange=${this.onSlotChange}></slot>`}};s.styles=[h.hiddenHostStyles,a.css`
       :host {
         display: block;
       }

package/dist/select/SelectGroup.d.cts

@@ -1,27 +1,13 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
  * Groups related SelectItems under a SelectLabel (role="group"). Automatically wires aria-labelledby. Label is required inside Group.
  */
 export declare class SkdxSelectGroup extends LitElement {
     static styles: import("lit").CSSResult[];
     connectedCallback(): void;
-    /**
-     * Re-runs the wiring whenever the light-DOM children change, so a label
-     * added after the group connected — an async framework render, or the
-     * parser reaching the label after the group's start tag — still names it.
-     */
     private readonly onSlotChange;
-    /**
-     * Points `aria-labelledby` at the group's own `<skdx-select-label>`,
-     * minting an id for it if it has none.
-     *
-     * Uses `querySelector` rather than a registration handshake, since the
-     * label is a light-DOM sibling with no context channel to register
-     * through. Scoped to the group's own subtree, so a nested group's label
-     * never names its ancestor.
-     */
     private nameFromLabel;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/select/SelectGroup.d.ts

@@ -1,27 +1,13 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
  * Groups related SelectItems under a SelectLabel (role="group"). Automatically wires aria-labelledby. Label is required inside Group.
  */
 export declare class SkdxSelectGroup extends LitElement {
     static styles: import("lit").CSSResult[];
     connectedCallback(): void;
-    /**
-     * Re-runs the wiring whenever the light-DOM children change, so a label
-     * added after the group connected — an async framework render, or the
-     * parser reaching the label after the group's start tag — still names it.
-     */
     private readonly onSlotChange;
-    /**
-     * Points `aria-labelledby` at the group's own `<skdx-select-label>`,
-     * minting an id for it if it has none.
-     *
-     * Uses `querySelector` rather than a registration handshake, since the
-     * label is a light-DOM sibling with no context channel to register
-     * through. Scoped to the group's own subtree, so a nested group's label
-     * never names its ancestor.
-     */
     private nameFromLabel;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/select/SelectGroup.js

@@ -1,5 +1,5 @@
-var d=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var n=(s,l,e,o)=>{for(var t=o>1?void 0:o?m(l,e):l,a=s.length-1,i;a>=0;a--)(i=s[a])&&(t=(o?i(l,e,t):i(t))||t);return o&&t&&d(l,e,t),t};import{css as c,html as b,LitElement as h}from"lit";import{customElement as p}from"../internal/define.js";import{nextId as g}from"../internal/ids.js";import{hiddenHostStyles as u}from"../internal/styles.js";var r=class extends h{constructor(){super(...arguments);this.onSlotChange=()=>this.nameFromLabel()}connectedCallback(){super.connectedCallback(),this.setAttribute("role","group"),this.nameFromLabel()}nameFromLabel(){let e=this.querySelector("skdx-select-label");if(!e){this.removeAttribute("aria-labelledby");return}e.id||(e.id=g("skdx-select-label")),this.setAttribute("aria-labelledby",e.id)}render(){return b`<slot @slotchange=${this.onSlotChange}></slot>`}};r.styles=[u,c`
+var m=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var n=(s,l,e,o)=>{for(var t=o>1?void 0:o?d(l,e):l,a=s.length-1,i;a>=0;a--)(i=s[a])&&(t=(o?i(l,e,t):i(t))||t);return o&&t&&m(l,e,t),t};import{css as c,html as b,LitElement as p}from"lit";import{customElement as h}from"../internal/define.js";import{nextId as u}from"../internal/ids.js";import{hiddenHostStyles as g}from"../internal/styles.js";var r=class extends p{constructor(){super(...arguments);this.onSlotChange=()=>this.nameFromLabel()}connectedCallback(){super.connectedCallback(),this.setAttribute("role","group"),this.nameFromLabel()}nameFromLabel(){let e=this.querySelector("skdx-select-label");if(!e){this.removeAttribute("aria-labelledby");return}e.id||(e.id=u("skdx-select-label")),this.setAttribute("aria-labelledby",e.id)}render(){return b`<slot @slotchange=${this.onSlotChange}></slot>`}};r.styles=[g,c`
       :host {
         display: block;
       }
-    `],r=n([p("skdx-select-group","select","group")],r);export{r as SkdxSelectGroup};
+    `],r=n([h("skdx-select-group","select","group")],r);export{r as SkdxSelectGroup};

package/dist/select/SelectIcon.cjs

@@ -1,4 +1,8 @@
-"use strict";var n=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var h=Object.prototype.hasOwnProperty;var u=(t,e)=>{for(var r in e)n(t,r,{get:e[r],enumerable:!0})},E=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of f(e))!h.call(t,s)&&s!==r&&n(t,s,{get:()=>e[s],enumerable:!(i=p(e,s))||i.enumerable});return t};var g=t=>E(n({},"__esModule",{value:!0}),t),c=(t,e,r,i)=>{for(var s=i>1?void 0:i?p(e,r):e,o=t.length-1,m;o>=0;o--)(m=t[o])&&(s=(i?m(e,r,s):m(s))||s);return i&&s&&n(e,r,s),s};var v={};u(v,{SkdxSelectIcon:()=>a});module.exports=g(v);var l=require("lit"),d=require("../internal/define.cjs");var a=class extends l.LitElement{render(){return l.html`<span aria-hidden="true" part="icon"><slot>▾</slot></span>`}};a.styles=l.css`
+"use strict";var n=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var T=(s,e)=>{for(var l in e)n(s,l,{get:e[l],enumerable:!0})},h=(s,e,l,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of u(e))!f.call(s,t)&&t!==l&&n(s,t,{get:()=>e[t],enumerable:!(r=p(e,t))||r.enumerable});return s};var y=s=>h(n({},"__esModule",{value:!0}),s),c=(s,e,l,r)=>{for(var t=r>1?void 0:r?p(e,l):e,o=s.length-1,m;o>=0;o--)(m=s[o])&&(t=(r?m(e,l,t):m(t))||t);return r&&t&&n(e,l,t),t};var E={};T(E,{SkdxSelectIcon:()=>a});module.exports=y(E);var i=require("lit"),d=require("../internal/define.cjs");var a=class extends i.LitElement{render(){return i.html`<span
+      aria-hidden="true"
+      part="icon"
+      ><slot>▾</slot></span
+    >`}};a.styles=i.css`
     :host {
       display: inline-flex;
     }

package/dist/select/SelectIcon.d.cts

@@ -1,10 +1,10 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
  * Decorative indicator inside a SelectTrigger (e.g. a chevron). Renders aria-hidden span defaulting to ▾.
  */
 export declare class SkdxSelectIcon extends LitElement {
     static styles: import("lit").CSSResult;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/select/SelectIcon.d.ts

@@ -1,10 +1,10 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
  * Decorative indicator inside a SelectTrigger (e.g. a chevron). Renders aria-hidden span defaulting to ▾.
  */
 export declare class SkdxSelectIcon extends LitElement {
     static styles: import("lit").CSSResult;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/select/SelectIcon.js

@@ -1,5 +1,9 @@
-var m=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var o=(i,t,a,r)=>{for(var e=r>1?void 0:r?p(t,a):t,l=i.length-1,n;l>=0;l--)(n=i[l])&&(e=(r?n(t,a,e):n(e))||e);return r&&e&&m(t,a,e),e};import{css as c,html as d,LitElement as f}from"lit";import{customElement as h}from"../internal/define.js";var s=class extends f{render(){return d`<span aria-hidden="true" part="icon"><slot>▾</slot></span>`}};s.styles=c`
+var m=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var o=(r,s,a,l)=>{for(var e=l>1?void 0:l?p(s,a):s,i=r.length-1,n;i>=0;i--)(n=r[i])&&(e=(l?n(s,a,e):n(e))||e);return l&&e&&m(s,a,e),e};import{css as c,html as d,LitElement as u}from"lit";import{customElement as f}from"../internal/define.js";var t=class extends u{render(){return d`<span
+      aria-hidden="true"
+      part="icon"
+      ><slot>▾</slot></span
+    >`}};t.styles=c`
     :host {
       display: inline-flex;
     }
-  `,s=o([h("skdx-select-icon","select","icon")],s);export{s as SkdxSelectIcon};
+  `,t=o([f("skdx-select-icon","select","icon")],t);export{t as SkdxSelectIcon};

package/dist/select/SelectInput.cjs

@@ -0,0 +1,30 @@
+"use strict";var d=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var k=(i,r)=>{for(var e in r)d(i,e,{get:r[e],enumerable:!0})},$=(i,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let n of b(r))!g.call(i,n)&&n!==e&&d(i,n,{get:()=>r[n],enumerable:!(t=f(r,n))||t.enumerable});return i};var I=i=>$(d({},"__esModule",{value:!0}),i),h=(i,r,e,t)=>{for(var n=t>1?void 0:t?f(r,e):r,a=i.length-1,l;a>=0;a--)(l=i[a])&&(n=(t?l(r,e,n):l(n))||n);return t&&n&&d(r,e,n),n};var x={};k(x,{SkdxSelectInput:()=>s});module.exports=I(x);var o=require("lit"),v=require("lit/decorators.js"),m=require("../internal/aria-label.cjs"),u=require("../internal/define.cjs"),y=require("../internal/light-dom-styles.cjs"),p=require("./family.cjs"),E=require("./selection-keys.cjs");var L={open:!1,loading:!1,disabled:!1,readOnly:!1,invalid:!1,required:!1,inputValue:"",contentId:null,activeId:null},s=class extends o.LitElement{constructor(){super(...arguments);this.placeholder="";this.root=null;this.label=null;this.onRootUpdate=()=>this.requestUpdate();this.move=e=>{let t=this.root;if(!t)return null;let n=this.options();if(n.length===0)return null;let a=n.findIndex(c=>c.id===t.activeId),l=Math.min(n.length-1,Math.max(0,a+e));return this.activate(n[l])};this.handleInput=e=>{let t=this.root;t&&(t.setInputValue(e.target.value),t.open||t.setOpen(!0))};this.handleBlur=()=>{this.root?.setOpen(!1)};this.handleKeyDown=e=>{let t=this.root;if(!(!t||t.disabled)&&!(0,E.handleSelectionKey)(t,e,{move:this.move}))if(e.key==="ArrowDown"||e.key==="ArrowUp"){e.preventDefault();let n=e.key==="ArrowDown"?1:-1;t.open?this.move(n):(t.openIntent=n===1?"first":"last",t.setOpen(!0))}else e.key==="Home"||e.key==="End"?this.onEdgeKey(t,e):e.key==="Enter"?this.onEnter(t,e):e.key==="Escape"?this.onEscape(t,e):e.key==="Backspace"&&t.inputValue===""&&t.removeLast()}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.label??(this.label=(0,m.takeHostAriaLabel)(this)),this.root=p.SELECT_FAMILY.root(this),this.root?.addEventListener(p.SELECT_FAMILY.event,this.onRootUpdate),(0,y.installLightDomStyles)()}disconnectedCallback(){this.root?.removeEventListener(p.SELECT_FAMILY.event,this.onRootUpdate),this.root?.triggerEl===this.control&&(this.root.triggerEl=null),super.disconnectedCallback()}focus(e){this.control?.focus(e)}get control(){return this.querySelector(":scope > input")}firstUpdated(){let e=this.root,t=this.control;!e||!t||(0,u.whenUpgraded)(e,()=>{e.triggerEl=t})}options(){return this.root?.visibleOptions()??[]}activate(e){return e?(this.root?.setActiveId(e.id),e.scrollIntoView?.({block:"nearest"}),e):null}onEdgeKey(e,t){if(!e.open)return;t.preventDefault();let n=this.options();this.activate(t.key==="Home"?n[0]:n[n.length-1])}onEnter(e,t){let n=e.activeId;if(n===null)return;let l=this.options().find(c=>c.id===n)?.getAttribute("data-value");l!=null&&(t.preventDefault(),e.selectItem(l,"keyboard"),e.closesOnSelect&&e.setOpen(!1))}onEscape(e,t){e.open&&!e.contentEl&&(t.preventDefault(),e.setOpen(!1))}render(){let e=this.root??L;return o.html`
+      <input
+        part="input"
+        type="text"
+        role="combobox"
+        aria-label=${this.label??o.nothing}
+        placeholder=${this.placeholder}
+        .value=${e.inputValue}
+        aria-expanded=${e.open}
+        aria-controls=${e.contentId??o.nothing}
+        aria-haspopup="listbox"
+        aria-autocomplete="list"
+        aria-activedescendant=${e.activeId??o.nothing}
+        aria-busy=${e.loading?"true":o.nothing}
+        aria-required=${e.required||o.nothing}
+        aria-invalid=${e.invalid?"true":o.nothing}
+        aria-readonly=${e.readOnly?"true":o.nothing}
+        autocomplete="off"
+        ?disabled=${e.disabled}
+        ?readonly=${e.readOnly}
+        data-state=${e.open?"open":"closed"}
+        data-disabled=${e.disabled?"":o.nothing}
+        data-readonly=${e.readOnly?"":o.nothing}
+        data-invalid=${e.invalid?"":o.nothing}
+        data-loading=${e.loading?"":o.nothing}
+        @input=${this.handleInput}
+        @blur=${this.handleBlur}
+        @keydown=${this.handleKeyDown}
+      />
+    `}};h([(0,v.property)({type:String})],s.prototype,"placeholder",2),s=h([(0,u.customElement)("skdx-select-input","select","input")],s);0&&(module.exports={SkdxSelectInput});

package/dist/select/SelectInput.d.cts

@@ -0,0 +1,53 @@
+import { LitElement, type TemplateResult } from 'lit';
+/**
+ * The filter text field a `filterable` `<skdx-select>` is driven from, rendering an `<input type="text" role="combobox">` with `aria-expanded`, `aria-controls`, `aria-autocomplete="list"`, and `aria-activedescendant` tracking the virtually-focused option.
+ *
+ * While the listbox is open, these keys extend a `multiple` selection:
+ *
+ * | Key | Effect |
+ * | --- | --- |
+ * | Shift+Arrow Down / Up | moves the highlight one enabled option and toggles it |
+ * | Shift+Space | selects every enabled option between the last one toggled and the highlighted one |
+ * | Control+Shift+Home / End | selects every enabled option from the highlight to that edge |
+ * | Home / End | moves the highlight to the first / last enabled option |
+ *
+ * @example
+ * ```html
+ * <skdx-select-input aria-label="Skills" placeholder="Add a skill…"></skdx-select-input>
+ * ```
+ *
+ * @csspart input - The native `<input>` element; `::part(input)` cannot reach it since this renders into light DOM.
+ */
+export declare class SkdxSelectInput extends LitElement {
+    /** Light DOM, so the IDREFs between this field and the listbox resolve in one tree. */
+    protected createRenderRoot(): HTMLElement;
+    /**
+     * Text shown while the field is empty, mirroring the root's own placeholder.
+     * @default '' — no placeholder is rendered.
+     */
+    placeholder: string;
+    private root;
+    private label;
+    private readonly onRootUpdate;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /** Focus lands on the native `<input>`, which is where the combobox role and real focus live. */
+    focus(options?: FocusOptions): void;
+    private get control();
+    protected firstUpdated(): void;
+    private options;
+    private activate;
+    private readonly move;
+    private readonly handleInput;
+    private readonly handleBlur;
+    private readonly handleKeyDown;
+    private onEdgeKey;
+    private onEnter;
+    private onEscape;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-select-input': SkdxSelectInput;
+    }
+}

package/dist/select/SelectInput.d.ts

@@ -0,0 +1,53 @@
+import { LitElement, type TemplateResult } from 'lit';
+/**
+ * The filter text field a `filterable` `<skdx-select>` is driven from, rendering an `<input type="text" role="combobox">` with `aria-expanded`, `aria-controls`, `aria-autocomplete="list"`, and `aria-activedescendant` tracking the virtually-focused option.
+ *
+ * While the listbox is open, these keys extend a `multiple` selection:
+ *
+ * | Key | Effect |
+ * | --- | --- |
+ * | Shift+Arrow Down / Up | moves the highlight one enabled option and toggles it |
+ * | Shift+Space | selects every enabled option between the last one toggled and the highlighted one |
+ * | Control+Shift+Home / End | selects every enabled option from the highlight to that edge |
+ * | Home / End | moves the highlight to the first / last enabled option |
+ *
+ * @example
+ * ```html
+ * <skdx-select-input aria-label="Skills" placeholder="Add a skill…"></skdx-select-input>
+ * ```
+ *
+ * @csspart input - The native `<input>` element; `::part(input)` cannot reach it since this renders into light DOM.
+ */
+export declare class SkdxSelectInput extends LitElement {
+    /** Light DOM, so the IDREFs between this field and the listbox resolve in one tree. */
+    protected createRenderRoot(): HTMLElement;
+    /**
+     * Text shown while the field is empty, mirroring the root's own placeholder.
+     * @default '' — no placeholder is rendered.
+     */
+    placeholder: string;
+    private root;
+    private label;
+    private readonly onRootUpdate;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /** Focus lands on the native `<input>`, which is where the combobox role and real focus live. */
+    focus(options?: FocusOptions): void;
+    private get control();
+    protected firstUpdated(): void;
+    private options;
+    private activate;
+    private readonly move;
+    private readonly handleInput;
+    private readonly handleBlur;
+    private readonly handleKeyDown;
+    private onEdgeKey;
+    private onEnter;
+    private onEscape;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-select-input': SkdxSelectInput;
+    }
+}

package/dist/select/SelectInput.js

@@ -0,0 +1,30 @@
+var c=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var p=(s,l,e,t)=>{for(var n=t>1?void 0:t?h(l,e):l,i=s.length-1,r;i>=0;i--)(r=s[i])&&(n=(t?r(l,e,n):r(n))||n);return t&&n&&c(l,e,n),n};import{html as f,LitElement as v,nothing as o}from"lit";import{property as m}from"lit/decorators.js";import{takeHostAriaLabel as y}from"../internal/aria-label.js";import{customElement as E,whenUpgraded as b}from"../internal/define.js";import{installLightDomStyles as g}from"../internal/light-dom-styles.js";import{SELECT_FAMILY as u}from"./family.js";import{handleSelectionKey as k}from"./selection-keys.js";var $={open:!1,loading:!1,disabled:!1,readOnly:!1,invalid:!1,required:!1,inputValue:"",contentId:null,activeId:null},a=class extends v{constructor(){super(...arguments);this.placeholder="";this.root=null;this.label=null;this.onRootUpdate=()=>this.requestUpdate();this.move=e=>{let t=this.root;if(!t)return null;let n=this.options();if(n.length===0)return null;let i=n.findIndex(d=>d.id===t.activeId),r=Math.min(n.length-1,Math.max(0,i+e));return this.activate(n[r])};this.handleInput=e=>{let t=this.root;t&&(t.setInputValue(e.target.value),t.open||t.setOpen(!0))};this.handleBlur=()=>{this.root?.setOpen(!1)};this.handleKeyDown=e=>{let t=this.root;if(!(!t||t.disabled)&&!k(t,e,{move:this.move}))if(e.key==="ArrowDown"||e.key==="ArrowUp"){e.preventDefault();let n=e.key==="ArrowDown"?1:-1;t.open?this.move(n):(t.openIntent=n===1?"first":"last",t.setOpen(!0))}else e.key==="Home"||e.key==="End"?this.onEdgeKey(t,e):e.key==="Enter"?this.onEnter(t,e):e.key==="Escape"?this.onEscape(t,e):e.key==="Backspace"&&t.inputValue===""&&t.removeLast()}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.label??(this.label=y(this)),this.root=u.root(this),this.root?.addEventListener(u.event,this.onRootUpdate),g()}disconnectedCallback(){this.root?.removeEventListener(u.event,this.onRootUpdate),this.root?.triggerEl===this.control&&(this.root.triggerEl=null),super.disconnectedCallback()}focus(e){this.control?.focus(e)}get control(){return this.querySelector(":scope > input")}firstUpdated(){let e=this.root,t=this.control;!e||!t||b(e,()=>{e.triggerEl=t})}options(){return this.root?.visibleOptions()??[]}activate(e){return e?(this.root?.setActiveId(e.id),e.scrollIntoView?.({block:"nearest"}),e):null}onEdgeKey(e,t){if(!e.open)return;t.preventDefault();let n=this.options();this.activate(t.key==="Home"?n[0]:n[n.length-1])}onEnter(e,t){let n=e.activeId;if(n===null)return;let r=this.options().find(d=>d.id===n)?.getAttribute("data-value");r!=null&&(t.preventDefault(),e.selectItem(r,"keyboard"),e.closesOnSelect&&e.setOpen(!1))}onEscape(e,t){e.open&&!e.contentEl&&(t.preventDefault(),e.setOpen(!1))}render(){let e=this.root??$;return f`
+      <input
+        part="input"
+        type="text"
+        role="combobox"
+        aria-label=${this.label??o}
+        placeholder=${this.placeholder}
+        .value=${e.inputValue}
+        aria-expanded=${e.open}
+        aria-controls=${e.contentId??o}
+        aria-haspopup="listbox"
+        aria-autocomplete="list"
+        aria-activedescendant=${e.activeId??o}
+        aria-busy=${e.loading?"true":o}
+        aria-required=${e.required||o}
+        aria-invalid=${e.invalid?"true":o}
+        aria-readonly=${e.readOnly?"true":o}
+        autocomplete="off"
+        ?disabled=${e.disabled}
+        ?readonly=${e.readOnly}
+        data-state=${e.open?"open":"closed"}
+        data-disabled=${e.disabled?"":o}
+        data-readonly=${e.readOnly?"":o}
+        data-invalid=${e.invalid?"":o}
+        data-loading=${e.loading?"":o}
+        @input=${this.handleInput}
+        @blur=${this.handleBlur}
+        @keydown=${this.handleKeyDown}
+      />
+    `}};p([m({type:String})],a.prototype,"placeholder",2),a=p([E("skdx-select-input","select","input")],a);export{a as SkdxSelectInput};

package/dist/select/SelectItem.cjs

@@ -1,5 +1,5 @@
-"use strict";var h=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var A=(s,e)=>{for(var t in e)h(s,t,{get:e[t],enumerable:!0})},y=(s,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of f(e))!g.call(s,i)&&i!==t&&h(s,i,{get:()=>e[i],enumerable:!(r=v(e,i))||r.enumerable});return s};var k=s=>y(h({},"__esModule",{value:!0}),s),l=(s,e,t,r)=>{for(var i=r>1?void 0:r?v(e,t):e,c=s.length-1,u;c>=0;c--)(u=s[c])&&(i=(r?u(e,t,i):u(i))||i);return r&&i&&h(e,t,i),i};var x={};A(x,{SkdxSelectItem:()=>a});module.exports=k(x);var o=require("lit"),n=require("lit/decorators.js"),p=require("../internal/closest.cjs"),d=require("../internal/define.cjs"),b=require("../internal/ids.cjs"),m=require("../internal/styles.cjs");var a=class extends o.LitElement{constructor(){super(...arguments);this.value="";this.disabled=!1;this.root=null;this.onRootUpdate=()=>this.syncSelectedState();this.handleClick=()=>{this.disabled||!this.root||(this.root.selectItem(this.value),this.root.closesOnSelect&&(this.root.setOpen(!1),this.root.focusTrigger()))};this.handlePointerEnter=()=>{this.disabled||this.root?.setActiveId(this.id)}}connectedCallback(){super.connectedCallback(),this.id||(this.id=(0,b.nextId)("skdx-select-item")),this.setAttribute("role","option"),this.addEventListener("click",this.handleClick),this.addEventListener("pointerenter",this.handlePointerEnter),this.root=(0,p.closestThroughPortal)(this,"skdx-select"),this.root?.addEventListener("skdx-select-internal-update",this.onRootUpdate),this.syncSelectedState(),this.registerLabel()}disconnectedCallback(){this.root?.removeEventListener("skdx-select-internal-update",this.onRootUpdate),super.disconnectedCallback()}updated(t){(t.has("disabled")||t.has("value"))&&this.syncSelectedState(),(t.has("value")||t.has("textValue"))&&this.registerLabel()}syncSelectedState(){this.setAttribute("data-value",this.value),this.disabled?(this.setAttribute("data-disabled",""),this.setAttribute("aria-disabled","true")):(this.removeAttribute("data-disabled"),this.removeAttribute("aria-disabled"));let t=this.root;if(!t){this.setAttribute("aria-selected","false"),this.setAttribute("data-state","unchecked"),this.removeAttribute("data-highlighted");return}(0,d.whenUpgraded)(t,()=>{let r=t.isSelected(this.value);this.setAttribute("aria-selected",String(r)),this.setAttribute("data-state",r?"checked":"unchecked"),t.activeId===this.id?this.setAttribute("data-highlighted",""):this.removeAttribute("data-highlighted")})}registerLabel(){let t=this.root;t&&(0,d.whenUpgraded)(t,()=>t.registerOptionLabel(this.value,this.textValue??this.textContent?.trim()??"")),this.textValue===void 0?this.removeAttribute("data-text-value"):this.setAttribute("data-text-value",this.textValue)}render(){return o.html`<slot></slot>`}};a.styles=[m.hiddenHostStyles,o.css`
+"use strict";var h=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var A=Object.prototype.hasOwnProperty;var x=(s,i)=>{for(var t in i)h(s,t,{get:i[t],enumerable:!0})},y=(s,i,t,r)=>{if(i&&typeof i=="object"||typeof i=="function")for(let e of g(i))!A.call(s,e)&&e!==t&&h(s,e,{get:()=>i[e],enumerable:!(r=p(i,e))||r.enumerable});return s};var E=s=>y(h({},"__esModule",{value:!0}),s),l=(s,i,t,r)=>{for(var e=r>1?void 0:r?p(i,t):i,c=s.length-1,v;c>=0;c--)(v=s[c])&&(e=(r?v(i,t,e):v(e))||e);return r&&e&&h(i,t,e),e};var L={};x(L,{SkdxSelectItem:()=>o});module.exports=E(L);var a=require("lit"),d=require("lit/decorators.js"),b=require("../internal/closest.cjs"),n=require("../internal/define.cjs"),m=require("../internal/ids.cjs"),f=require("../internal/styles.cjs"),u=require("./family.cjs");var o=class extends a.LitElement{constructor(){super(...arguments);this.value="";this.disabled=!1;this.root=null;this.onRootUpdate=()=>this.syncSelectedState();this.handleClick=()=>{this.isInert||!this.root||(this.root.selectItem(this.value,"pointer"),this.root.closesOnSelect&&(this.root.setOpen(!1),this.root.focusTrigger()))};this.handlePointerEnter=()=>{this.isInert||this.root?.setActiveId(this.id)}}connectedCallback(){super.connectedCallback(),this.id||(this.id=(0,m.nextId)("skdx-select-item")),this.setAttribute("role","option"),this.addEventListener("click",this.handleClick),this.addEventListener("pointerenter",this.handlePointerEnter),this.root=(0,b.closestThroughPortal)(this,u.SELECT_FAMILY.selector),this.root?.addEventListener(u.SELECT_FAMILY.event,this.onRootUpdate),this.syncSelectedState(),this.registerLabel()}disconnectedCallback(){this.root?.unregisterItem(this.id),this.root?.removeEventListener(u.SELECT_FAMILY.event,this.onRootUpdate),this.removeEventListener("click",this.handleClick),this.removeEventListener("pointerenter",this.handlePointerEnter),super.disconnectedCallback()}updated(t){(t.has("disabled")||t.has("value"))&&this.syncSelectedState(),(t.has("value")||t.has("textValue"))&&this.registerLabel()}get itemText(){return this.textValue??this.textContent?.trim()??""}syncSelectedState(){this.setAttribute("data-value",this.value);let t=this.root;if(!t){this.setInert(this.disabled),this.setAttribute("aria-selected","false"),this.setAttribute("data-state","unchecked"),this.removeAttribute("data-highlighted");return}(0,n.whenUpgraded)(t,()=>{let r=t.matchesFilter(this.itemText);if(this.hidden=!r,!r){this.hasAttribute("role")&&this.removeAttribute("role"),t.unregisterItem(this.id);return}this.getAttribute("role")!=="option"&&this.setAttribute("role","option"),t.registerItem(this.id,{value:this.value,text:this.itemText});let e=t.isSelected(this.value);this.setInert(this.disabled||t.atMax&&!e),this.setAttribute("aria-selected",String(e)),this.setAttribute("data-state",e?"checked":"unchecked"),t.activeId===this.id?this.setAttribute("data-highlighted",""):this.removeAttribute("data-highlighted")})}setInert(t){t?(this.setAttribute("data-disabled",""),this.setAttribute("aria-disabled","true")):(this.removeAttribute("data-disabled"),this.removeAttribute("aria-disabled"))}get isInert(){if(this.disabled)return!0;let t=this.root;return t!==null&&t.atMax&&!t.isSelected(this.value)}registerLabel(){let t=this.root;t&&(0,n.whenUpgraded)(t,()=>t.registerOptionLabel(this.value,this.textValue??this.textContent?.trim()??"")),this.textValue===void 0?this.removeAttribute("data-text-value"):this.setAttribute("data-text-value",this.textValue)}render(){return a.html`<slot></slot>`}};o.styles=[f.hiddenHostStyles,a.css`
       :host {
         display: block;
       }
-    `],l([(0,n.property)({type:String})],a.prototype,"value",2),l([(0,n.property)({type:Boolean,reflect:!0})],a.prototype,"disabled",2),l([(0,n.property)({type:String,attribute:"text-value"})],a.prototype,"textValue",2),a=l([(0,d.customElement)("skdx-select-item","select","item")],a);0&&(module.exports={SkdxSelectItem});
+    `],l([(0,d.property)({type:String})],o.prototype,"value",2),l([(0,d.property)({type:Boolean,reflect:!0})],o.prototype,"disabled",2),l([(0,d.property)({type:String,attribute:"text-value"})],o.prototype,"textValue",2),o=l([(0,n.customElement)("skdx-select-item","select","item")],o);0&&(module.exports={SkdxSelectItem});

package/dist/select/SelectItem.d.cts

@@ -1,8 +1,5 @@
-import { LitElement } from 'lit';
-/**
- * One selectable option within SelectContent (role="option"). Captures slotted text for SelectValue.
- * Not focusable; DOM focus stays on trigger per the combobox pattern. Renders aria-selected, data-state, data-highlighted.
- */
+import { LitElement, type TemplateResult } from 'lit';
+/** One selectable option within SelectContent (`role="option"`), capturing slotted text for SelectValue. */
 export declare class SkdxSelectItem extends LitElement {
     static styles: import("lit").CSSResult[];
     /**
@@ -24,12 +21,15 @@ export declare class SkdxSelectItem extends LitElement {
     connectedCallback(): void;
     disconnectedCallback(): void;
     protected updated(changed: Map<string, unknown>): void;
+    private get itemText();
     private syncSelectedState;
+    private setInert;
+    /** @internal Whether this option refuses selection — its own `disabled`, or the root's cap. */
+    get isInert(): boolean;
     private registerLabel;
     private readonly handleClick;
-    /** Moves the virtual highlight, where this used to move real DOM focus. */
     private readonly handlePointerEnter;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/select/SelectItem.d.ts

@@ -1,8 +1,5 @@
-import { LitElement } from 'lit';
-/**
- * One selectable option within SelectContent (role="option"). Captures slotted text for SelectValue.
- * Not focusable; DOM focus stays on trigger per the combobox pattern. Renders aria-selected, data-state, data-highlighted.
- */
+import { LitElement, type TemplateResult } from 'lit';
+/** One selectable option within SelectContent (`role="option"`), capturing slotted text for SelectValue. */
 export declare class SkdxSelectItem extends LitElement {
     static styles: import("lit").CSSResult[];
     /**
@@ -24,12 +21,15 @@ export declare class SkdxSelectItem extends LitElement {
     connectedCallback(): void;
     disconnectedCallback(): void;
     protected updated(changed: Map<string, unknown>): void;
+    private get itemText();
     private syncSelectedState;
+    private setInert;
+    /** @internal Whether this option refuses selection — its own `disabled`, or the root's cap. */
+    get isInert(): boolean;
     private registerLabel;
     private readonly handleClick;
-    /** Moves the virtual highlight, where this used to move real DOM focus. */
     private readonly handlePointerEnter;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/select/SelectItem.js

@@ -1,5 +1,5 @@
-var c=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var a=(o,r,t,i)=>{for(var s=i>1?void 0:i?u(r,t):r,l=o.length-1,d;l>=0;l--)(d=o[l])&&(s=(i?d(r,t,s):d(s))||s);return i&&s&&c(r,t,s),s};import{css as v,html as p,LitElement as b}from"lit";import{property as h}from"lit/decorators.js";import{closestThroughPortal as m}from"../internal/closest.js";import{customElement as f,whenUpgraded as n}from"../internal/define.js";import{nextId as g}from"../internal/ids.js";import{hiddenHostStyles as A}from"../internal/styles.js";var e=class extends b{constructor(){super(...arguments);this.value="";this.disabled=!1;this.root=null;this.onRootUpdate=()=>this.syncSelectedState();this.handleClick=()=>{this.disabled||!this.root||(this.root.selectItem(this.value),this.root.closesOnSelect&&(this.root.setOpen(!1),this.root.focusTrigger()))};this.handlePointerEnter=()=>{this.disabled||this.root?.setActiveId(this.id)}}connectedCallback(){super.connectedCallback(),this.id||(this.id=g("skdx-select-item")),this.setAttribute("role","option"),this.addEventListener("click",this.handleClick),this.addEventListener("pointerenter",this.handlePointerEnter),this.root=m(this,"skdx-select"),this.root?.addEventListener("skdx-select-internal-update",this.onRootUpdate),this.syncSelectedState(),this.registerLabel()}disconnectedCallback(){this.root?.removeEventListener("skdx-select-internal-update",this.onRootUpdate),super.disconnectedCallback()}updated(t){(t.has("disabled")||t.has("value"))&&this.syncSelectedState(),(t.has("value")||t.has("textValue"))&&this.registerLabel()}syncSelectedState(){this.setAttribute("data-value",this.value),this.disabled?(this.setAttribute("data-disabled",""),this.setAttribute("aria-disabled","true")):(this.removeAttribute("data-disabled"),this.removeAttribute("aria-disabled"));let t=this.root;if(!t){this.setAttribute("aria-selected","false"),this.setAttribute("data-state","unchecked"),this.removeAttribute("data-highlighted");return}n(t,()=>{let i=t.isSelected(this.value);this.setAttribute("aria-selected",String(i)),this.setAttribute("data-state",i?"checked":"unchecked"),t.activeId===this.id?this.setAttribute("data-highlighted",""):this.removeAttribute("data-highlighted")})}registerLabel(){let t=this.root;t&&n(t,()=>t.registerOptionLabel(this.value,this.textValue??this.textContent?.trim()??"")),this.textValue===void 0?this.removeAttribute("data-text-value"):this.setAttribute("data-text-value",this.textValue)}render(){return p`<slot></slot>`}};e.styles=[A,v`
+var c=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var o=(a,r,t,s)=>{for(var e=s>1?void 0:s?v(r,t):r,l=a.length-1,n;l>=0;l--)(n=a[l])&&(e=(s?n(r,t,e):n(e))||e);return s&&e&&c(r,t,e),e};import{css as p,html as b,LitElement as m}from"lit";import{property as h}from"lit/decorators.js";import{closestThroughPortal as f}from"../internal/closest.js";import{customElement as g,whenUpgraded as u}from"../internal/define.js";import{nextId as A}from"../internal/ids.js";import{hiddenHostStyles as x}from"../internal/styles.js";import{SELECT_FAMILY as d}from"./family.js";var i=class extends m{constructor(){super(...arguments);this.value="";this.disabled=!1;this.root=null;this.onRootUpdate=()=>this.syncSelectedState();this.handleClick=()=>{this.isInert||!this.root||(this.root.selectItem(this.value,"pointer"),this.root.closesOnSelect&&(this.root.setOpen(!1),this.root.focusTrigger()))};this.handlePointerEnter=()=>{this.isInert||this.root?.setActiveId(this.id)}}connectedCallback(){super.connectedCallback(),this.id||(this.id=A("skdx-select-item")),this.setAttribute("role","option"),this.addEventListener("click",this.handleClick),this.addEventListener("pointerenter",this.handlePointerEnter),this.root=f(this,d.selector),this.root?.addEventListener(d.event,this.onRootUpdate),this.syncSelectedState(),this.registerLabel()}disconnectedCallback(){this.root?.unregisterItem(this.id),this.root?.removeEventListener(d.event,this.onRootUpdate),this.removeEventListener("click",this.handleClick),this.removeEventListener("pointerenter",this.handlePointerEnter),super.disconnectedCallback()}updated(t){(t.has("disabled")||t.has("value"))&&this.syncSelectedState(),(t.has("value")||t.has("textValue"))&&this.registerLabel()}get itemText(){return this.textValue??this.textContent?.trim()??""}syncSelectedState(){this.setAttribute("data-value",this.value);let t=this.root;if(!t){this.setInert(this.disabled),this.setAttribute("aria-selected","false"),this.setAttribute("data-state","unchecked"),this.removeAttribute("data-highlighted");return}u(t,()=>{let s=t.matchesFilter(this.itemText);if(this.hidden=!s,!s){this.hasAttribute("role")&&this.removeAttribute("role"),t.unregisterItem(this.id);return}this.getAttribute("role")!=="option"&&this.setAttribute("role","option"),t.registerItem(this.id,{value:this.value,text:this.itemText});let e=t.isSelected(this.value);this.setInert(this.disabled||t.atMax&&!e),this.setAttribute("aria-selected",String(e)),this.setAttribute("data-state",e?"checked":"unchecked"),t.activeId===this.id?this.setAttribute("data-highlighted",""):this.removeAttribute("data-highlighted")})}setInert(t){t?(this.setAttribute("data-disabled",""),this.setAttribute("aria-disabled","true")):(this.removeAttribute("data-disabled"),this.removeAttribute("aria-disabled"))}get isInert(){if(this.disabled)return!0;let t=this.root;return t!==null&&t.atMax&&!t.isSelected(this.value)}registerLabel(){let t=this.root;t&&u(t,()=>t.registerOptionLabel(this.value,this.textValue??this.textContent?.trim()??"")),this.textValue===void 0?this.removeAttribute("data-text-value"):this.setAttribute("data-text-value",this.textValue)}render(){return b`<slot></slot>`}};i.styles=[x,p`
       :host {
         display: block;
       }
-    `],a([h({type:String})],e.prototype,"value",2),a([h({type:Boolean,reflect:!0})],e.prototype,"disabled",2),a([h({type:String,attribute:"text-value"})],e.prototype,"textValue",2),e=a([f("skdx-select-item","select","item")],e);export{e as SkdxSelectItem};
+    `],o([h({type:String})],i.prototype,"value",2),o([h({type:Boolean,reflect:!0})],i.prototype,"disabled",2),o([h({type:String,attribute:"text-value"})],i.prototype,"textValue",2),i=o([g("skdx-select-item","select","item")],i);export{i as SkdxSelectItem};

package/dist/select/SelectItemIndicator.cjs

@@ -1,5 +1,5 @@
-"use strict";var n=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var y=(o,t)=>{for(var i in t)n(o,i,{get:t[i],enumerable:!0})},b=(o,t,i,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of k(t))!f.call(o,e)&&e!==i&&n(o,e,{get:()=>t[e],enumerable:!(s=p(t,e))||s.enumerable});return o};var x=o=>b(n({},"__esModule",{value:!0}),o),a=(o,t,i,s)=>{for(var e=s>1?void 0:s?p(t,i):t,d=o.length-1,c;d>=0;d--)(c=o[d])&&(e=(s?c(t,i,e):c(e))||e);return s&&e&&n(t,i,e),e};var E={};y(E,{SkdxSelectItemIndicator:()=>r});module.exports=x(E);var l=require("lit"),h=require("lit/decorators.js"),m=require("../internal/closest.cjs"),u=require("../internal/define.cjs"),v=require("../internal/styles.cjs");var r=class extends l.LitElement{constructor(){super(...arguments);this.forceMount=!1;this.option=null;this.root=null;this.onRootUpdate=()=>this.sync()}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-hidden","true"),this.option=this.closest("skdx-select-item"),this.root=(0,m.closestThroughPortal)(this,"skdx-select"),this.root?.addEventListener("skdx-select-internal-update",this.onRootUpdate),this.sync()}disconnectedCallback(){this.root?.removeEventListener("skdx-select-internal-update",this.onRootUpdate),super.disconnectedCallback()}updated(){this.sync()}sync(){let i=this.option?.getAttribute("data-state")==="checked";this.setAttribute("data-state",i?"checked":"unchecked"),this.hidden=!this.forceMount&&!i}render(){return l.html`<slot></slot>`}};r.styles=[v.hiddenHostStyles,l.css`
+"use strict";var n=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var b=(o,e)=>{for(var i in e)n(o,i,{get:e[i],enumerable:!0})},E=(o,e,i,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of y(e))!k.call(o,t)&&t!==i&&n(o,t,{get:()=>e[t],enumerable:!(s=m(e,t))||s.enumerable});return o};var L=o=>E(n({},"__esModule",{value:!0}),o),p=(o,e,i,s)=>{for(var t=s>1?void 0:s?m(e,i):e,d=o.length-1,a;d>=0;d--)(a=o[d])&&(t=(s?a(e,i,t):a(t))||t);return s&&t&&n(e,i,t),t};var T={};b(T,{SkdxSelectItemIndicator:()=>r});module.exports=L(T);var l=require("lit"),h=require("lit/decorators.js"),u=require("../internal/closest.cjs"),v=require("../internal/define.cjs"),f=require("../internal/styles.cjs"),c=require("./family.cjs");var r=class extends l.LitElement{constructor(){super(...arguments);this.forceMount=!1;this.option=null;this.root=null;this.onRootUpdate=()=>this.sync()}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-hidden","true"),this.option=this.closest("skdx-select-item"),this.root=(0,u.closestThroughPortal)(this,c.SELECT_FAMILY.selector),this.root?.addEventListener(c.SELECT_FAMILY.event,this.onRootUpdate),this.sync()}disconnectedCallback(){this.root?.removeEventListener(c.SELECT_FAMILY.event,this.onRootUpdate),super.disconnectedCallback()}updated(){this.sync()}sync(){let i=this.option?.getAttribute("data-state")==="checked";this.setAttribute("data-state",i?"checked":"unchecked"),this.hidden=!this.forceMount&&!i}render(){return l.html`<slot></slot>`}};r.styles=[f.hiddenHostStyles,l.css`
       :host {
         display: inline-block;
       }
-    `],a([(0,h.property)({type:Boolean,attribute:"force-mount"})],r.prototype,"forceMount",2),r=a([(0,u.customElement)("skdx-select-item-indicator","select","item-indicator")],r);0&&(module.exports={SkdxSelectItemIndicator});
+    `],p([(0,h.property)({type:Boolean,attribute:"force-mount"})],r.prototype,"forceMount",2),r=p([(0,v.customElement)("skdx-select-item-indicator","select","item-indicator")],r);0&&(module.exports={SkdxSelectItemIndicator});

package/dist/select/SelectItemIndicator.d.cts

@@ -1,11 +1,11 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
  * Selected-state glyph inside an Item, rendered only while selected. Renders aria-hidden.
  *
  * @example
  * ```html
  * <skdx-select-item value="react">
- *   <skdx-select-item-text>React</skdx-select-item-text>
+ *   <skdx-select-item-text>Ruby</skdx-select-item-text>
  *   <skdx-select-item-indicator>✓</skdx-select-item-indicator>
  * </skdx-select-item>
  * ```
@@ -24,7 +24,7 @@ export declare class SkdxSelectItemIndicator extends LitElement {
     disconnectedCallback(): void;
     protected updated(): void;
     private sync;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/select/SelectItemIndicator.d.ts

@@ -1,11 +1,11 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
  * Selected-state glyph inside an Item, rendered only while selected. Renders aria-hidden.
  *
  * @example
  * ```html
  * <skdx-select-item value="react">
- *   <skdx-select-item-text>React</skdx-select-item-text>
+ *   <skdx-select-item-text>Ruby</skdx-select-item-text>
  *   <skdx-select-item-indicator>✓</skdx-select-item-indicator>
  * </skdx-select-item>
  * ```
@@ -24,7 +24,7 @@ export declare class SkdxSelectItemIndicator extends LitElement {
     disconnectedCallback(): void;
     protected updated(): void;
     private sync;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {