@skdx/web-components 0.26.0

package/dist/combobox/ComboboxContent.d.ts

@@ -0,0 +1,82 @@
+import { LitElement } from 'lit';
+import { type PositionOptions } from '../internal/positioning.js';
+/**
+ * `<skdx-combobox-content>` — the listbox popup for the closest ancestor
+ * `<skdx-combobox>`, positioned relative to `<skdx-combobox-input>` via
+ * `@floating-ui/dom` (`strategy: 'fixed'`). `role`, `id`, `data-state`, and
+ * the `data-side`/`data-align` placement hooks (seeded from the configured
+ * `side`/`align`, then rewritten by `positionFloating` with floating-ui's
+ * resolved placement) are set directly on this host element (not inside shadow DOM) for the
+ * same reason as `<skdx-select-content>`: `aria-controls` targets this
+ * element's id, and light-DOM `querySelectorAll` is how descendant items are
+ * found. Prevents `mousedown` from stealing focus off the input.
+ *
+ * `positionFloating` also writes the measurement custom properties
+ * `--skdx-combobox-available-width` / `-available-height` / `-trigger-width` /
+ * `-transform-origin` onto this element on every reposition, so the listbox
+ * can be sized (`max-height: var(--skdx-combobox-available-height)`) and
+ * animated from CSS without measuring anything by hand.
+ *
+ * Closes on Escape or on an outside interaction — pointer-down outside, or
+ * focus moving outside — each announced first as `interact-outside` and then as
+ * the specific event, so one `preventDefault()` vetoes either path. Escape is
+ * owned here rather than by `<skdx-combobox-input>`'s keydown handler: the
+ * document-level listener runs in the capture phase, i.e. *before* the input's,
+ * which is the only ordering in which a listener can still veto the close.
+ *
+ * @fires escape-key-down - Escape was pressed while open. Preventable.
+ * @fires pointer-down-outside - A pointer-down landed outside the combobox while open. Preventable.
+ * @fires focus-outside - Focus moved outside the combobox while open (detail: the original focusin). Preventable.
+ * @fires interact-outside - Either kind of outside interaction, fired immediately before the specific event so one handler can veto both. Preventable.
+ */
+export declare class SkdxComboboxContent extends LitElement {
+    static styles: import("lit").CSSResult[];
+    /** Preferred edge of the input to place the listbox against. */
+    side: PositionOptions['side'];
+    /** Preferred alignment along that edge relative to the input. */
+    align: PositionOptions['align'];
+    /** Pixel gap between the listbox and the input's edge. */
+    sideOffset: number;
+    /** Pixel offset along the alignment axis. */
+    alignOffset: number;
+    /** Flip/shift to stay within the viewport instead of overflowing it. */
+    avoidCollisions: boolean;
+    /**
+     * Minimum pixel distance to keep from the collision boundary when avoiding
+     * collisions. The `collision-padding` attribute sets a single number for
+     * every side; the per-side `{ top, right, bottom, left }` form is
+     * property-only, since an attribute cannot carry an object.
+     */
+    collisionPadding: NonNullable<PositionOptions['collisionPadding']>;
+    /**
+     * Element (or elements) collisions are measured against instead of this
+     * listbox's clipping ancestors — keeps it inside a scroll container or one
+     * pane of a split layout rather than the whole viewport. Property-only: an
+     * `Element` cannot come from an attribute string.
+     */
+    collisionBoundary?: PositionOptions['collisionBoundary'];
+    private root;
+    private readonly onRootUpdate;
+    private cleanupPosition?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private readonly preventFocusSteal;
+    /**
+     * The layer is the whole control, not just this panel: real focus lives on
+     * `<skdx-combobox-input>` for the entire interaction, so a target inside the
+     * root is never "outside".
+     */
+    private isInside;
+    private readonly handleDocumentKeyDown;
+    private readonly handleOutsidePointerDown;
+    private readonly handleOutsideFocus;
+    private syncHostState;
+    private activate;
+    private deactivate;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-combobox-content': SkdxComboboxContent;
+    }
+}

package/dist/combobox/ComboboxContent.js

