@skdx/web-components 0.28.0 → 0.29.0

package/dist/command/Command.cjs

@@ -1,5 +1,5 @@
-"use strict";var h=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var M=Object.prototype.hasOwnProperty;var T=(n,r)=>{for(var t in r)h(n,t,{get:r[t],enumerable:!0})},L=(n,r,t,i)=>{if(r&&typeof r=="object"||typeof r=="function")for(let e of I(r))!M.call(n,e)&&e!==t&&h(n,e,{get:()=>r[e],enumerable:!(i=g(r,e))||i.enumerable});return n};var V=n=>L(h({},"__esModule",{value:!0}),n),o=(n,r,t,i)=>{for(var e=i>1?void 0:i?g(r,t):r,a=n.length-1,c;a>=0;a--)(c=n[a])&&(e=(i?c(r,t,e):c(e))||e);return i&&e&&h(r,t,e),e};var _={};T(_,{OPTION_SELECTOR:()=>m,SkdxCommand:()=>s,defaultCommandFilter:()=>v,scrollIntoList:()=>y});module.exports=V(_);var d=require("lit"),l=require("lit/decorators.js"),p=require("../internal/authored.cjs"),b=require("../internal/define.cjs"),E=require("../internal/ids.cjs"),f=require("../internal/scored-filter.cjs"),A=require("../internal/styles.cjs"),u=require("./CommandAnatomy.cjs"),S=require("./CommandSeparator.cjs");var m='[role="option"]:not([data-disabled])';function v(n,r,t){let i=r.toLowerCase();return n.toLowerCase().includes(i)?!0:t?.some(e=>e.toLowerCase().includes(i))??!1}function y(n,r){if(!n.contains(r))return;let t=n.getBoundingClientRect(),i=r.getBoundingClientRect(),e=i.top-t.top,a=i.bottom-t.bottom;e<0?n.scrollTop+=e:a>0&&(n.scrollTop+=a)}var s=class extends d.LitElement{constructor(){super(...arguments);this.listId=(0,E.nextId)("skdx-command-list");this.value="";this.defaultValue="";this.search="";this.defaultSearch="";this.loading=!1;this.loop=!1;this.disablePointerSelection=!1;this._activeId=null;this.pendingValue=!1;this.fillAnatomy=()=>{if((0,p.hasAuthoredParts)(this,u.COMMAND_ANATOMY_GENERATED,u.COMMAND_RENDER_SLOTS)){this._anatomyGroupsRef=void 0;return}this.groups!==this._anatomyGroupsRef||!(0,p.hasGeneratedContent)(this,u.COMMAND_ANATOMY_GENERATED)?(this._anatomyGroupsRef=this.groups,(0,u.fillCommandAnatomy)(this)):(0,u.refreshCommandAnatomyText)(this)}}get activeId(){return this._activeId}get itemCount(){let t=this.querySelector('[role="listbox"]');return t?t.querySelectorAll('[role="option"]').length:0}matchesFilter(t,i){if(this.filter==="manual"||this.search==="")return!0;let e=typeof this.filter=="function"?this.filter:v;return(0,f.filterKeeps)(e(t,this.search,i))}rankedOptions(t){if(this.filter==="manual"||this.search==="")return Array.from(t.querySelectorAll(m));let i=typeof this.filter=="function"?this.filter:v;return(0,f.sortByScore)(t,m,e=>{let a=this.ownerDocument.getElementById(e);if(!a)return null;let c=i(a.value,this.search,a.keywords);return typeof c=="number"?c:null})}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 i=t?this.ownerDocument.getElementById(t):null;this.setValue(i?.getAttribute("data-value")??""),this.dispatchEvent(new CustomEvent("skdx-command-internal-update"))}syncActiveId(){if(this.pendingValue&&(this.applyValue(),this.pendingValue))return;let t=this.querySelector('[role="listbox"]'),i=t?this.rankedOptions(t):[];if(this._activeId&&i.some(a=>a.id===this._activeId))return;let e=i[0];this.setActiveId(e?.id??null),t&&e&&y(t,e)}visibleOptions(){let t=this.querySelector('[role="listbox"]');return t?this.rankedOptions(t):[]}connectedCallback(){super.connectedCallback(),this.defaultSearch!==""&&this.search===""&&(this.search=this.defaultSearch),this.defaultValue!==""&&this.value===""&&(this.value=this.defaultValue),this.pendingValue=this.value!=="";let t=this.querySelector("skdx-command-list")?.id;t&&(this.listId=t),queueMicrotask(this.fillAnatomy)}willUpdate(t){if(t.has("value")&&(this.pendingValue=this.value!==""),t.has("search")||t.has("filter")){for(let i of this.querySelectorAll("skdx-command-item"))i.refresh?.();this.syncActiveId()}t.has("value")&&this.applyValue()}updated(t){this.fillAnatomy(),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.pendingValue=!1;return}if((this._activeId?this.ownerDocument.getElementById(this._activeId):null)?.getAttribute("data-value")===this.value){this.pendingValue=!1;return}let i=Array.from(this.querySelectorAll('[role="option"]')).find(a=>a.getAttribute("data-value")===this.value);if(!i)return;this.pendingValue=!1,this._activeId=i.id;let e=this.querySelector('[role="listbox"]');e&&y(e,i),this.dispatchEvent(new CustomEvent("skdx-command-internal-update"))}render(){return d.html`<slot @slotchange=${this.fillAnatomy}></slot>`}};s.styles=[A.hiddenHostStyles,d.css`
+"use strict";var p=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var L=Object.prototype.hasOwnProperty;var V=(o,r)=>{for(var t in r)p(o,t,{get:r[t],enumerable:!0})},_=(o,r,t,i)=>{if(r&&typeof r=="object"||typeof r=="function")for(let e of I(r))!L.call(o,e)&&e!==t&&p(o,e,{get:()=>r[e],enumerable:!(i=A(r,e))||i.enumerable});return o};var S=o=>_(p({},"__esModule",{value:!0}),o),l=(o,r,t,i)=>{for(var e=i>1?void 0:i?A(r,t):r,a=o.length-1,c;a>=0;a--)(c=o[a])&&(e=(i?c(r,t,e):c(e))||e);return i&&e&&p(r,t,e),e};var H={};V(H,{OPTION_SELECTOR:()=>g,SkdxCommand:()=>s,defaultCommandFilter:()=>v,scrollIntoList:()=>b});module.exports=S(H);var h=require("lit"),n=require("lit/decorators.js"),f=require("../internal/authored.cjs"),E=require("../internal/define.cjs"),M=require("../internal/ids.cjs"),m=require("../internal/scored-filter.cjs"),T=require("../internal/styles.cjs"),u=require("./CommandAnatomy.cjs"),G=require("./CommandSeparator.cjs"),y=require("../internal/events.cjs"),d=require("./family.cjs");var g='[role="option"]:not([data-disabled])';function v(o,r,t){let i=r.toLowerCase();return o.toLowerCase().includes(i)?!0:t?.some(e=>e.toLowerCase().includes(i))??!1}function b(o,r){if(!o.contains(r))return;let t=o.getBoundingClientRect(),i=r.getBoundingClientRect(),e=i.top-t.top,a=i.bottom-t.bottom;e<0?o.scrollTop+=e:a>0&&(o.scrollTop+=a)}var s=class extends h.LitElement{constructor(){super(...arguments);this.listId=(0,M.nextId)("skdx-command-list");this.value="";this.defaultValue="";this.search="";this.defaultSearch="";this.loading=!1;this.loop=!1;this.disablePointerSelection=!1;this._activeId=null;this.pendingValue=!1;this.fillAnatomy=()=>{if((0,f.hasAuthoredParts)(this,u.COMMAND_ANATOMY_GENERATED,u.COMMAND_RENDER_SLOTS)){this._anatomyGroupsRef=void 0;return}this.groups!==this._anatomyGroupsRef||!(0,f.hasGeneratedContent)(this,u.COMMAND_ANATOMY_GENERATED)?(this._anatomyGroupsRef=this.groups,(0,u.fillCommandAnatomy)(this)):(0,u.refreshCommandAnatomyText)(this)}}get activeId(){return this._activeId}get itemCount(){let t=this.querySelector('[role="listbox"]');return t?t.querySelectorAll('[role="option"]').length:0}matchesFilter(t,i){if(this.filter==="manual"||this.search==="")return!0;let e=typeof this.filter=="function"?this.filter:v;return(0,m.filterKeeps)(e(t,this.search,i))}rankedOptions(t){if(this.filter==="manual"||this.search==="")return Array.from(t.querySelectorAll(g));let i=typeof this.filter=="function"?this.filter:v;return(0,m.sortByScore)(t,g,e=>{let a=this.ownerDocument.getElementById(e);if(!a)return null;let c=i(a.value,this.search,a.keywords);return typeof c=="number"?c:null})}setSearch(t){t!==this.search&&(this.search=t,(0,y.emit)(this,"search-change",t))}setValue(t){t!==this.value&&(this.value=t,(0,y.emit)(this,"value-change",t))}setActiveId(t){if(this._activeId===t)return;this._activeId=t;let i=t?this.ownerDocument.getElementById(t):null;this.setValue(i?.getAttribute("data-value")??""),d.COMMAND_FAMILY.notify(this)}syncActiveId(){if(this.pendingValue&&(this.applyValue(),this.pendingValue))return;let t=this.querySelector('[role="listbox"]'),i=t?this.rankedOptions(t):[];if(this._activeId&&i.some(a=>a.id===this._activeId))return;let e=i[0];this.setActiveId(e?.id??null),t&&e&&b(t,e)}visibleOptions(){let t=this.querySelector('[role="listbox"]');return t?this.rankedOptions(t):[]}connectedCallback(){super.connectedCallback(),this.defaultSearch!==""&&this.search===""&&(this.search=this.defaultSearch),this.defaultValue!==""&&this.value===""&&(this.value=this.defaultValue),this.pendingValue=this.value!=="";let t=this.querySelector("skdx-command-list")?.id;t&&(this.listId=t),queueMicrotask(this.fillAnatomy)}willUpdate(t){if(t.has("value")&&(this.pendingValue=this.value!==""),t.has("search")||t.has("filter")){for(let i of this.querySelectorAll("skdx-command-item"))i.refresh?.();this.syncGeneratedGroups(),this.syncActiveId()}t.has("value")&&this.applyValue()}syncGeneratedGroups(){for(let t of this.querySelectorAll(`skdx-command-group[${u.COMMAND_ANATOMY_GENERATED}]`))t.hidden=!t.querySelector('[role="option"]')}updated(t){this.fillAnatomy(),t.has("loading")&&this.toggleAttribute("data-loading",this.loading),(t.has("search")||t.has("filter")||t.has("loading"))&&d.COMMAND_FAMILY.notify(this)}applyValue(){if(!this.value){this.pendingValue=!1;return}if((this._activeId?this.ownerDocument.getElementById(this._activeId):null)?.getAttribute("data-value")===this.value){this.pendingValue=!1;return}let i=Array.from(this.querySelectorAll('[role="option"]')).find(a=>a.getAttribute("data-value")===this.value);if(!i)return;this.pendingValue=!1,this._activeId=i.id;let e=this.querySelector('[role="listbox"]');e&&b(e,i),d.COMMAND_FAMILY.notify(this)}render(){return h.html`<slot @slotchange=${this.fillAnatomy}></slot>`}};s.styles=[T.hiddenHostStyles,h.css`
       :host {
         display: contents;
       }
-    `],o([(0,l.property)({type:String})],s.prototype,"value",2),o([(0,l.property)({type:String,attribute:"default-value"})],s.prototype,"defaultValue",2),o([(0,l.property)({type:String})],s.prototype,"search",2),o([(0,l.property)({type:String,attribute:"default-search"})],s.prototype,"defaultSearch",2),o([(0,l.property)({converter:{fromAttribute:t=>t==="manual"?"manual":void 0}})],s.prototype,"filter",2),o([(0,l.property)({type:Boolean,reflect:!0})],s.prototype,"loading",2),o([(0,l.property)({type:Boolean,reflect:!0})],s.prototype,"loop",2),o([(0,l.property)({type:Boolean,attribute:"disable-pointer-selection",reflect:!0})],s.prototype,"disablePointerSelection",2),o([(0,l.property)({attribute:!1})],s.prototype,"groups",2),o([(0,l.property)({type:String})],s.prototype,"placeholder",2),o([(0,l.property)({type:String,attribute:"empty-message"})],s.prototype,"emptyMessage",2),o([(0,l.property)({type:String,attribute:"loading-message"})],s.prototype,"loadingMessage",2),o([(0,l.state)()],s.prototype,"_activeId",2),s=o([(0,b.customElement)("skdx-command","command","root")],s);0&&(module.exports={OPTION_SELECTOR,SkdxCommand,defaultCommandFilter,scrollIntoList});
+    `],l([(0,n.property)({type:String})],s.prototype,"value",2),l([(0,n.property)({type:String,attribute:"default-value"})],s.prototype,"defaultValue",2),l([(0,n.property)({type:String})],s.prototype,"search",2),l([(0,n.property)({type:String,attribute:"default-search"})],s.prototype,"defaultSearch",2),l([(0,n.property)({converter:{fromAttribute:t=>t==="manual"?"manual":void 0}})],s.prototype,"filter",2),l([(0,n.property)({type:Boolean,reflect:!0})],s.prototype,"loading",2),l([(0,n.property)({type:Boolean,reflect:!0})],s.prototype,"loop",2),l([(0,n.property)({type:Boolean,attribute:"disable-pointer-selection",reflect:!0})],s.prototype,"disablePointerSelection",2),l([(0,n.property)({attribute:!1})],s.prototype,"groups",2),l([(0,n.property)({type:String})],s.prototype,"placeholder",2),l([(0,n.property)({type:String,attribute:"empty-message"})],s.prototype,"emptyMessage",2),l([(0,n.property)({type:String,attribute:"loading-message"})],s.prototype,"loadingMessage",2),l([(0,n.state)()],s.prototype,"_activeId",2),s=l([(0,E.customElement)("skdx-command","command","root")],s);0&&(module.exports={OPTION_SELECTOR,SkdxCommand,defaultCommandFilter,scrollIntoList});

package/dist/command/Command.d.cts

@@ -1,42 +1,23 @@
-import { LitElement, type PropertyValues } from 'lit';
+import { LitElement, type PropertyValues, type TemplateResult } from 'lit';
 import type { SkdxCommandGroupDescriptor } from './types.cjs';
 import './CommandSeparator.cjs';
 /** Matches a mounted, enabled `<skdx-command-item>` — an item the current `filter` rejects drops its `role` and is naturally excluded. */
 export declare const OPTION_SELECTOR = "[role=\"option\"]:not([data-disabled])";
-/**
- * How items are filtered against the current search: `'manual'` filters
- * nothing (the consumer mounts only the matching items), a predicate moves
- * filtering inside the component. Mirrors `SkdxComboboxFilter`'s shape, but
- * the default is inverted: Command filters with a built-in matcher unless
- * told otherwise, where Combobox filters nothing unless given a predicate.
- *
- * `keywords` is the item's aliases, passed through so a custom predicate can
- * honour them.
- *
- * A predicate may return a number instead of a boolean, in which case it also
- * ranks: `0`/`false` exclude, `true`/positive keep, and survivors reorder by
- * score descending. A boolean predicate never reorders anything.
- */
+/** How items are filtered against the current search: `'manual'` skips filtering, or a predicate matches (and optionally ranks) each item. */
 export type SkdxCommandFilter = 'manual' | ((itemValue: string, search: string, keywords?: readonly string[]) => boolean | number);