@@ -0,0 +1,5 @@
+var c=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var s=(l,r,t,i)=>{for(var o=i>1?void 0:i?h(r,t):r,a=l.length-1,d;a>=0;a--)(d=l[a])&&(o=(i?d(r,t,o):d(o))||o);return i&&o&&c(r,t,o),o};import{css as p,html as f,LitElement as v}from"lit";import{property as n}from"lit/decorators.js";import{closestThroughPortal as m}from"../internal/closest.js";import{customElement as b}from"../internal/define.js";import{dispatchEscapeKeyDown as y,dispatchOutside as u,focusOutsideTarget as g}from"../internal/dismiss.js";import{optOutBoolean as O,positionFloating as E}from"../internal/positioning.js";import{hiddenHostStyles as P}from"../internal/styles.js";var e=class extends v{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.handleDocumentKeyDown=t=>{t.key!=="Escape"||!this.root?.open||(t.preventDefault(),y(this,t)&&this.root.setOpen(!1))};this.handleOutsidePointerDown=t=>{!this.root?.open||this.isInside(t.target)||u(this,"pointer-down-outside",t)&&this.root.setOpen(!1)};this.handleOutsideFocus=t=>{if(!this.root?.open)return;let i=g(t);i===null||this.isInside(i)||u(this,"focus-outside",t)&&this.root.setOpen(!1)}}connectedCallback(){super.connectedCallback(),this.setAttribute("role","listbox"),this.root=m(this,"skdx-combobox"),this.root&&(this.root.contentEl=this),this.root?.addEventListener("skdx-combobox-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.syncHostState()}disconnectedCallback(){this.root?.removeEventListener("skdx-combobox-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()}isInside(t){return t?this.contains(t)||this.root?.contains(t)===!0:!1}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");for(let[i,o,a]of[["aria-multiselectable","data-multiple",this.root?.multiple],["aria-busy","data-loading",this.root?.loading]])a?(this.setAttribute(i,"true"),this.setAttribute(o,"")):(this.removeAttribute(i),this.removeAttribute(o));this.hidden=!t,t?this.activate():this.deactivate()}activate(){this.cleanupPosition||!this.root?.inputHost||(this.cleanupPosition=E(this.root.inputHost,this,{side:this.side,align:this.align,sideOffset:this.sideOffset,alignOffset:this.alignOffset,avoidCollisions:this.avoidCollisions,collisionPadding:this.collisionPadding,collisionBoundary:this.collisionBoundary,component:"combobox"}))}deactivate(){this.cleanupPosition?.(),this.cleanupPosition=void 0}render(){return f`<slot></slot>`}};e.styles=[P,p`
+      :host {
+        display: block;
+      }
+    `],s([n({type:String})],e.prototype,"side",2),s([n({type:String})],e.prototype,"align",2),s([n({type:Number,attribute:"side-offset"})],e.prototype,"sideOffset",2),s([n({type:Number,attribute:"align-offset"})],e.prototype,"alignOffset",2),s([n({converter:O,attribute:"avoid-collisions"})],e.prototype,"avoidCollisions",2),s([n({type:Number,attribute:"collision-padding"})],e.prototype,"collisionPadding",2),s([n({attribute:!1})],e.prototype,"collisionBoundary",2),e=s([b("skdx-combobox-content","combobox","content")],e);export{e as SkdxComboboxContent};

package/dist/combobox/ComboboxEmpty.cjs

@@ -0,0 +1,5 @@
+"use strict";var l=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var u=(o,e)=>{for(var r in e)l(o,r,{get:e[r],enumerable:!0})},x=(o,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of p(e))!v.call(o,t)&&t!==r&&l(o,t,{get:()=>e[t],enumerable:!(i=c(e,t))||i.enumerable});return o};var y=o=>x(l({},"__esModule",{value:!0}),o),b=(o,e,r,i)=>{for(var t=i>1?void 0:i?c(e,r):e,d=o.length-1,a;d>=0;d--)(a=o[d])&&(t=(i?a(e,r,t):a(t))||t);return i&&t&&l(e,r,t),t};var k={};u(k,{SkdxComboboxEmpty:()=>s});module.exports=y(k);var n=require("lit"),m=require("../internal/closest.cjs"),h=require("../internal/define.cjs");var s=class extends n.LitElement{constructor(){super(...arguments);this.root=null;this.onUpdate=()=>this.sync();this.itemObserver=new MutationObserver(this.onUpdate)}connectedCallback(){super.connectedCallback(),this.setAttribute("role","presentation"),this.root=(0,m.closestThroughPortal)(this,"skdx-combobox"),this.root?.addEventListener("skdx-combobox-internal-update",this.onUpdate),this.root&&this.itemObserver.observe(this.root,{childList:!0,subtree:!0,attributeFilter:["role"]}),this.sync()}disconnectedCallback(){this.itemObserver.disconnect(),this.root?.removeEventListener("skdx-combobox-internal-update",this.onUpdate),super.disconnectedCallback()}sync(){let r=this.root?.querySelectorAll('[role="option"]').length??0;this.hidden=r!==0}render(){return n.html`<slot></slot>`}};s.styles=n.css`
+    :host([hidden]) {
+      display: none;
+    }
+  `,s=b([(0,h.customElement)("skdx-combobox-empty","combobox","empty")],s);0&&(module.exports={SkdxComboboxEmpty});

package/dist/combobox/ComboboxEmpty.d.cts

@@ -0,0 +1,28 @@
+import { LitElement } from 'lit';
+/**
+ * `<skdx-combobox-empty>` — fallback shown in place of the item list when no
+ * `<skdx-combobox-item>`s are currently rendered in the closest ancestor
+ * `<skdx-combobox>` (e.g. the consumer's filtered results are empty). Sets
+ * `role="presentation"`; hides itself while at least one item is present.
+ */
+export declare class SkdxComboboxEmpty extends LitElement {
+    static styles: import("lit").CSSResult;
+    private root;
+    private readonly onUpdate;
+    /**
+     * The root's broadcast fires *before* the items have re-rendered and dropped
+     * their `role`, so emptiness measured off it alone is one beat stale. This
+     * catches the settled list. It can't loop: `hidden` is the only thing this
+     * element writes, and nothing observes it.
+     */
+    private readonly itemObserver;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private sync;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-combobox-empty': SkdxComboboxEmpty;
+    }
+}

package/dist/combobox/ComboboxEmpty.d.ts

@@ -0,0 +1,28 @@
+import { LitElement } from 'lit';
+/**
+ * `<skdx-combobox-empty>` — fallback shown in place of the item list when no
+ * `<skdx-combobox-item>`s are currently rendered in the closest ancestor
+ * `<skdx-combobox>` (e.g. the consumer's filtered results are empty). Sets
+ * `role="presentation"`; hides itself while at least one item is present.
+ */
+export declare class SkdxComboboxEmpty extends LitElement {
+    static styles: import("lit").CSSResult;
+    private root;
+    private readonly onUpdate;
+    /**
+     * The root's broadcast fires *before* the items have re-rendered and dropped
+     * their `role`, so emptiness measured off it alone is one beat stale. This
+     * catches the settled list. It can't loop: `hidden` is the only thing this
+     * element writes, and nothing observes it.
+     */
+    private readonly itemObserver;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private sync;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-combobox-empty': SkdxComboboxEmpty;
+    }
+}

package/dist/combobox/ComboboxEmpty.js

@@ -0,0 +1,5 @@
+var a=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var d=(s,t,o,i)=>{for(var e=i>1?void 0:i?c(t,o):t,n=s.length-1,l;n>=0;n--)(l=s[n])&&(e=(i?l(t,o,e):l(e))||e);return i&&e&&a(t,o,e),e};import{css as b,html as m,LitElement as h}from"lit";import{closestThroughPortal as p}from"../internal/closest.js";import{customElement as v}from"../internal/define.js";var r=class extends h{constructor(){super(...arguments);this.root=null;this.onUpdate=()=>this.sync();this.itemObserver=new MutationObserver(this.onUpdate)}connectedCallback(){super.connectedCallback(),this.setAttribute("role","presentation"),this.root=p(this,"skdx-combobox"),this.root?.addEventListener("skdx-combobox-internal-update",this.onUpdate),this.root&&this.itemObserver.observe(this.root,{childList:!0,subtree:!0,attributeFilter:["role"]}),this.sync()}disconnectedCallback(){this.itemObserver.disconnect(),this.root?.removeEventListener("skdx-combobox-internal-update",this.onUpdate),super.disconnectedCallback()}sync(){let o=this.root?.querySelectorAll('[role="option"]').length??0;this.hidden=o!==0}render(){return m`<slot></slot>`}};r.styles=b`
+    :host([hidden]) {
+      display: none;
+    }
+  `,r=d([v("skdx-combobox-empty","combobox","empty")],r);export{r as SkdxComboboxEmpty};

package/dist/combobox/ComboboxInput.cjs

@@ -0,0 +1,27 @@
+"use strict";var s=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var g=(a,i)=>{for(var e in i)s(a,e,{get:i[e],enumerable:!0})},$=(a,i,e,t)=>{if(i&&typeof i=="object"||typeof i=="function")for(let o of b(i))!x.call(a,o)&&o!==e&&s(a,o,{get:()=>i[o],enumerable:!(t=c(i,o))||t.enumerable});return a};var I=a=>$(s({},"__esModule",{value:!0}),a),p=(a,i,e,t)=>{for(var o=t>1?void 0:t?c(i,e):i,d=a.length-1,n;d>=0;d--)(n=a[d])&&(o=(t?n(i,e,o):n(o))||o);return t&&o&&s(i,e,o),o};var E={};g(E,{SkdxComboboxInput:()=>l});module.exports=I(E);var r=require("lit"),u=require("lit/decorators.js"),m=require("../internal/define.cjs"),v=require("../internal/part.cjs"),h=require("../internal/styles.cjs"),f=require("./Combobox.cjs");var l=class extends r.LitElement{constructor(){super(...arguments);this.placeholder="";this.root=null;this.onUpdate=()=>this.requestUpdate();this.handleInput=e=>{let t=this.root;t&&(t.setInputValue(e.target.value),t.open||t.setOpen(!0))};this.handleKeyDown=e=>{let t=this.root;t&&(e.key==="ArrowDown"?(e.preventDefault(),t.open?this.moveActive(1):t.openWithHighlight("first")):e.key==="ArrowUp"?(e.preventDefault(),t.open?this.moveActive(-1):t.openWithHighlight("last")):e.key==="Enter"?t.activeId?(e.preventDefault(),this.commitActive()):t.allowCustomValue&&t.inputValue!==""&&(e.preventDefault(),t.selectItem(t.inputValue,t.inputValue)):e.key==="Escape"&&t.open&&!t.contentEl&&(e.preventDefault(),t.setOpen(!1)))}}createRenderRoot(){return this}focus(e){this.querySelector("input")?.focus(e)}connectedCallback(){super.connectedCallback(),this.root=this.closest("skdx-combobox"),this.root&&(this.root.inputHost=this),this.root?.addEventListener("skdx-combobox-internal-update",this.onUpdate),(0,h.installLightDomStyles)()}disconnectedCallback(){this.root?.removeEventListener("skdx-combobox-internal-update",this.onUpdate),super.disconnectedCallback()}updated(){let e=this.root;(0,v.reflectHostState)(this,{"data-invalid":e?.invalid?"":null,"data-readonly":e?.readOnly?"":null,"data-loading":e?.loading?"":null,"data-multiple":e?.multiple?"":null})}moveActive(e){let t=this.root;if(!t)return;let o=Array.from(t.querySelectorAll(f.OPTION_SELECTOR));if(o.length===0)return;let n=o.findIndex(y=>y.id===t.activeId)+e;n<0&&(n=0),n>=o.length&&(n=o.length-1),t.setActiveId(o[n].id)}commitActive(){let e=this.root;if(!e?.activeId)return;let t=e.getItem(e.activeId);t&&e.selectItem(t.value,t.text||t.value)}render(){let e=this.root,t=e?.open??!1;return r.html`
+      <input
+        part="input"
+        type="text"
+        role="combobox"
+        placeholder=${this.placeholder}
+        .value=${e?.inputValue??""}
+        aria-expanded=${t}
+        aria-controls=${e?.contentId??r.nothing}
+        aria-autocomplete="list"
+        aria-activedescendant=${e?.activeId??r.nothing}
+        autocomplete="off"
+        ?readonly=${e?.readOnly??!1}
+        ?disabled=${e?.disabled??!1}
+        ?required=${e?.required??!1}
+        aria-invalid=${e?.invalid?"true":r.nothing}
+        data-disabled=${e?.disabled?"":r.nothing}
+        aria-readonly=${e?.readOnly?"true":r.nothing}
+        aria-busy=${e?.loading?"true":r.nothing}
+        data-invalid=${e?.invalid?"":r.nothing}
+        data-readonly=${e?.readOnly?"":r.nothing}
+        data-loading=${e?.loading?"":r.nothing}
+        data-multiple=${e?.multiple?"":r.nothing}
+        @input=${this.handleInput}
+        @keydown=${this.handleKeyDown}
+      />
+    `}};p([(0,u.property)({type:String})],l.prototype,"placeholder",2),l=p([(0,m.customElement)("skdx-combobox-input","combobox","input")],l);0&&(module.exports={SkdxComboboxInput});

package/dist/combobox/ComboboxInput.d.cts

@@ -0,0 +1,56 @@
+import { LitElement } from 'lit';
+/**
+ * `<skdx-combobox-input>` — text field that drives the closest ancestor
+ * `<skdx-combobox>`'s filtering and keeps real DOM focus for the whole
+ * interaction; doubles as the floating-ui anchor the listbox positions
+ * against. Renders an `<input type="text" role="combobox">` with
+ * `aria-expanded`, `aria-controls`, `aria-autocomplete="list"`,
+ * `aria-activedescendant`. Typing opens the listbox and updates the draft
+ * text; Arrow Down/Up open the listbox (or move the highlight by one option
+ * when already open); Enter commits the highlighted option — or, with the
+ * root's `allow-custom-value` and nothing highlighted, the draft text itself;
+ * Escape closes the listbox.
+ *
+ * Renders **into light DOM** (`createRenderRoot()` returns `this` — no shadow
+ * root), for the same reason `<skdx-command-input>` and `<skdx-label>` do:
+ * `aria-controls` and `aria-activedescendant` are IDREFs, and an IDREF
+ * resolves only within its own tree. `<skdx-combobox-content>` and every
+ * `<skdx-combobox-item>` are the consumer's own light-DOM markup, so from
+ * inside a shadow root neither attribute could ever resolve — they were inert,
+ * and the highlighted option was never announced. Moving them onto the host is
+ * not an option here: the element the attributes belong on is the one that
+ * takes focus.
+ *
+ * @csspart input - The native `<input>` element. **`::part(input)` does not reach it.**
+ * This element renders into the light DOM (see `createRenderRoot` below) and `::part()`
+ * only matches inside a shadow root, so the `part` attribute is inert here. It is kept so
+ * the name matches the shadow-DOM components and the styling-hooks contract. Style it as an
+ * ordinary descendant instead: `skdx-combobox-input > input { … }`.
+ */
+export declare class SkdxComboboxInput extends LitElement {
+    /** Light DOM, for the IDREF reasons in the class docblock. */
+    createRenderRoot(): this;
+    /** Placeholder text shown when the draft text is empty. */
+    placeholder: string;
+    private root;
+    private readonly onUpdate;
+    /**
+     * Reaches through to the native `<input>`, which is where the `combobox`
+     * role and the real focus live — `<skdx-combobox-item>` calls this to put
+     * focus back after a click.
+     */
+    focus(options?: FocusOptions): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(): void;
+    private moveActive;
+    private commitActive;
+    private readonly handleInput;
+    private readonly handleKeyDown;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-combobox-input': SkdxComboboxInput;
+    }
+}

package/dist/combobox/ComboboxInput.d.ts

@@ -0,0 +1,56 @@
+import { LitElement } from 'lit';
+/**
+ * `<skdx-combobox-input>` — text field that drives the closest ancestor
+ * `<skdx-combobox>`'s filtering and keeps real DOM focus for the whole
+ * interaction; doubles as the floating-ui anchor the listbox positions
+ * against. Renders an `<input type="text" role="combobox">` with
+ * `aria-expanded`, `aria-controls`, `aria-autocomplete="list"`,
+ * `aria-activedescendant`. Typing opens the listbox and updates the draft
+ * text; Arrow Down/Up open the listbox (or move the highlight by one option
+ * when already open); Enter commits the highlighted option — or, with the
+ * root's `allow-custom-value` and nothing highlighted, the draft text itself;
+ * Escape closes the listbox.
+ *
+ * Renders **into light DOM** (`createRenderRoot()` returns `this` — no shadow
+ * root), for the same reason `<skdx-command-input>` and `<skdx-label>` do:
+ * `aria-controls` and `aria-activedescendant` are IDREFs, and an IDREF
+ * resolves only within its own tree. `<skdx-combobox-content>` and every
+ * `<skdx-combobox-item>` are the consumer's own light-DOM markup, so from
+ * inside a shadow root neither attribute could ever resolve — they were inert,
+ * and the highlighted option was never announced. Moving them onto the host is
+ * not an option here: the element the attributes belong on is the one that
+ * takes focus.
+ *
+ * @csspart input - The native `<input>` element. **`::part(input)` does not reach it.**
+ * This element renders into the light DOM (see `createRenderRoot` below) and `::part()`
+ * only matches inside a shadow root, so the `part` attribute is inert here. It is kept so
+ * the name matches the shadow-DOM components and the styling-hooks contract. Style it as an
+ * ordinary descendant instead: `skdx-combobox-input > input { … }`.
+ */
+export declare class SkdxComboboxInput extends LitElement {
+    /** Light DOM, for the IDREF reasons in the class docblock. */
+    createRenderRoot(): this;
+    /** Placeholder text shown when the draft text is empty. */
+    placeholder: string;
+    private root;
+    private readonly onUpdate;
+    /**
+     * Reaches through to the native `<input>`, which is where the `combobox`
+     * role and the real focus live — `<skdx-combobox-item>` calls this to put
+     * focus back after a click.
+     */
+    focus(options?: FocusOptions): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(): void;
+    private moveActive;
+    private commitActive;
+    private readonly handleInput;
+    private readonly handleKeyDown;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-combobox-input': SkdxComboboxInput;
+    }
+}

package/dist/combobox/ComboboxInput.js

@@ -0,0 +1,27 @@
+var c=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var s=(d,a,e,t)=>{for(var o=t>1?void 0:t?u(a,e):a,l=d.length-1,r;l>=0;l--)(r=d[l])&&(o=(t?r(a,e,o):r(o))||o);return t&&o&&c(a,e,o),o};import{html as m,LitElement as v,nothing as i}from"lit";import{property as h}from"lit/decorators.js";import{customElement as f}from"../internal/define.js";import{reflectHostState as y}from"../internal/part.js";import{installLightDomStyles as b}from"../internal/styles.js";import{OPTION_SELECTOR as x}from"./Combobox.js";var n=class extends v{constructor(){super(...arguments);this.placeholder="";this.root=null;this.onUpdate=()=>this.requestUpdate();this.handleInput=e=>{let t=this.root;t&&(t.setInputValue(e.target.value),t.open||t.setOpen(!0))};this.handleKeyDown=e=>{let t=this.root;t&&(e.key==="ArrowDown"?(e.preventDefault(),t.open?this.moveActive(1):t.openWithHighlight("first")):e.key==="ArrowUp"?(e.preventDefault(),t.open?this.moveActive(-1):t.openWithHighlight("last")):e.key==="Enter"?t.activeId?(e.preventDefault(),this.commitActive()):t.allowCustomValue&&t.inputValue!==""&&(e.preventDefault(),t.selectItem(t.inputValue,t.inputValue)):e.key==="Escape"&&t.open&&!t.contentEl&&(e.preventDefault(),t.setOpen(!1)))}}createRenderRoot(){return this}focus(e){this.querySelector("input")?.focus(e)}connectedCallback(){super.connectedCallback(),this.root=this.closest("skdx-combobox"),this.root&&(this.root.inputHost=this),this.root?.addEventListener("skdx-combobox-internal-update",this.onUpdate),b()}disconnectedCallback(){this.root?.removeEventListener("skdx-combobox-internal-update",this.onUpdate),super.disconnectedCallback()}updated(){let e=this.root;y(this,{"data-invalid":e?.invalid?"":null,"data-readonly":e?.readOnly?"":null,"data-loading":e?.loading?"":null,"data-multiple":e?.multiple?"":null})}moveActive(e){let t=this.root;if(!t)return;let o=Array.from(t.querySelectorAll(x));if(o.length===0)return;let r=o.findIndex(p=>p.id===t.activeId)+e;r<0&&(r=0),r>=o.length&&(r=o.length-1),t.setActiveId(o[r].id)}commitActive(){let e=this.root;if(!e?.activeId)return;let t=e.getItem(e.activeId);t&&e.selectItem(t.value,t.text||t.value)}render(){let e=this.root,t=e?.open??!1;return m`
+      <input
+        part="input"
+        type="text"
+        role="combobox"
+        placeholder=${this.placeholder}
+        .value=${e?.inputValue??""}
+        aria-expanded=${t}
+        aria-controls=${e?.contentId??i}
+        aria-autocomplete="list"
+        aria-activedescendant=${e?.activeId??i}
+        autocomplete="off"
+        ?readonly=${e?.readOnly??!1}
+        ?disabled=${e?.disabled??!1}
+        ?required=${e?.required??!1}
+        aria-invalid=${e?.invalid?"true":i}
+        data-disabled=${e?.disabled?"":i}
+        aria-readonly=${e?.readOnly?"true":i}
+        aria-busy=${e?.loading?"true":i}
+        data-invalid=${e?.invalid?"":i}
+        data-readonly=${e?.readOnly?"":i}
+        data-loading=${e?.loading?"":i}
+        data-multiple=${e?.multiple?"":i}
+        @input=${this.handleInput}
+        @keydown=${this.handleKeyDown}
+      />
+    `}};s([h({type:String})],n.prototype,"placeholder",2),n=s([f("skdx-combobox-input","combobox","input")],n);export{n as SkdxComboboxInput};

package/dist/combobox/ComboboxItem.cjs

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

package/dist/combobox/ComboboxItem.d.cts

@@ -0,0 +1,53 @@
+import { LitElement } from 'lit';
+/**
+ * `<skdx-combobox-item>` — a single selectable option within
+ * `<skdx-combobox-content>`. Sets `role="option"` on itself (light DOM, so
+ * `aria-activedescendant` on the input can reference it) with `data-value`,
+ * `aria-selected`, `data-state` (`checked`/`unchecked`), `data-highlighted`
+ * (virtual focus), and `data-disabled`. Click selects the item, updates the
+ * input's draft text, closes the listbox, and refocuses the input — or, while
+ * the root is `multiple`, toggles it, clears the draft text, and leaves the
+ * listbox open. Pointer hover moves the virtual highlight onto it.
+ *
+ * When the root has a `filter` predicate, an item the predicate rejects drops
+ * its `role="option"` and hides: it is no longer an option at all, so it
+ * leaves the result count, the highlight order, and `<skdx-combobox-empty>`'s
+ * emptiness check exactly as if the consumer had never rendered it. (React
+ * unmounts the node outright; a custom element cannot un-author the tag the
+ * consumer wrote, so it stops *being* an option instead.)
+ */
+export declare class SkdxComboboxItem extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** The value committed to the combobox when this item is selected. Required. */
+    value: string;
+    /** Excludes this item from selection and keyboard navigation entirely. */
+    disabled: boolean;
+    /**
+     * Text the root's `filter` predicate matches against, and the text a
+     * selection writes back into the input. Falls back to this item's rendered
+     * text content, which is only wrong when the item renders more than its
+     * label (an icon, a secondary line) — supply it then.
+     * @default undefined — falls back to the item's own text content.
+     */
+    textValue?: string;
+    /**
+     * The text this item is measured by. Unlike React — where a filtered-out
+     * item unmounts, so its text has to be captured before it can disappear —
+     * the light DOM keeps this readable whether or not the item is currently an
+     * option, which is what lets a widened query bring it straight back.
+     */
+    private get itemText();
+    private root;
+    private readonly onUpdate;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private readonly handleSelect;
+    private readonly handlePointerEnter;
+    protected updated(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-combobox-item': SkdxComboboxItem;
+    }
+}

package/dist/combobox/ComboboxItem.d.ts

@@ -0,0 +1,53 @@
+import { LitElement } from 'lit';
+/**
+ * `<skdx-combobox-item>` — a single selectable option within
+ * `<skdx-combobox-content>`. Sets `role="option"` on itself (light DOM, so
+ * `aria-activedescendant` on the input can reference it) with `data-value`,
+ * `aria-selected`, `data-state` (`checked`/`unchecked`), `data-highlighted`
+ * (virtual focus), and `data-disabled`. Click selects the item, updates the
+ * input's draft text, closes the listbox, and refocuses the input — or, while
+ * the root is `multiple`, toggles it, clears the draft text, and leaves the
+ * listbox open. Pointer hover moves the virtual highlight onto it.
+ *
+ * When the root has a `filter` predicate, an item the predicate rejects drops
+ * its `role="option"` and hides: it is no longer an option at all, so it
+ * leaves the result count, the highlight order, and `<skdx-combobox-empty>`'s
+ * emptiness check exactly as if the consumer had never rendered it. (React
+ * unmounts the node outright; a custom element cannot un-author the tag the
+ * consumer wrote, so it stops *being* an option instead.)
+ */
+export declare class SkdxComboboxItem extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** The value committed to the combobox when this item is selected. Required. */
+    value: string;
+    /** Excludes this item from selection and keyboard navigation entirely. */
+    disabled: boolean;
+    /**
+     * Text the root's `filter` predicate matches against, and the text a
+     * selection writes back into the input. Falls back to this item's rendered
+     * text content, which is only wrong when the item renders more than its
+     * label (an icon, a secondary line) — supply it then.
+     * @default undefined — falls back to the item's own text content.
+     */
+    textValue?: string;
+    /**
+     * The text this item is measured by. Unlike React — where a filtered-out
+     * item unmounts, so its text has to be captured before it can disappear —
+     * the light DOM keeps this readable whether or not the item is currently an
+     * option, which is what lets a widened query bring it straight back.
+     */
+    private get itemText();
+    private root;
+    private readonly onUpdate;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private readonly handleSelect;
+    private readonly handlePointerEnter;
+    protected updated(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-combobox-item': SkdxComboboxItem;
+    }
+}

package/dist/combobox/ComboboxItem.js

@@ -0,0 +1,8 @@
+var h=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var a=(d,r,t,s)=>{for(var e=s>1?void 0:s?c(r,t):r,o=d.length-1,l;o>=0;o--)(l=d[o])&&(e=(s?l(r,t,e):l(e))||e);return s&&e&&h(r,t,e),e};import{css as u,html as v,LitElement as m}from"lit";import{property as n}from"lit/decorators.js";import{closestThroughPortal as p}from"../internal/closest.js";import{customElement as b}from"../internal/define.js";import{nextId as f}from"../internal/ids.js";var i=class extends m{constructor(){super(...arguments);this.value="";this.disabled=!1;this.root=null;this.onUpdate=()=>this.requestUpdate();this.handleSelect=()=>{this.disabled||!this.root||(this.root.selectItem(this.value,this.itemText||this.value),this.root.inputHost?.focus?.())};this.handlePointerEnter=()=>{this.disabled||this.root?.setActiveId(this.id)}}get itemText(){return this.textValue??this.textContent?.trim()??""}connectedCallback(){super.connectedCallback(),this.id||(this.id=f("skdx-combobox-item")),this.setAttribute("role","option"),this.root=p(this,"skdx-combobox"),this.root?.addEventListener("skdx-combobox-internal-update",this.onUpdate),this.addEventListener("click",this.handleSelect),this.addEventListener("pointerenter",this.handlePointerEnter)}disconnectedCallback(){this.root?.unregisterItem(this.id),this.root?.removeEventListener("skdx-combobox-internal-update",this.onUpdate),this.removeEventListener("click",this.handleSelect),this.removeEventListener("pointerenter",this.handlePointerEnter),super.disconnectedCallback()}updated(){let t=this.root,s=!t||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)??!1,o=t?.activeId===this.id;this.setAttribute("data-value",this.value),this.setAttribute("aria-selected",String(e)),this.setAttribute("data-state",e?"checked":"unchecked"),o?this.setAttribute("data-highlighted",""):this.removeAttribute("data-highlighted"),this.disabled?this.hasAttribute("data-disabled")||this.setAttribute("data-disabled",""):this.removeAttribute("data-disabled")}render(){return v`<slot></slot>`}};i.styles=u`
+    :host {
+      display: block;
+    }
+    :host([hidden]) {
+      display: none;
+    }
+  `,a([n({type:String})],i.prototype,"value",2),a([n({type:Boolean,reflect:!0})],i.prototype,"disabled",2),a([n({type:String,attribute:"text-value"})],i.prototype,"textValue",2),i=a([b("skdx-combobox-item","combobox","item")],i);export{i as SkdxComboboxItem};

package/dist/combobox/ComboboxPortal.cjs

@@ -0,0 +1 @@
+"use strict";var l=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var i=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var g=(a,e)=>{for(var m in e)l(a,m,{get:e[m],enumerable:!0})},E=(a,e,m,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of i(e))!x.call(a,t)&&t!==m&&l(a,t,{get:()=>e[t],enumerable:!(o=s(e,t))||o.enumerable});return a};var M=a=>E(l({},"__esModule",{value:!0}),a),n=(a,e,m,o)=>{for(var t=o>1?void 0:o?s(e,m):e,c=a.length-1,p;c>=0;c--)(p=a[c])&&(t=(o?p(e,m,t):p(t))||t);return o&&t&&l(e,m,t),t};var T={};g(T,{SkdxComboboxPortal:()=>r});module.exports=M(T);var d=require("../internal/define.cjs"),f=require("../utils/portal.cjs");var r=class extends f.SkdxPortal{};r=n([(0,d.customElement)("skdx-combobox-portal")],r);0&&(module.exports={SkdxComboboxPortal});

package/dist/combobox/ComboboxPortal.d.cts

@@ -0,0 +1,35 @@
+import { SkdxPortal } from '../utils/portal.cjs';
+/**
+ * `<skdx-combobox-portal>` — teleports `<skdx-combobox-content>` to
+ * `document.body` (or a custom `container`), so the listbox escapes clipping
+ * and `overflow` from ancestors of the input it is anchored to.
+ *
+ * The **host element stays where you wrote it** and the *children* are the
+ * things that move, into a `<div data-skdx-portal>` — so removing the family
+ * root removes the portalled content with it, and the parts inside still
+ * resolve that root through `closestThroughPortal()`.
+ *
+ * Adds nothing to `<skdx-portal>` but its tag name. Unlike React's
+ * `ComboboxPortal` it takes no `force-mount` and does not unmount on close: the
+ * parts here never unmount, they hide via `hidden`, so there is nothing to
+ * force and nothing to keep alive for an exit animation.
+ *
+ * @example
+ * ```html
+ * <skdx-combobox>
+ *   <skdx-combobox-input aria-label="Fruit"></skdx-combobox-input>
+ *   <skdx-combobox-portal>
+ *     <skdx-combobox-content>
+ *       <skdx-combobox-item value="apple">Apple</skdx-combobox-item>
+ *     </skdx-combobox-content>
+ *   </skdx-combobox-portal>
+ * </skdx-combobox>
+ * ```
+ */
+export declare class SkdxComboboxPortal extends SkdxPortal {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-combobox-portal': SkdxComboboxPortal;
+    }
+}

package/dist/combobox/ComboboxPortal.d.ts

@@ -0,0 +1,35 @@
+import { SkdxPortal } from '../utils/portal.js';
+/**
+ * `<skdx-combobox-portal>` — teleports `<skdx-combobox-content>` to
+ * `document.body` (or a custom `container`), so the listbox escapes clipping
+ * and `overflow` from ancestors of the input it is anchored to.
+ *
+ * The **host element stays where you wrote it** and the *children* are the
+ * things that move, into a `<div data-skdx-portal>` — so removing the family
+ * root removes the portalled content with it, and the parts inside still
+ * resolve that root through `closestThroughPortal()`.
+ *
+ * Adds nothing to `<skdx-portal>` but its tag name. Unlike React's
+ * `ComboboxPortal` it takes no `force-mount` and does not unmount on close: the
+ * parts here never unmount, they hide via `hidden`, so there is nothing to
+ * force and nothing to keep alive for an exit animation.
+ *
+ * @example
+ * ```html
+ * <skdx-combobox>
+ *   <skdx-combobox-input aria-label="Fruit"></skdx-combobox-input>
+ *   <skdx-combobox-portal>
+ *     <skdx-combobox-content>
+ *       <skdx-combobox-item value="apple">Apple</skdx-combobox-item>
+ *     </skdx-combobox-content>
+ *   </skdx-combobox-portal>
+ * </skdx-combobox>
+ * ```
+ */
+export declare class SkdxComboboxPortal extends SkdxPortal {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-combobox-portal': SkdxComboboxPortal;
+    }
+}

package/dist/combobox/ComboboxPortal.js

@@ -0,0 +1 @@
+var s=Object.defineProperty;var n=Object.getOwnPropertyDescriptor;var p=(o,t,r,a)=>{for(var e=a>1?void 0:a?n(t,r):t,l=o.length-1,c;l>=0;l--)(c=o[l])&&(e=(a?c(t,r,e):c(e))||e);return a&&e&&s(t,r,e),e};import{customElement as d}from"../internal/define.js";import{SkdxPortal as f}from"../utils/portal.js";var m=class extends f{};m=p([d("skdx-combobox-portal")],m);export{m as SkdxComboboxPortal};

package/dist/combobox/index.cjs

@@ -0,0 +1 @@
+"use strict";var r=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var n=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var I=(x,o)=>{for(var b in o)r(x,b,{get:o[b],enumerable:!0})},l=(x,o,b,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let m of n(o))!y.call(x,m)&&m!==b&&r(x,m,{get:()=>o[m],enumerable:!(t=f(o,m))||t.enumerable});return x};var E=x=>l(r({},"__esModule",{value:!0}),x);var a={};I(a,{SkdxCombobox:()=>e.SkdxCombobox,SkdxComboboxContent:()=>d.SkdxComboboxContent,SkdxComboboxEmpty:()=>S.SkdxComboboxEmpty,SkdxComboboxInput:()=>p.SkdxComboboxInput,SkdxComboboxItem:()=>k.SkdxComboboxItem,SkdxComboboxPortal:()=>C.SkdxComboboxPortal});module.exports=E(a);var e=require("./Combobox.cjs"),p=require("./ComboboxInput.cjs"),C=require("./ComboboxPortal.cjs"),d=require("./ComboboxContent.cjs"),k=require("./ComboboxItem.cjs"),S=require("./ComboboxEmpty.cjs");0&&(module.exports={SkdxCombobox,SkdxComboboxContent,SkdxComboboxEmpty,SkdxComboboxInput,SkdxComboboxItem,SkdxComboboxPortal});

package/dist/combobox/index.d.cts

@@ -0,0 +1,7 @@
+export { SkdxCombobox } from './Combobox.cjs';
+export type { SkdxComboboxFilter, SkdxComboboxItemEntry } from './Combobox.cjs';
+export { SkdxComboboxInput } from './ComboboxInput.cjs';
+export { SkdxComboboxPortal } from './ComboboxPortal.cjs';
+export { SkdxComboboxContent } from './ComboboxContent.cjs';
+export { SkdxComboboxItem } from './ComboboxItem.cjs';
+export { SkdxComboboxEmpty } from './ComboboxEmpty.cjs';

package/dist/combobox/index.d.ts

@@ -0,0 +1,7 @@
+export { SkdxCombobox } from './Combobox.js';
+export type { SkdxComboboxFilter, SkdxComboboxItemEntry } from './Combobox.js';
+export { SkdxComboboxInput } from './ComboboxInput.js';
+export { SkdxComboboxPortal } from './ComboboxPortal.js';
+export { SkdxComboboxContent } from './ComboboxContent.js';
+export { SkdxComboboxItem } from './ComboboxItem.js';
+export { SkdxComboboxEmpty } from './ComboboxEmpty.js';

package/dist/combobox/index.js

@@ -0,0 +1 @@
+import{SkdxCombobox as m}from"./Combobox.js";import{SkdxComboboxInput as r}from"./ComboboxInput.js";import{SkdxComboboxPortal as e}from"./ComboboxPortal.js";import{SkdxComboboxContent as C}from"./ComboboxContent.js";import{SkdxComboboxItem as k}from"./ComboboxItem.js";import{SkdxComboboxEmpty as f}from"./ComboboxEmpty.js";export{m as SkdxCombobox,C as SkdxComboboxContent,f as SkdxComboboxEmpty,r as SkdxComboboxInput,k as SkdxComboboxItem,e as SkdxComboboxPortal};

package/dist/command/Command.cjs

@@ -0,0 +1,5 @@
+"use strict";var u=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var E=Object.prototype.hasOwnProperty;var b=(s,i)=>{for(var t in i)u(s,t,{get:i[t],enumerable:!0})},I=(s,i,t,e)=>{if(i&&typeof i=="object"||typeof i=="function")for(let r of y(i))!E.call(s,r)&&r!==t&&u(s,r,{get:()=>i[r],enumerable:!(e=h(i,r))||e.enumerable});return s};var A=s=>I(u({},"__esModule",{value:!0}),s),n=(s,i,t,e)=>{for(var r=e>1?void 0:e?h(i,t):i,c=s.length-1,d;c>=0;c--)(d=s[c])&&(r=(e?d(i,t,r):d(r))||r);return e&&r&&u(i,t,r),r};var w={};b(w,{OPTION_SELECTOR:()=>f,SkdxCommand:()=>l,defaultCommandFilter:()=>g});module.exports=A(w);var a=require("lit"),o=require("lit/decorators.js"),m=require("../internal/define.cjs"),v=require("../internal/ids.cjs"),p=require("../internal/styles.cjs");var f='[role="option"]:not([data-disabled])';function g(s,i){return s.toLowerCase().includes(i.toLowerCase())}var l=class extends a.LitElement{constructor(){super(...arguments);this.listId=(0,v.nextId)("skdx-command-list");this.value="";this.search="";this.loading=!1;this._activeId=null}get activeId(){return this._activeId}get itemCount(){let t=this.querySelector('[role="listbox"]');return t?t.querySelectorAll('[role="option"]').length:0}matchesFilter(t){return this.filter==="manual"||this.search===""?!0:(typeof this.filter=="function"?this.filter:g)(t,this.search)}setSearch(t){t!==this.search&&(this.search=t,this.dispatchEvent(new CustomEvent("search-change",{detail:t,bubbles:!0,composed:!0})))}setValue(t){t!==this.value&&(this.value=t,this.dispatchEvent(new CustomEvent("value-change",{detail:t,bubbles:!0,composed:!0})))}setActiveId(t){if(this._activeId===t)return;this._activeId=t;let e=t?this.ownerDocument.getElementById(t):null;this.setValue(e?.getAttribute("data-value")??""),this.dispatchEvent(new CustomEvent("skdx-command-internal-update"))}syncActiveId(){let t=this.querySelector('[role="listbox"]'),e=t?Array.from(t.querySelectorAll(f)):[];this._activeId&&e.some(r=>r.id===this._activeId)||this.setActiveId(e[0]?.id??null)}willUpdate(t){if(t.has("search")||t.has("filter")){for(let e of this.querySelectorAll("skdx-command-item"))e.refresh?.();this.syncActiveId()}t.has("value")&&this.applyValue()}updated(t){t.has("loading")&&this.toggleAttribute("data-loading",this.loading),(t.has("search")||t.has("filter")||t.has("loading"))&&this.dispatchEvent(new CustomEvent("skdx-command-internal-update"))}applyValue(){if(!this.value||(this._activeId?this.ownerDocument.getElementById(this._activeId):null)?.getAttribute("data-value")===this.value)return;let e=Array.from(this.querySelectorAll('[role="option"]')).find(r=>r.getAttribute("data-value")===this.value);e&&(this._activeId=e.id,this.dispatchEvent(new CustomEvent("skdx-command-internal-update")))}render(){return a.html`<slot></slot>`}};l.styles=[p.hiddenHostStyles,a.css`
+      :host {
+        display: contents;
+      }
+    `],n([(0,o.property)({type:String})],l.prototype,"value",2),n([(0,o.property)({type:String})],l.prototype,"search",2),n([(0,o.property)({converter:{fromAttribute:t=>t==="manual"?"manual":void 0}})],l.prototype,"filter",2),n([(0,o.property)({type:Boolean,reflect:!0})],l.prototype,"loading",2),n([(0,o.state)()],l.prototype,"_activeId",2),l=n([(0,m.customElement)("skdx-command","command","root")],l);0&&(module.exports={OPTION_SELECTOR,SkdxCommand,defaultCommandFilter});