-/**
- * The built-in matcher: case-insensitive substring on the item's `value`, or on
- * any of its `keywords` — which is what makes "Toggle theme" findable by typing
- * "dark mode".
- */
+/** The built-in matcher: case-insensitive substring match against the item's `value` or its `keywords`. */
 export declare function defaultCommandFilter(itemValue: string, search: string, keywords?: readonly string[]): boolean;
 /**
- * Scrolls `item` into view inside the list only, by the minimum needed.
- * Not `scrollIntoView()` which walks ancestor chain; component-assigned highlights must not scroll the page.
+ * Scrolls `item` into view inside `list` only; never `scrollIntoView()`, which would also scroll the page.
  * @internal
  */
 export declare function scrollIntoList(list: HTMLElement, item: HTMLElement): void;
 /**
- * A cmdk-style command palette with virtual focus (`aria-activedescendant`), real focus on `<skdx-command-input>`.
- * Renders canonical anatomy (Input + List) unless given children. Items filter via `matchesFilter()` on search text.
+ * A cmdk-style command palette with virtual focus, real focus kept on `<skdx-command-input>`.
  * @fires value-change - The highlight moved. `detail` is the highlighted item's `value`.
  * @fires search-change - The search text changed. `detail` is the new text.
- * @fires item-select - Fired with the `groups` entry that was run, after that entry's own `onSelect`. Named apart from the Item part's own `select`, which bubbles through this element carrying its value.
- * @slot item - Per-command content for the derived anatomy, addressed by `data-value` — this package's form of the `renderItem` hook the other four ports take as a function. Stamped into the matching `<skdx-command-item>` in place of its plain label text.
+ * @fires item-select - Fired with the selected `groups` entry, after its own `onSelect`.
+ * @slot item - Per-command content for the derived anatomy, addressed by `data-value`.
  * @example
  * ```html
  * <skdx-command>
@@ -54,88 +35,65 @@ export declare function scrollIntoList(list: HTMLElement, item: HTMLElement): vo
  */
 export declare class SkdxCommand extends LitElement {
     static styles: import("lit").CSSResult[];
+    /** Id stamped on the derived listbox, for external `aria-controls` references. */
     listId: string;
     /**
-     * Value of the highlighted item. Setting it moves the highlight to the item
-     * carrying that `data-value`; listen for `value-change` to observe it.
+     * Value of the highlighted item; setting it moves the highlight to the item carrying that `data-value`.
      * @default '' — the first mounted item is highlighted.
      */
     value: string;
     /**
-     * Value of the initially highlighted item, for uncontrolled usage — read
-     * once, before the first render, and then left alone. Ignored where `value`
-     * already names an item.
+     * Value of the initially highlighted item, for uncontrolled usage; read once, before the first render.
      * @default '' — the first mounted item wins the highlight.
      */
     defaultValue: string;
     /**
-     * Current search text. `<skdx-command-input>` writes into this as the user
-     * types, and it is what `matches()` filters against.
+     * Current search text; `<skdx-command-input>` writes into this as the user types.
      * @default ''
      */
     search: string;
     /**
-     * Initial search text, for uncontrolled usage — read once, before the first
-     * render, and then left alone. Ignored where `search` is already non-empty.
+     * Initial search text, for uncontrolled usage; read once, before the first render.
      * @default '' — an unfiltered palette.
      */
     defaultSearch: string;
     /**
-     * Replaces the built-in matcher (case-insensitive substring on the item's
-     * `value`) — return `true` to keep an item mounted for this search — or
-     * `'manual'` to filter nothing, when the consumer already mounts only the
-     * matching items. A predicate is property-only (a function has no attribute
-     * form), but `filter="manual"` works in plain markup: opting *out* of
-     * filtering is the one case a script-free consumer needs, and every other
-     * framework spells it the same way.
+     * Replaces the built-in matcher, or `'manual'` to filter nothing and let the consumer mount only matching items.
      * @default undefined — the built-in matcher.
      */
     filter?: SkdxCommandFilter;
     /**
-     * Marks results as in flight: `data-loading` here, `aria-busy`/`data-loading`
-     * on `<skdx-command-list>`, `<skdx-command-loading>` shown, and
-     * `<skdx-command-empty>` kept hidden.
+     * Marks results as in flight, toggling `data-loading` and the loading/empty parts' visibility.
      * @default false
      */
     loading: boolean;
     /**
-     * Wraps arrow navigation around the ends of the item list: Arrow Down from
-     * the last item highlights the first, Arrow Up from the first highlights
-     * the last. The opposite default from `<skdx-combobox>`'s and
-     * `<skdx-autocomplete>`'s, whose popup list wraps; a palette's list is the
-     * whole surface, and cmdk — the reference here — clamps.
+     * Wraps arrow navigation around the ends of the item list.
      * @default false — what this palette already did, so nothing changes for an existing consumer.
      */
     loop: boolean;
     /**
-     * Stops pointer-enter from moving the highlight, leaving it wherever the
-     * keyboard put it. A mouse resting over the list otherwise steals the
-     * highlight from a keyboard user mid-search.
+     * Stops pointer-enter from moving the highlight, leaving it wherever the keyboard put it.
      * @default false — hover keeps tracking the pointer.
      */
     disablePointerSelection: boolean;
     /**
-     * The palette's commands, in labelled sections. `groups={[{ items }]}` is the
-     * flat case.
+     * The palette's commands, in labelled sections.
      * @default undefined — an empty palette.
      */
     groups?: readonly SkdxCommandGroupDescriptor[];
     /**
-     * Placeholder text for the derived `<skdx-command-input>`, and the accessible
-     * name of the derived `<skdx-command-list>` — a `role="listbox"` must be
-     * named and nothing else in the recipe supplies one.
+     * Placeholder text for the derived `<skdx-command-input>`, and the accessible name of the derived `<skdx-command-list>`.
      * @default undefined — no placeholder, and an unnamed derived list.
      */
     placeholder?: string;
     /**
-     * Text the derived `<skdx-command-empty>` shows when nothing matches the
-     * search.
+     * Text the derived `<skdx-command-empty>` shows when nothing matches the search.
      * @default undefined — no empty state is derived.
      */
     emptyMessage?: string;
     /**
-     * Text the derived `<skdx-command-loading>` live region announces while
-     * `loading` is set.
+     * Text the derived `<skdx-command-loading>` live region announces while `loading` is set.
      * @default undefined — no loading region is derived, since an empty `role="status"` announces nothing.
      */
     loadingMessage?: string;
@@ -146,100 +104,40 @@ export declare class SkdxCommand extends LitElement {
     get itemCount(): number;
     /**
      * Whether an item's value survives the current `filter` predicate.
-     *
-     * Named `matchesFilter`, not `matches`: a custom element inherits
-     * `Element.prototype.matches(selectors)`, so the shorter name would shadow
-     * the DOM method and silently break any `commandEl.matches('.sel')` call.
-     *
-     * Called by the family's `*-item` element on its root to decide its own
-     * visibility, not consumer API — `public` only because the item is an
-     * instance of a different class, which `protected` cannot express.
-     *
      * @internal
      */
     matchesFilter(itemValue: string, keywords?: readonly string[]): boolean;
-    /**
-     * Currently-visible items inside `list`, ranked by the `boolean | number`
-     * `filter`: a numeric predicate sorts them by descending score and paints
-     * inline CSS `order` to match; `'manual'`, an empty
-     * search, or a predicate that never returns a number — the built-in matcher
-     * included — leaves DOM order exactly as rendered. Called from
-     * {@link syncActiveId}, so the highlight always lands on the top-ranked
-     * item.
-     */
     private rankedOptions;
     /**
      * Sets `search` and dispatches `search-change`.
-     *
-     * Called by `<skdx-command-input>` on its root as the user types, not
-     * consumer API — a consumer drives the search by assigning `search`.
-     * `public` only because the input is an instance of a different class.
-     *
      * @internal
      */
     setSearch(search: string): void;
     /**
      * Sets `value` and dispatches `value-change`.
-     *
-     * The internal half of {@link setActiveId} — the highlight moving *is* the
-     * value changing. Not consumer API, same as {@link setSearch}.
-     *
      * @internal
      */
     setValue(value: string): void;
-    /**
-     * @internal Sets the highlighted item and notifies descendants. No-ops if
-     * unchanged. Moving the highlight is also a value change: `value` always
-     * names the highlighted item, which is what makes it controllable.
-     */
+    /** @internal Sets the highlighted item and notifies descendants. */
     setActiveId(id: string | null): void;
-    /**
-     * @internal Called by `<skdx-command-list>` whenever its mounted items
-     * change. Keeps the top visible result highlighted so Enter always has a
-     * target, matching command-palette convention.
-     *
-     * Runs on mount and again on every keystroke that changes the results,
-     * when the list may be scrolled halfway down from an earlier, longer
-     * result set. See {@link scrollIntoList} for why it is not `scrollIntoView`.
-     */
+    /** @internal Keeps the top visible result highlighted whenever the mounted items change. */
     syncActiveId(): void;
     /**
-     * Every item the highlight may land on, ranked by score when `filter`
-     * scores numerically, DOM order otherwise.
-     *
-     * @internal Read by `<skdx-command-input>`, an instance of a different
-     * class, which `protected` cannot express.
+     * Every item the highlight may land on, ranked by score when `filter` scores numerically.
+     * @internal
      */
     visibleOptions(): HTMLElement[];
     /** Set while `value` came from outside and no mounted item carries it yet. */
     private pendingValue;
-    /**
-     * Uncontrolled seeding, and the reservation that keeps a declared highlight
-     * alive long enough to resolve.
-     *
-     * Both happen here rather than in `willUpdate` because `<skdx-command-list>`
-     * syncs the highlight from a MutationObserver microtask that can beat Lit's
-     * first update. `pendingValue` tells that sync to leave the highlight alone
-     * until the item carrying `value` has actually mounted.
-     *
-     * Guarded on emptiness rather than `??=`: both defaults land on class
-     * fields with a concrete `''`, and a consumer who set the controlled prop
-     * in the same markup must still win.
-     */
     connectedCallback(): void;
     /** The `groups` reference the generated anatomy was last built for. */
     private _anatomyGroupsRef?;
-    /**
-     * Draws the canonical anatomy into the light DOM when this element has no
-     * consumer-authored part — "simple by default" — and hands it straight back
-     * once one appears. Gated on the `groups` reference, since a rebuild tears
-     * down the rendered commands; `placeholder`/`empty-message` refresh in place.
-     */
     private readonly fillAnatomy;
     protected willUpdate(changed: PropertyValues): void;
+    private syncGeneratedGroups;
     protected updated(changed: PropertyValues): void;
     private applyValue;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/command/Command.d.ts

@@ -1,42 +1,23 @@
-import { LitElement, type PropertyValues } from 'lit';
+import { LitElement, type PropertyValues, type TemplateResult } from 'lit';
 import type { SkdxCommandGroupDescriptor } from './types.js';
 import './CommandSeparator.js';
 /** Matches a mounted, enabled `<skdx-command-item>` — an item the current `filter` rejects drops its `role` and is naturally excluded. */
 export declare const OPTION_SELECTOR = "[role=\"option\"]:not([data-disabled])";
-/**
- * How items are filtered against the current search: `'manual'` filters
- * nothing (the consumer mounts only the matching items), a predicate moves
- * filtering inside the component. Mirrors `SkdxComboboxFilter`'s shape, but
- * the default is inverted: Command filters with a built-in matcher unless
- * told otherwise, where Combobox filters nothing unless given a predicate.
- *
- * `keywords` is the item's aliases, passed through so a custom predicate can
- * honour them.
- *
- * A predicate may return a number instead of a boolean, in which case it also
- * ranks: `0`/`false` exclude, `true`/positive keep, and survivors reorder by
- * score descending. A boolean predicate never reorders anything.
- */
+/** How items are filtered against the current search: `'manual'` skips filtering, or a predicate matches (and optionally ranks) each item. */
 export type SkdxCommandFilter = 'manual' | ((itemValue: string, search: string, keywords?: readonly string[]) => boolean | number);
-/**
- * The built-in matcher: case-insensitive substring on the item's `value`, or on
- * any of its `keywords` — which is what makes "Toggle theme" findable by typing
- * "dark mode".
- */
+/** The built-in matcher: case-insensitive substring match against the item's `value` or its `keywords`. */
 export declare function defaultCommandFilter(itemValue: string, search: string, keywords?: readonly string[]): boolean;
 /**
- * Scrolls `item` into view inside the list only, by the minimum needed.
- * Not `scrollIntoView()` which walks ancestor chain; component-assigned highlights must not scroll the page.
+ * Scrolls `item` into view inside `list` only; never `scrollIntoView()`, which would also scroll the page.
  * @internal
  */
 export declare function scrollIntoList(list: HTMLElement, item: HTMLElement): void;
 /**
- * A cmdk-style command palette with virtual focus (`aria-activedescendant`), real focus on `<skdx-command-input>`.
- * Renders canonical anatomy (Input + List) unless given children. Items filter via `matchesFilter()` on search text.
+ * A cmdk-style command palette with virtual focus, real focus kept on `<skdx-command-input>`.
  * @fires value-change - The highlight moved. `detail` is the highlighted item's `value`.
  * @fires search-change - The search text changed. `detail` is the new text.
- * @fires item-select - Fired with the `groups` entry that was run, after that entry's own `onSelect`. Named apart from the Item part's own `select`, which bubbles through this element carrying its value.
- * @slot item - Per-command content for the derived anatomy, addressed by `data-value` — this package's form of the `renderItem` hook the other four ports take as a function. Stamped into the matching `<skdx-command-item>` in place of its plain label text.
+ * @fires item-select - Fired with the selected `groups` entry, after its own `onSelect`.
+ * @slot item - Per-command content for the derived anatomy, addressed by `data-value`.
  * @example
  * ```html
  * <skdx-command>
@@ -54,88 +35,65 @@ export declare function scrollIntoList(list: HTMLElement, item: HTMLElement): vo
  */
 export declare class SkdxCommand extends LitElement {
     static styles: import("lit").CSSResult[];
+    /** Id stamped on the derived listbox, for external `aria-controls` references. */
     listId: string;
     /**
-     * Value of the highlighted item. Setting it moves the highlight to the item
-     * carrying that `data-value`; listen for `value-change` to observe it.
+     * Value of the highlighted item; setting it moves the highlight to the item carrying that `data-value`.
      * @default '' — the first mounted item is highlighted.
      */
     value: string;
     /**
-     * Value of the initially highlighted item, for uncontrolled usage — read
-     * once, before the first render, and then left alone. Ignored where `value`
-     * already names an item.
+     * Value of the initially highlighted item, for uncontrolled usage; read once, before the first render.
      * @default '' — the first mounted item wins the highlight.
      */
     defaultValue: string;
     /**
-     * Current search text. `<skdx-command-input>` writes into this as the user
-     * types, and it is what `matches()` filters against.
+     * Current search text; `<skdx-command-input>` writes into this as the user types.
      * @default ''
      */
     search: string;
     /**
-     * Initial search text, for uncontrolled usage — read once, before the first
-     * render, and then left alone. Ignored where `search` is already non-empty.
+     * Initial search text, for uncontrolled usage; read once, before the first render.
      * @default '' — an unfiltered palette.
      */
     defaultSearch: string;
     /**
-     * Replaces the built-in matcher (case-insensitive substring on the item's
-     * `value`) — return `true` to keep an item mounted for this search — or
-     * `'manual'` to filter nothing, when the consumer already mounts only the
-     * matching items. A predicate is property-only (a function has no attribute
-     * form), but `filter="manual"` works in plain markup: opting *out* of
-     * filtering is the one case a script-free consumer needs, and every other
-     * framework spells it the same way.
+     * Replaces the built-in matcher, or `'manual'` to filter nothing and let the consumer mount only matching items.
      * @default undefined — the built-in matcher.
      */
     filter?: SkdxCommandFilter;
     /**
-     * Marks results as in flight: `data-loading` here, `aria-busy`/`data-loading`
-     * on `<skdx-command-list>`, `<skdx-command-loading>` shown, and
-     * `<skdx-command-empty>` kept hidden.
+     * Marks results as in flight, toggling `data-loading` and the loading/empty parts' visibility.
      * @default false
      */
     loading: boolean;
     /**
-     * Wraps arrow navigation around the ends of the item list: Arrow Down from
-     * the last item highlights the first, Arrow Up from the first highlights
-     * the last. The opposite default from `<skdx-combobox>`'s and
-     * `<skdx-autocomplete>`'s, whose popup list wraps; a palette's list is the
-     * whole surface, and cmdk — the reference here — clamps.
+     * Wraps arrow navigation around the ends of the item list.
      * @default false — what this palette already did, so nothing changes for an existing consumer.
      */
     loop: boolean;
     /**
-     * Stops pointer-enter from moving the highlight, leaving it wherever the
-     * keyboard put it. A mouse resting over the list otherwise steals the
-     * highlight from a keyboard user mid-search.
+     * Stops pointer-enter from moving the highlight, leaving it wherever the keyboard put it.
      * @default false — hover keeps tracking the pointer.
      */
     disablePointerSelection: boolean;
     /**
-     * The palette's commands, in labelled sections. `groups={[{ items }]}` is the
-     * flat case.
+     * The palette's commands, in labelled sections.
      * @default undefined — an empty palette.
      */
     groups?: readonly SkdxCommandGroupDescriptor[];
     /**
-     * Placeholder text for the derived `<skdx-command-input>`, and the accessible
-     * name of the derived `<skdx-command-list>` — a `role="listbox"` must be
-     * named and nothing else in the recipe supplies one.
+     * Placeholder text for the derived `<skdx-command-input>`, and the accessible name of the derived `<skdx-command-list>`.
      * @default undefined — no placeholder, and an unnamed derived list.
      */
     placeholder?: string;
     /**
-     * Text the derived `<skdx-command-empty>` shows when nothing matches the
-     * search.
+     * Text the derived `<skdx-command-empty>` shows when nothing matches the search.
      * @default undefined — no empty state is derived.
      */
     emptyMessage?: string;
     /**
-     * Text the derived `<skdx-command-loading>` live region announces while
-     * `loading` is set.
+     * Text the derived `<skdx-command-loading>` live region announces while `loading` is set.
      * @default undefined — no loading region is derived, since an empty `role="status"` announces nothing.
      */
     loadingMessage?: string;
@@ -146,100 +104,40 @@ export declare class SkdxCommand extends LitElement {
     get itemCount(): number;
     /**
      * Whether an item's value survives the current `filter` predicate.
-     *
-     * Named `matchesFilter`, not `matches`: a custom element inherits
-     * `Element.prototype.matches(selectors)`, so the shorter name would shadow
-     * the DOM method and silently break any `commandEl.matches('.sel')` call.
-     *
-     * Called by the family's `*-item` element on its root to decide its own
-     * visibility, not consumer API — `public` only because the item is an
-     * instance of a different class, which `protected` cannot express.
-     *
      * @internal
      */
     matchesFilter(itemValue: string, keywords?: readonly string[]): boolean;
-    /**
-     * Currently-visible items inside `list`, ranked by the `boolean | number`
-     * `filter`: a numeric predicate sorts them by descending score and paints
-     * inline CSS `order` to match; `'manual'`, an empty
-     * search, or a predicate that never returns a number — the built-in matcher
-     * included — leaves DOM order exactly as rendered. Called from
-     * {@link syncActiveId}, so the highlight always lands on the top-ranked
-     * item.
-     */
     private rankedOptions;
     /**
      * Sets `search` and dispatches `search-change`.
-     *
-     * Called by `<skdx-command-input>` on its root as the user types, not
-     * consumer API — a consumer drives the search by assigning `search`.
-     * `public` only because the input is an instance of a different class.
-     *
      * @internal
      */
     setSearch(search: string): void;
     /**
      * Sets `value` and dispatches `value-change`.
-     *
-     * The internal half of {@link setActiveId} — the highlight moving *is* the
-     * value changing. Not consumer API, same as {@link setSearch}.
-     *
      * @internal
      */
     setValue(value: string): void;
-    /**
-     * @internal Sets the highlighted item and notifies descendants. No-ops if
-     * unchanged. Moving the highlight is also a value change: `value` always
-     * names the highlighted item, which is what makes it controllable.
-     */
+    /** @internal Sets the highlighted item and notifies descendants. */
     setActiveId(id: string | null): void;
-    /**
-     * @internal Called by `<skdx-command-list>` whenever its mounted items
-     * change. Keeps the top visible result highlighted so Enter always has a
-     * target, matching command-palette convention.
-     *
-     * Runs on mount and again on every keystroke that changes the results,
-     * when the list may be scrolled halfway down from an earlier, longer
-     * result set. See {@link scrollIntoList} for why it is not `scrollIntoView`.
-     */
+    /** @internal Keeps the top visible result highlighted whenever the mounted items change. */
     syncActiveId(): void;
     /**
-     * Every item the highlight may land on, ranked by score when `filter`
-     * scores numerically, DOM order otherwise.
-     *
-     * @internal Read by `<skdx-command-input>`, an instance of a different
-     * class, which `protected` cannot express.
+     * Every item the highlight may land on, ranked by score when `filter` scores numerically.
+     * @internal
      */
     visibleOptions(): HTMLElement[];
     /** Set while `value` came from outside and no mounted item carries it yet. */
     private pendingValue;
-    /**
-     * Uncontrolled seeding, and the reservation that keeps a declared highlight
-     * alive long enough to resolve.
-     *
-     * Both happen here rather than in `willUpdate` because `<skdx-command-list>`
-     * syncs the highlight from a MutationObserver microtask that can beat Lit's
-     * first update. `pendingValue` tells that sync to leave the highlight alone
-     * until the item carrying `value` has actually mounted.
-     *
-     * Guarded on emptiness rather than `??=`: both defaults land on class
-     * fields with a concrete `''`, and a consumer who set the controlled prop
-     * in the same markup must still win.
-     */
     connectedCallback(): void;
     /** The `groups` reference the generated anatomy was last built for. */
     private _anatomyGroupsRef?;
-    /**
-     * Draws the canonical anatomy into the light DOM when this element has no
-     * consumer-authored part — "simple by default" — and hands it straight back
-     * once one appears. Gated on the `groups` reference, since a rebuild tears
-     * down the rendered commands; `placeholder`/`empty-message` refresh in place.
-     */
     private readonly fillAnatomy;
     protected willUpdate(changed: PropertyValues): void;
+    private syncGeneratedGroups;
     protected updated(changed: PropertyValues): void;
     private applyValue;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/command/Command.js

@@ -1,5 +1,5 @@
-var f=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var s=(l,a,t,e)=>{for(var i=e>1?void 0:e?m(a,t):a,n=l.length-1,u;n>=0;n--)(u=l[n])&&(i=(e?u(a,t,i):u(i))||i);return e&&i&&f(a,t,i),i};import{css as v,html as y,LitElement as g}from"lit";import{property as o,state as b}from"lit/decorators.js";import{hasAuthoredParts as E,hasGeneratedContent as A}from"../internal/authored.js";import{customElement as I}from"../internal/define.js";import{nextId as M}from"../internal/ids.js";import{filterKeeps as T,sortByScore as L}from"../internal/scored-filter.js";import{hiddenHostStyles as V}from"../internal/styles.js";import{COMMAND_ANATOMY_GENERATED as c,COMMAND_RENDER_SLOTS as _,fillCommandAnatomy as w,refreshCommandAnatomyText as S}from"./CommandAnatomy.js";import"./CommandSeparator.js";var d='[role="option"]:not([data-disabled])';function h(l,a,t){let e=a.toLowerCase();return l.toLowerCase().includes(e)?!0:t?.some(i=>i.toLowerCase().includes(e))??!1}function p(l,a){if(!l.contains(a))return;let t=l.getBoundingClientRect(),e=a.getBoundingClientRect(),i=e.top-t.top,n=e.bottom-t.bottom;i<0?l.scrollTop+=i:n>0&&(l.scrollTop+=n)}var r=class extends g{constructor(){super(...arguments);this.listId=M("skdx-command-list");this.value="";this.defaultValue="";this.search="";this.defaultSearch="";this.loading=!1;this.loop=!1;this.disablePointerSelection=!1;this._activeId=null;this.pendingValue=!1;this.fillAnatomy=()=>{if(E(this,c,_)){this._anatomyGroupsRef=void 0;return}this.groups!==this._anatomyGroupsRef||!A(this,c)?(this._anatomyGroupsRef=this.groups,w(this)):S(this)}}get activeId(){return this._activeId}get itemCount(){let t=this.querySelector('[role="listbox"]');return t?t.querySelectorAll('[role="option"]').length:0}matchesFilter(t,e){if(this.filter==="manual"||this.search==="")return!0;let i=typeof this.filter=="function"?this.filter:h;return T(i(t,this.search,e))}rankedOptions(t){if(this.filter==="manual"||this.search==="")return Array.from(t.querySelectorAll(d));let e=typeof this.filter=="function"?this.filter:h;return L(t,d,i=>{let n=this.ownerDocument.getElementById(i);if(!n)return null;let u=e(n.value,this.search,n.keywords);return typeof u=="number"?u:null})}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(){if(this.pendingValue&&(this.applyValue(),this.pendingValue))return;let t=this.querySelector('[role="listbox"]'),e=t?this.rankedOptions(t):[];if(this._activeId&&e.some(n=>n.id===this._activeId))return;let i=e[0];this.setActiveId(i?.id??null),t&&i&&p(t,i)}visibleOptions(){let t=this.querySelector('[role="listbox"]');return t?this.rankedOptions(t):[]}connectedCallback(){super.connectedCallback(),this.defaultSearch!==""&&this.search===""&&(this.search=this.defaultSearch),this.defaultValue!==""&&this.value===""&&(this.value=this.defaultValue),this.pendingValue=this.value!=="";let t=this.querySelector("skdx-command-list")?.id;t&&(this.listId=t),queueMicrotask(this.fillAnatomy)}willUpdate(t){if(t.has("value")&&(this.pendingValue=this.value!==""),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){this.fillAnatomy(),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.pendingValue=!1;return}if((this._activeId?this.ownerDocument.getElementById(this._activeId):null)?.getAttribute("data-value")===this.value){this.pendingValue=!1;return}let e=Array.from(this.querySelectorAll('[role="option"]')).find(n=>n.getAttribute("data-value")===this.value);if(!e)return;this.pendingValue=!1,this._activeId=e.id;let i=this.querySelector('[role="listbox"]');i&&p(i,e),this.dispatchEvent(new CustomEvent("skdx-command-internal-update"))}render(){return y`<slot @slotchange=${this.fillAnatomy}></slot>`}};r.styles=[V,v`
+var y=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var s=(n,a,t,e)=>{for(var i=e>1?void 0:e?g(a,t):a,o=n.length-1,u;o>=0;o--)(u=n[o])&&(i=(e?u(a,t,i):u(i))||i);return e&&i&&y(a,t,i),i};import{css as v,html as b,LitElement as A}from"lit";import{property as l,state as E}from"lit/decorators.js";import{hasAuthoredParts as M,hasGeneratedContent as T}from"../internal/authored.js";import{customElement as I}from"../internal/define.js";import{nextId as L}from"../internal/ids.js";import{filterKeeps as V,sortByScore as _}from"../internal/scored-filter.js";import{hiddenHostStyles as S}from"../internal/styles.js";import{COMMAND_ANATOMY_GENERATED as c,COMMAND_RENDER_SLOTS as H,fillCommandAnatomy as R,refreshCommandAnatomyText as G}from"./CommandAnatomy.js";import"./CommandSeparator.js";import{emit as p}from"../internal/events.js";import{COMMAND_FAMILY as h}from"./family.js";var d='[role="option"]:not([data-disabled])';function f(n,a,t){let e=a.toLowerCase();return n.toLowerCase().includes(e)?!0:t?.some(i=>i.toLowerCase().includes(e))??!1}function m(n,a){if(!n.contains(a))return;let t=n.getBoundingClientRect(),e=a.getBoundingClientRect(),i=e.top-t.top,o=e.bottom-t.bottom;i<0?n.scrollTop+=i:o>0&&(n.scrollTop+=o)}var r=class extends A{constructor(){super(...arguments);this.listId=L("skdx-command-list");this.value="";this.defaultValue="";this.search="";this.defaultSearch="";this.loading=!1;this.loop=!1;this.disablePointerSelection=!1;this._activeId=null;this.pendingValue=!1;this.fillAnatomy=()=>{if(M(this,c,H)){this._anatomyGroupsRef=void 0;return}this.groups!==this._anatomyGroupsRef||!T(this,c)?(this._anatomyGroupsRef=this.groups,R(this)):G(this)}}get activeId(){return this._activeId}get itemCount(){let t=this.querySelector('[role="listbox"]');return t?t.querySelectorAll('[role="option"]').length:0}matchesFilter(t,e){if(this.filter==="manual"||this.search==="")return!0;let i=typeof this.filter=="function"?this.filter:f;return V(i(t,this.search,e))}rankedOptions(t){if(this.filter==="manual"||this.search==="")return Array.from(t.querySelectorAll(d));let e=typeof this.filter=="function"?this.filter:f;return _(t,d,i=>{let o=this.ownerDocument.getElementById(i);if(!o)return null;let u=e(o.value,this.search,o.keywords);return typeof u=="number"?u:null})}setSearch(t){t!==this.search&&(this.search=t,p(this,"search-change",t))}setValue(t){t!==this.value&&(this.value=t,p(this,"value-change",t))}setActiveId(t){if(this._activeId===t)return;this._activeId=t;let e=t?this.ownerDocument.getElementById(t):null;this.setValue(e?.getAttribute("data-value")??""),h.notify(this)}syncActiveId(){if(this.pendingValue&&(this.applyValue(),this.pendingValue))return;let t=this.querySelector('[role="listbox"]'),e=t?this.rankedOptions(t):[];if(this._activeId&&e.some(o=>o.id===this._activeId))return;let i=e[0];this.setActiveId(i?.id??null),t&&i&&m(t,i)}visibleOptions(){let t=this.querySelector('[role="listbox"]');return t?this.rankedOptions(t):[]}connectedCallback(){super.connectedCallback(),this.defaultSearch!==""&&this.search===""&&(this.search=this.defaultSearch),this.defaultValue!==""&&this.value===""&&(this.value=this.defaultValue),this.pendingValue=this.value!=="";let t=this.querySelector("skdx-command-list")?.id;t&&(this.listId=t),queueMicrotask(this.fillAnatomy)}willUpdate(t){if(t.has("value")&&(this.pendingValue=this.value!==""),t.has("search")||t.has("filter")){for(let e of this.querySelectorAll("skdx-command-item"))e.refresh?.();this.syncGeneratedGroups(),this.syncActiveId()}t.has("value")&&this.applyValue()}syncGeneratedGroups(){for(let t of this.querySelectorAll(`skdx-command-group[${c}]`))t.hidden=!t.querySelector('[role="option"]')}updated(t){this.fillAnatomy(),t.has("loading")&&this.toggleAttribute("data-loading",this.loading),(t.has("search")||t.has("filter")||t.has("loading"))&&h.notify(this)}applyValue(){if(!this.value){this.pendingValue=!1;return}if((this._activeId?this.ownerDocument.getElementById(this._activeId):null)?.getAttribute("data-value")===this.value){this.pendingValue=!1;return}let e=Array.from(this.querySelectorAll('[role="option"]')).find(o=>o.getAttribute("data-value")===this.value);if(!e)return;this.pendingValue=!1,this._activeId=e.id;let i=this.querySelector('[role="listbox"]');i&&m(i,e),h.notify(this)}render(){return b`<slot @slotchange=${this.fillAnatomy}></slot>`}};r.styles=[S,v`
       :host {
         display: contents;
       }
-    `],s([o({type:String})],r.prototype,"value",2),s([o({type:String,attribute:"default-value"})],r.prototype,"defaultValue",2),s([o({type:String})],r.prototype,"search",2),s([o({type:String,attribute:"default-search"})],r.prototype,"defaultSearch",2),s([o({converter:{fromAttribute:t=>t==="manual"?"manual":void 0}})],r.prototype,"filter",2),s([o({type:Boolean,reflect:!0})],r.prototype,"loading",2),s([o({type:Boolean,reflect:!0})],r.prototype,"loop",2),s([o({type:Boolean,attribute:"disable-pointer-selection",reflect:!0})],r.prototype,"disablePointerSelection",2),s([o({attribute:!1})],r.prototype,"groups",2),s([o({type:String})],r.prototype,"placeholder",2),s([o({type:String,attribute:"empty-message"})],r.prototype,"emptyMessage",2),s([o({type:String,attribute:"loading-message"})],r.prototype,"loadingMessage",2),s([b()],r.prototype,"_activeId",2),r=s([I("skdx-command","command","root")],r);export{d as OPTION_SELECTOR,r as SkdxCommand,h as defaultCommandFilter,p as scrollIntoList};
+    `],s([l({type:String})],r.prototype,"value",2),s([l({type:String,attribute:"default-value"})],r.prototype,"defaultValue",2),s([l({type:String})],r.prototype,"search",2),s([l({type:String,attribute:"default-search"})],r.prototype,"defaultSearch",2),s([l({converter:{fromAttribute:t=>t==="manual"?"manual":void 0}})],r.prototype,"filter",2),s([l({type:Boolean,reflect:!0})],r.prototype,"loading",2),s([l({type:Boolean,reflect:!0})],r.prototype,"loop",2),s([l({type:Boolean,attribute:"disable-pointer-selection",reflect:!0})],r.prototype,"disablePointerSelection",2),s([l({attribute:!1})],r.prototype,"groups",2),s([l({type:String})],r.prototype,"placeholder",2),s([l({type:String,attribute:"empty-message"})],r.prototype,"emptyMessage",2),s([l({type:String,attribute:"loading-message"})],r.prototype,"loadingMessage",2),s([E()],r.prototype,"_activeId",2),r=s([I("skdx-command","command","root")],r);export{d as OPTION_SELECTOR,r as SkdxCommand,f as defaultCommandFilter,m as scrollIntoList};

package/dist/command/CommandAnatomy.cjs

@@ -1 +1 @@
-"use strict";var l=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var x=(e,t)=>{for(var n in t)l(e,n,{get:t[n],enumerable:!0})},k=(e,t,n,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let d of b(t))!f.call(e,d)&&d!==n&&l(e,d,{get:()=>t[d],enumerable:!(s=g(t,d))||s.enumerable});return e};var h=e=>k(l({},"__esModule",{value:!0}),e);var S={};x(S,{COMMAND_ANATOMY_GENERATED:()=>a,COMMAND_RENDER_SLOTS:()=>A,fillCommandAnatomy:()=>C,refreshCommandAnatomyText:()=>y});module.exports=h(S);var o=require("../internal/options.cjs"),v=require("./CommandInput.cjs"),D=require("./CommandList.cjs"),R=require("./CommandLoading.cjs"),N=require("./CommandEmpty.cjs"),w=require("./CommandGroup.cjs"),I=require("./CommandItem.cjs"),a="data-skdx-command-generated",A=["item"];function C(e){let t=(0,o.renderSlotContent)(e,"item"),n=document.createElement("skdx-command-input");n.setAttribute(a,""),e.placeholder&&n.setAttribute("placeholder",e.placeholder);let s=document.createElement("skdx-command-list");s.setAttribute(a,""),e.placeholder&&s.setAttribute("aria-label",e.placeholder);for(let m of e.groups??[]){let r=m.items.map(u=>E(e,u,t));if(m.label===void 0){s.append(...r);continue}let i=document.createElement("skdx-command-group");i.setAttribute("heading",m.label),i.append(...r),s.append(i)}let d=[];e.loadingMessage&&d.push(c("skdx-command-loading",e.loadingMessage)),e.emptyMessage&&d.push(c("skdx-command-empty",e.emptyMessage)),e.replaceChildren(n,s,...d)}function c(e,t){let n=document.createElement(e);return n.setAttribute(a,""),n.textContent=t,n}function E(e,t,n){let s=t.value??t.label,d=document.createElement("skdx-command-item");d.setAttribute("value",s),t.disabled&&d.setAttribute("disabled",""),t.keywords?.length&&d.setAttribute("keywords",t.keywords.join(" "));let m=n.get(s);return m?d.append((0,o.stampRenderSlot)(m)):d.textContent=t.label,d.addEventListener("select",()=>{t.onSelect?.(),e.dispatchEvent(new CustomEvent("item-select",{detail:t,bubbles:!0,composed:!0}))}),d}function y(e){let t=e.querySelector(`:scope > skdx-command-input[${a}]`);if(!t)return;e.placeholder?t.setAttribute("placeholder",e.placeholder):t.removeAttribute("placeholder");let n=e.querySelector(`:scope > skdx-command-list[${a}]`);e.placeholder?n?.setAttribute("aria-label",e.placeholder):n?.removeAttribute("aria-label"),p(e,"skdx-command-loading",e.loadingMessage),p(e,"skdx-command-empty",e.emptyMessage)}function p(e,t,n){let s=e.querySelector(`:scope > ${t}[${a}]`);s&&n&&(s.textContent=n)}0&&(module.exports={COMMAND_ANATOMY_GENERATED,COMMAND_RENDER_SLOTS,fillCommandAnatomy,refreshCommandAnatomyText});
+"use strict";var l=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var k=(e,t)=>{for(var n in t)l(e,n,{get:t[n],enumerable:!0})},A=(e,t,n,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let d of b(t))!x.call(e,d)&&d!==n&&l(e,d,{get:()=>t[d],enumerable:!(s=f(t,d))||s.enumerable});return e};var h=e=>A(l({},"__esModule",{value:!0}),e);var M={};k(M,{COMMAND_ANATOMY_GENERATED:()=>a,COMMAND_RENDER_SLOTS:()=>C,fillCommandAnatomy:()=>y,refreshCommandAnatomyText:()=>S});module.exports=h(M);var o=require("../internal/options.cjs"),R=require("./CommandInput.cjs"),D=require("./CommandList.cjs"),N=require("./CommandLoading.cjs"),O=require("./CommandEmpty.cjs"),T=require("./CommandGroup.cjs"),_=require("./CommandItem.cjs"),u=require("../internal/events.cjs"),a="data-skdx-command-generated",C=["item"];function y(e){let t=(0,o.renderSlotContent)(e,"item"),n=document.createElement("skdx-command-input");n.setAttribute(a,""),e.placeholder&&n.setAttribute("placeholder",e.placeholder);let s=document.createElement("skdx-command-list");s.setAttribute(a,""),e.placeholder&&s.setAttribute("aria-label",e.placeholder);for(let m of e.groups??[]){let r=m.items.map(g=>E(e,g,t));if(m.label===void 0){s.append(...r);continue}let i=document.createElement("skdx-command-group");i.setAttribute(a,""),i.setAttribute("heading",m.label),i.append(...r),s.append(i)}let d=[];e.loadingMessage&&d.push(c("skdx-command-loading",e.loadingMessage)),e.emptyMessage&&d.push(c("skdx-command-empty",e.emptyMessage)),e.replaceChildren(n,s,...d)}function c(e,t){let n=document.createElement(e);return n.setAttribute(a,""),n.textContent=t,n}function E(e,t,n){let s=t.value??t.label,d=document.createElement("skdx-command-item");d.setAttribute("value",s),t.disabled&&d.setAttribute("disabled",""),t.keywords?.length&&d.setAttribute("keywords",t.keywords.join(" "));let m=n.get(s);return m?d.append((0,o.stampRenderSlot)(m)):d.textContent=t.label,d.addEventListener("select",()=>{t.onSelect?.(),(0,u.emit)(e,"item-select",t)}),d}function S(e){let t=e.querySelector(`:scope > skdx-command-input[${a}]`);if(!t)return;e.placeholder?t.setAttribute("placeholder",e.placeholder):t.removeAttribute("placeholder");let n=e.querySelector(`:scope > skdx-command-list[${a}]`);e.placeholder?n?.setAttribute("aria-label",e.placeholder):n?.removeAttribute("aria-label"),p(e,"skdx-command-loading",e.loadingMessage),p(e,"skdx-command-empty",e.emptyMessage)}function p(e,t,n){let s=e.querySelector(`:scope > ${t}[${a}]`);s&&n&&(s.textContent=n)}0&&(module.exports={COMMAND_ANATOMY_GENERATED,COMMAND_RENDER_SLOTS,fillCommandAnatomy,refreshCommandAnatomyText});

package/dist/command/CommandAnatomy.d.cts

@@ -10,9 +10,7 @@ export declare const COMMAND_ANATOMY_GENERATED = "data-skdx-command-generated";
 /** @internal The named slots the derived anatomy consumes — see `renderSlotContent`. */
 export declare const COMMAND_RENDER_SLOTS: readonly ["item"];
 /**
- * Build the canonical anatomy: Input, List with Command/Group children, and
- * Loading/Empty regions. No attribute forwarding; the root bears the attributes
- * the consumer wrote.
+ * Builds the canonical anatomy: Input, List with Command/Group children, and Loading/Empty regions.
  * @internal
  */
 export declare function fillCommandAnatomy(root: SkdxCommand): void;