@threadlabs/looma 0.1.24 → 0.1.26

package/dist/cjs/ui-multi-combobox.cjs.entry.js

@@ -0,0 +1,190 @@
+'use strict';
+
+var index = require('./index-BHG9Rpil.js');
+
+const uiMultiComboboxCss = () => `:host{display:block;min-inline-size:0;color:var(--ui-text-primary);font:inherit}ui-combobox::part(field){flex-wrap:wrap;align-items:center;gap:var(--ui-space-1);min-block-size:var(--ui-multi-combobox-min-block-size, 2.5rem);padding:var(--ui-space-1)}ui-combobox::part(input){flex:1 0 var(--ui-multi-combobox-input-min-inline-size, 5rem);width:auto;min-block-size:1.75rem;padding:var(--ui-space-0-5) var(--ui-space-1)}.items{display:contents}.item{appearance:none;display:inline-flex;max-inline-size:100%;padding:0;border:0;border-radius:var(--ui-radius-1);background:transparent;color:inherit;font:inherit;cursor:default}.item:focus-visible{outline:2px solid var(--ui-focus-ring);outline-offset:1px}.item:disabled{opacity:.6}`;
+
+const UIMultiCombobox = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.queryChange = index.createEvent(this, "query-change");
+        this.addItem = index.createEvent(this, "add-item");
+        this.removeItem = index.createEvent(this, "remove-item");
+        this.createItem = index.createEvent(this, "create-item");
+        this.optionsChange = index.createEvent(this, "options-change");
+    }
+    get host() { return index.getElement(this); }
+    label = '';
+    placeholder = '';
+    items = [];
+    config = {};
+    query;
+    defaultQuery = '';
+    /** Characters that commit the current query and leave the input ready for the next item. */
+    tokenSeparators = [];
+    disabled = false;
+    readOnly = false;
+    required = false;
+    name = '';
+    queryChange;
+    addItem;
+    removeItem;
+    createItem;
+    optionsChange;
+    raw = '';
+    rows = [];
+    combobox;
+    filteredConfig;
+    filteredConfigSource;
+    filteredSelection = '';
+    componentWillLoad() { this.raw = this.query ?? this.defaultQuery; }
+    syncQuery() {
+        if (this.query !== undefined)
+            this.raw = this.query;
+    }
+    get selectedValues() { return new Set(this.items.map(item => item.value)); }
+    get comboboxConfig() {
+        const selectionKey = this.items.map(item => item.value).join('\u0000');
+        if (this.filteredConfig && this.filteredConfigSource === this.config && this.filteredSelection === selectionKey) {
+            return this.filteredConfig;
+        }
+        const ownerFilter = this.config.filter;
+        const selected = this.selectedValues;
+        this.filteredConfigSource = this.config;
+        this.filteredSelection = selectionKey;
+        this.filteredConfig = {
+            ...this.config,
+            filter: (option, query, context) => !selected.has(option.value)
+                && (ownerFilter ? ownerFilter(option, query, context) : option.label.toLocaleLowerCase().includes(query.toLocaleLowerCase())),
+        };
+        return this.filteredConfig;
+    }
+    setQuery(query, trigger) {
+        if (this.query === undefined)
+            this.raw = query;
+        this.queryChange.emit({ query, display: query, trigger });
+    }
+    clearCommittedQuery(input, trigger) {
+        // Clear the native control before another key can arrive. Controlled adapters
+        // still receive query-change, but do not need to round-trip before typing resumes.
+        input.value = '';
+        this.raw = '';
+        this.setQuery('', trigger);
+    }
+    onQueryChange = (event) => {
+        event.stopPropagation();
+        this.setQuery(event.detail.query, event.detail.trigger);
+    };
+    onOptionsChange = (event) => {
+        event.stopPropagation();
+        this.rows = event.detail;
+        this.optionsChange.emit(event.detail);
+    };
+    onValueChange = (event) => {
+        event.stopPropagation();
+        if (event.detail.kind !== 'selection' || !event.detail.option)
+            return;
+        const item = event.detail.option;
+        this.addItem.emit({ item, index: this.items.length, trigger: event.detail.trigger });
+        // ui-combobox emits its selection value before the matching label query.
+        // Clear after both owner notifications so the stale label cannot win.
+        queueMicrotask(() => this.setQuery('', event.detail.trigger));
+    };
+    onCreateEntry = (event) => {
+        event.stopPropagation();
+        const query = event.detail.query.trim();
+        if (!query)
+            return;
+        this.setQuery('', event.detail.trigger);
+        this.createItem.emit({ query, trigger: event.detail.trigger });
+    };
+    commitQuery(input, trigger) {
+        const query = this.raw.trim();
+        if (!query)
+            return;
+        const normalizedQuery = query.toLocaleLowerCase();
+        const option = this.rows.find(row => row.label.trim().toLocaleLowerCase() === normalizedQuery);
+        if (option) {
+            this.clearCommittedQuery(input, trigger);
+            this.addItem.emit({ item: option, index: this.items.length, trigger });
+        }
+        else if (this.config.allowCreate) {
+            this.clearCommittedQuery(input, trigger);
+            this.createItem.emit({ query, trigger });
+        }
+    }
+    remove(index, trigger) {
+        const item = this.items[index];
+        if (!item || item.disabled || this.disabled || this.readOnly)
+            return;
+        this.removeItem.emit({ item, index, trigger });
+        requestAnimationFrame(() => {
+            const buttons = this.host.shadowRoot?.querySelectorAll('[part="item"]') ?? [];
+            const next = buttons[Math.min(index, buttons.length - 1)] ?? buttons[index - 1];
+            if (next && next.dataset.value !== item.value)
+                next.focus();
+            else
+                void this.focusInput();
+        });
+    }
+    focusItem(index) {
+        this.host.shadowRoot?.querySelectorAll('[part="item"]')[index]?.focus();
+    }
+    onItemKeyDown = (event, index) => {
+        if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey)
+            return;
+        if (event.key === 'ArrowLeft') {
+            event.preventDefault();
+            event.stopPropagation();
+            this.focusItem(Math.max(0, index - 1));
+        }
+        else if (event.key === 'ArrowRight') {
+            event.preventDefault();
+            event.stopPropagation();
+            if (index === this.items.length - 1)
+                void this.focusInput();
+            else
+                this.focusItem(index + 1);
+        }
+        else if (event.key === 'Backspace' || event.key === 'Delete') {
+            event.preventDefault();
+            event.stopPropagation();
+            this.remove(index, 'keyboard');
+        }
+    };
+    onKeyDown = (event) => {
+        if (event.defaultPrevented || event.isComposing || this.disabled || this.readOnly || event.altKey || event.ctrlKey || event.metaKey || event.shiftKey)
+            return;
+        const input = event.composedPath().find(node => node instanceof HTMLInputElement);
+        if (!input)
+            return;
+        if (this.tokenSeparators.includes(event.key)) {
+            event.preventDefault();
+            event.stopPropagation();
+            this.commitQuery(input, 'keyboard');
+            return;
+        }
+        if (this.raw || (input.selectionStart ?? 0) > 0)
+            return;
+        if (event.key === 'ArrowLeft' && this.items.length) {
+            event.preventDefault();
+            this.focusItem(this.items.length - 1);
+        }
+        else if (event.key === 'Backspace' && this.items.length) {
+            event.preventDefault();
+            this.remove(this.items.length - 1, 'keyboard');
+        }
+    };
+    async focusInput() { await this.combobox?.focusInput(); }
+    render() {
+        return index.h(index.Host, { key: 'c1acc758a2856e5bd022e076030798c9d63ff416', onKeyDown: this.onKeyDown }, index.h("ui-combobox", { key: '8f77d28aa1d228dd809f86695429328decaf7468', ref: element => this.combobox = element, label: this.label, "label-visibility": "sr-only", placeholder: this.placeholder, name: this.name, value: null, query: this.raw, config: this.comboboxConfig, size: "sm", disabled: this.disabled, readOnly: this.readOnly, required: this.required, "onQuery-change": this.onQueryChange, "onValue-change": this.onValueChange, "onCreate-entry": this.onCreateEntry, "onOptions-change": this.onOptionsChange }, index.h("div", { key: 'f4f0849c145d9bcc4d47103d3dc4fdce8009aeab', slot: "start", class: "items", role: "group", "aria-label": `Selected ${this.label}` }, this.items.map((item, index$1) => index.h("button", { type: "button", part: "item", class: "item", "data-value": item.value, tabIndex: -1, disabled: this.disabled || this.readOnly || item.disabled, "aria-label": `${item.label}, press Delete or Backspace to remove`, onKeyDown: event => this.onItemKeyDown(event, index$1) }, index.h("slot", { name: `item-${item.id}` }, index.h("ui-chip", { appearance: "pill" }, item.label))))), this.rows.map(option => index.h("span", { slot: `option-${option.id}` }, index.h("slot", { name: `option-${option.id}` }, option.label))), index.h("span", { key: '3cf42f492bd946ca130321a2c3fcf976602c6566', slot: "create" }, index.h("slot", { key: '6f158cb1d96c0d0401fe5302cabffd052498f651', name: "create" }, "Create \u201C", this.raw, "\u201D")), index.h("span", { key: '0f436aca38aecf9485963d6588c27ab3288ced55', slot: "loading" }, index.h("slot", { key: '6c079ac5bbf6fff57aa7fa6f0022a939c96a5cd0', name: "loading" }, "Loading suggestions\u2026")), index.h("span", { key: 'a7893e0ff0a1922a404e7c072338858d9e7fdf12', slot: "empty" }, index.h("slot", { key: 'd6831db76cc1252aa942ccdcfba36c8cf4c60d22', name: "empty" }, "No suggestions.")), index.h("span", { key: 'a096a393a167256cff11f77110ae29ac58a33779', slot: "error" }, index.h("slot", { key: '1bf52c85e911d9965b9b691d6ebf0b89bbea2d58', name: "error" }, "Unable to load suggestions.")), index.h("div", { key: 'b7d88c9b427305da8b986eb993b49e5c581c1445', slot: "footer" }, index.h("slot", { key: 'f84fdf78c3e373f4735ed88574af06f1ca3cc1b5', name: "footer" }))));
+    }
+    static get watchers() { return {
+        "query": [{
+                "syncQuery": 0
+            }]
+    }; }
+};
+UIMultiCombobox.style = uiMultiComboboxCss();
+
+exports.ui_multi_combobox = UIMultiCombobox;

package/dist/cjs/ui-popover.cjs.entry.js

@@ -113,7 +113,7 @@ const UIPopover = class {
         }
     };
     render() {
-        return (index.h(index.Host, { key: '6a38873f2e4d085f733fa116057b1f55418e23ed', "data-open": this.internalOpen ? '' : undefined, onKeyDown: this.onKeydown }, index.h("div", { key: '6fef6e37921e8c52994617719f1ebb6d9bd54ee2', class: "popover__surface" }, index.h("slot", { key: '5ee4269592219035a3185f8f06fd71ecb12e4e71' }))));
+        return (index.h(index.Host, { key: 'a4986ace0f3c586774a549cb844287b28ccd0531', "data-open": this.internalOpen ? '' : undefined, onKeyDown: this.onKeydown }, index.h("div", { key: '8f2c589916d06138ef72bfe0d039893b3c59a7cc', class: "popover__surface" }, index.h("slot", { key: 'ee70e7dcc53a99b5c80e56862a6eb00edcfcf912' }))));
     }
     static get watchers() { return {
         "open": [{

package/dist/cjs/ui-radio-group.cjs.entry.js

@@ -109,7 +109,7 @@ const UIRadioGroup = class {
         }
     };
     render() {
-        return (index.h(index.Host, { key: '28c6eb6cc9520b570f40d2193d0c64a7a6c7db01', role: "radiogroup", "aria-orientation": this.orientation, "data-orientation": this.orientation, "data-disabled": this.disabled ? '' : undefined }, index.h("slot", { key: '97814378181be78bfac6090ff173459e1f539728' })));
+        return (index.h(index.Host, { key: '1882ad7c092c6a138eab2a52c19beb9a950a8d5a', role: "radiogroup", "aria-orientation": this.orientation, "data-orientation": this.orientation, "data-disabled": this.disabled ? '' : undefined }, index.h("slot", { key: 'd5abade3d23963410cfbac17e80aa16dd21ccc6e' })));
     }
     static get watchers() { return {
         "value": [{

package/dist/cjs/ui-radio.cjs.entry.js

@@ -69,7 +69,7 @@ const UIRadio = class {
         });
     };
     render() {
-        return (index.h(index.Host, { key: 'a5220e72dbf1b55ca73a3e6234f31c99d806433a', role: "radio", "aria-checked": String(this.internalChecked), "aria-disabled": String(this.disabled), "data-disabled": this.disabled ? '' : undefined }, index.h("slot", { key: '687e94b2036107c807e0319c3620bca7c06cbb26', ref: (el) => (this.slotRef = el) })));
+        return (index.h(index.Host, { key: 'f4700b43790accd29a6bcc55fcc862072e29c335', role: "radio", "aria-checked": String(this.internalChecked), "aria-disabled": String(this.disabled), "data-disabled": this.disabled ? '' : undefined }, index.h("slot", { key: 'ed32c35f8f68c662a8b95e58b74c8c76c959ea49', ref: (el) => (this.slotRef = el) })));
     }
     static get watchers() { return {
         "checked": [{

package/dist/cjs/ui-search-result-row.cjs.entry.js

@@ -39,7 +39,7 @@ const UISearchResultRow = class {
         this.hasTrailing = slotHasContent(this.trailingSlot);
     };
     render() {
-        return (index.h(index.Host, { key: '01e795d1c723c4e56f5648c429b40fc7841ff9b5' }, index.h("button", { key: '7bdde5075c5a3112d14741aa87937e69a8f5fea9', class: "search-result-row", type: "button", disabled: this.disabled, part: "button" }, index.h("span", { key: '39ba47af68a23875eebdbdf8f87ca7d94d42ec43', class: "search-result-row__leading", part: "leading", hidden: !this.hasLeading }, index.h("slot", { key: 'f108b1c5d284057d5979bf4897f056543a1ff092', name: "leading", ref: (el) => (this.leadingSlot = el), onSlotchange: this.syncSlots })), index.h("span", { key: '0daeb171b7010f37d959c91f2a87c1ae7e96a56f', class: "search-result-row__content", part: "content" }, index.h("span", { key: 'd7ec1b67a15fa9c79ea0fd23db73bd7bca40a8ce', class: "search-result-row__title", part: "title" }, index.h("slot", { key: '8c4a45511580a655e0593c8c57fd98838f2cb896', name: "title" })), index.h("span", { key: '0d30a58a7079ea0c8992c9b0b02b516a65350425', class: "search-result-row__meta", part: "meta", hidden: !this.hasMeta }, index.h("slot", { key: '8de66e3b6adf89ed765ccc1c341ccac1b5513a6f', name: "meta", ref: (el) => (this.metaSlot = el), onSlotchange: this.syncSlots })), index.h("span", { key: '7c24542b9bb634a55530952c329242a351e813c3', class: "search-result-row__excerpt", part: "excerpt", hidden: !this.hasExcerpt }, index.h("slot", { key: 'a5bfc4fd17b8535aa996e792498b33f25dd30ecd', name: "excerpt", ref: (el) => (this.excerptSlot = el), onSlotchange: this.syncSlots }))), index.h("span", { key: '25c74d8508a0b3b527ef5529a02e54e407cae5ae', class: "search-result-row__trailing", part: "trailing", hidden: !this.hasTrailing }, index.h("slot", { key: 'cba6f957de902b9ed3dc05c8b20794c9b69c85c6', name: "trailing", ref: (el) => (this.trailingSlot = el), onSlotchange: this.syncSlots })))));
+        return (index.h(index.Host, { key: 'eeda041dbcf8841cd53be9c532df208eb3be3d3b' }, index.h("button", { key: '71d3db6d2eca4f8d7796429f68ef73bf2c7b62f7', class: "search-result-row", type: "button", disabled: this.disabled, part: "button" }, index.h("span", { key: 'f2260cab9f654e7f5e96a5e7e2a1cbbb5a55fde3', class: "search-result-row__leading", part: "leading", hidden: !this.hasLeading }, index.h("slot", { key: '824fffc19c2b5712dae0c000f12cc36a0043a370', name: "leading", ref: (el) => (this.leadingSlot = el), onSlotchange: this.syncSlots })), index.h("span", { key: '4e3728ea7d363f256f1b3283df6eb984cf3f570f', class: "search-result-row__content", part: "content" }, index.h("span", { key: '95009b1ce569fb4251df62334a5dd88f1de561af', class: "search-result-row__title", part: "title" }, index.h("slot", { key: '132beecf36471ae0db68d686829428225699c534', name: "title" })), index.h("span", { key: '0ad7c8d52aa40ccf62667d3ecca4d48b49917a9a', class: "search-result-row__meta", part: "meta", hidden: !this.hasMeta }, index.h("slot", { key: '4b97129504571a676839287bd87e68d803f8bc99', name: "meta", ref: (el) => (this.metaSlot = el), onSlotchange: this.syncSlots })), index.h("span", { key: 'e6c73e653fb7dc213866a15870281f3f6d95a86b', class: "search-result-row__excerpt", part: "excerpt", hidden: !this.hasExcerpt }, index.h("slot", { key: '49deae8194485304380b8b4b3d4fe96cd6623f4d', name: "excerpt", ref: (el) => (this.excerptSlot = el), onSlotchange: this.syncSlots }))), index.h("span", { key: 'c7c6f0b57668644a28d3c4c981b4db79a0e3c42a', class: "search-result-row__trailing", part: "trailing", hidden: !this.hasTrailing }, index.h("slot", { key: 'e6cbceeb41d23c9b7514f53663438069499d1a4d', name: "trailing", ref: (el) => (this.trailingSlot = el), onSlotchange: this.syncSlots })))));
     }
 };
 UISearchResultRow.style = uiSearchResultRowCss();

package/dist/cjs/ui-search-shell.cjs.entry.js

@@ -31,7 +31,7 @@ const UISearchShell = class {
         this.hasFooter = slotHasContent(this.footerSlot);
     };
     render() {
-        return (index.h("div", { key: 'c3a4366e1f22b249233e42fdc83f1620613cce52', class: "search-shell", part: "base" }, index.h("slot", { key: '4f22e4a44fe7ae190a80a6e5cd695c15eb4f029d', name: "backdrop" }), index.h("div", { key: 'bf452dae29f0ab31266d848a4dd4b794997b34a7', class: "search-shell__panel", part: "panel" }, index.h("div", { key: 'c0ef7d1d8ea95853404d39ddac1bff566d38d18e', class: "search-shell__search", part: "search" }, index.h("slot", { key: '462532250d8ba36aad1d31fe10da642d79e59faf', name: "search" })), index.h("div", { key: '4f7d91272d15f6e37df6fba4ae563efae5701b93', class: "search-shell__status", part: "status", hidden: !this.hasStatus }, index.h("slot", { key: 'd761691c1dd2c3012075163bb7eb9ce7e5bf3ef4', name: "status", ref: (el) => (this.statusSlot = el), onSlotchange: this.syncSlots })), index.h("div", { key: '1427a10b3f43ea31c2a482beb17f78d70b5fb2cf', class: "search-shell__body", part: "body" }, index.h("slot", { key: '6d6e8c2b4ee4833b5476795d4c7e184dda07f81e', name: "body" })), index.h("div", { key: '8f7d36040f7d21489c703b53581e392a2616963b', class: "search-shell__footer", part: "footer", hidden: !this.hasFooter }, index.h("slot", { key: '08b84f01091d95895ee8693e9b322511bf614342', name: "footer", ref: (el) => (this.footerSlot = el), onSlotchange: this.syncSlots })))));
+        return (index.h("div", { key: 'ae5baf1fae88f3c0ff8c98e68e1c31d7f19d7b6a', class: "search-shell", part: "base" }, index.h("slot", { key: '192d10867902bc4618762ab3ce1ca8a44229ec11', name: "backdrop" }), index.h("div", { key: '72bafd3ba7aadebcb011fb27f56793a9079bb2e1', class: "search-shell__panel", part: "panel" }, index.h("div", { key: 'c2d46c9099699cc1c2f357cb51d11ab0e6cf6c69', class: "search-shell__search", part: "search" }, index.h("slot", { key: '21f4ed690247fa794bd9322c75cee1721926087a', name: "search" })), index.h("div", { key: '84baba674456aa2a5878d5858d0e6531251440ce', class: "search-shell__status", part: "status", hidden: !this.hasStatus }, index.h("slot", { key: '6e7b6533a29231ebbcd41529d8120649ca4a1dd1', name: "status", ref: (el) => (this.statusSlot = el), onSlotchange: this.syncSlots })), index.h("div", { key: '710d51d450132ad0f528b2eb2cd6f0312dbced2f', class: "search-shell__body", part: "body" }, index.h("slot", { key: '2c380ff4ad33ead6ca8c2611ebc024f125f0da48', name: "body" })), index.h("div", { key: '6923984a31c7bc23bae3ecee08d7acad14703a02', class: "search-shell__footer", part: "footer", hidden: !this.hasFooter }, index.h("slot", { key: '57c2eab7a3f46558ada8d1aa70d64f434bb8cdd6', name: "footer", ref: (el) => (this.footerSlot = el), onSlotchange: this.syncSlots })))));
     }
 };
 UISearchShell.style = uiSearchShellCss();

package/dist/cjs/ui-select.cjs.entry.js

@@ -80,7 +80,7 @@ const UISelect = class {
         });
     };
     render() {
-        return (index.h(index.Host, { key: '9a83a040bbad98355999c8099a78c6eba3ffc995', "data-invalid": this.invalid ? '' : undefined }, index.h("slot", { key: '4a70aa44651132899e283e45c32213cf3f00be24', ref: (el) => (this.slotRef = el) })));
+        return (index.h(index.Host, { key: '74cbe4a76a23af415c202c61951ad513b0ed6cb8', "data-invalid": this.invalid ? '' : undefined }, index.h("slot", { key: 'e86eb0cfb0d379cb3f8b2ea5ce3c69639d0cdda4', ref: (el) => (this.slotRef = el) })));
     }
     static get watchers() { return {
         "value": [{

package/dist/cjs/ui-switch.cjs.entry.js

@@ -49,7 +49,7 @@ const UISwitch = class {
         this.toggle('pointer');
     };
     render() {
-        return (index.h(index.Host, { key: 'e11500e37da6a52c0cb4e143254363f85911aac1', role: "switch", "aria-checked": String(this.internalChecked), "aria-disabled": String(this.disabled), "data-disabled": this.disabled ? '' : undefined, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.onKeydown, onClick: this.onClick }, index.h("input", { key: '777310a90b66f67e6a8eb0f77da5274e32f10db0', type: "checkbox", checked: this.internalChecked, disabled: this.disabled, required: this.required, value: this.value, "aria-hidden": "true", tabIndex: -1, onChange: (e) => {
+        return (index.h(index.Host, { key: 'a37ded5259d71a57308cba6dd158ae4ae81e4e8b', role: "switch", "aria-checked": String(this.internalChecked), "aria-disabled": String(this.disabled), "data-disabled": this.disabled ? '' : undefined, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.onKeydown, onClick: this.onClick }, index.h("input", { key: '882f81f39d752430f1de1554a5d83176416f4617', type: "checkbox", checked: this.internalChecked, disabled: this.disabled, required: this.required, value: this.value, "aria-hidden": "true", tabIndex: -1, onChange: (e) => {
                 const input = e.target;
                 const checked = input.checked;
                 if (!controlledState.isControlled(this.checked))
@@ -61,7 +61,7 @@ const UISwitch = class {
                 });
                 if (controlledState.isControlled(this.checked))
                     input.checked = this.internalChecked;
-            } }), index.h("slot", { key: '7d72db5b720c0af0c4561b485ca558de61e1ce6e' })));
+            } }), index.h("slot", { key: 'b3b2b5afae622d1ae79cadd84f60c6b6c2df55a4' })));
     }
     static get watchers() { return {
         "checked": [{

package/dist/cjs/ui-tabs.cjs.entry.js

@@ -99,7 +99,7 @@ const UITabs = class {
         }
     };
     render() {
-        return (index.h(index.Host, { key: '8681e699c6afdbafd59ed986b8bf3c815b32cd1c', orientation: this.orientation, "data-orientation": this.orientation }, index.h("slot", { key: '673f4db2ae0aded3bd40934c1fff518cf6f83837' })));
+        return (index.h(index.Host, { key: '19207153c7b7a6ea5f5ffb50439e99af70984b44', orientation: this.orientation, "data-orientation": this.orientation }, index.h("slot", { key: '5045cd040eeccd028c00328206d47f7d17b622de' })));
     }
     static get watchers() { return {
         "value": [{

package/dist/cjs/ui-textarea.cjs.entry.js

@@ -79,7 +79,7 @@ const UITextarea = class {
         });
     };
     render() {
-        return (index.h(index.Host, { key: '6ce80349ca316f7a44d08e83862125f6b4d736a6', "data-invalid": this.invalid ? '' : undefined }, index.h("slot", { key: '2c1ce87c9019d8346673ae5e7dd8a543d1bcb91c', ref: (el) => (this.slotRef = el) })));
+        return (index.h(index.Host, { key: '020adfed4a177ef5d07852ff2e6ffb66b6f80742', "data-invalid": this.invalid ? '' : undefined }, index.h("slot", { key: '2e9bd0e071e24fcf248eadf38f16484321359503', ref: (el) => (this.slotRef = el) })));
     }
     static get watchers() { return {
         "value": [{

package/dist/cjs/ui-toast-region.cjs.entry.js

@@ -77,7 +77,7 @@ const UIToastRegion = class {
         });
     };
     render() {
-        return (index.h(index.Host, { key: 'b4430aceacb7a66202c6a43ad7b0bbe31c51eb94', role: "region", "aria-label": "Notifications", "aria-live": "polite", "data-open": this.internalOpen ? '' : undefined }, index.h("slot", { key: '8bfb02d38366fab29a1668a53b7834ccd1a9aa65' })));
+        return (index.h(index.Host, { key: '8a3546bcd59e12f21393ea55fa4d232d3907a34e', role: "region", "aria-label": "Notifications", "aria-live": "polite", "data-open": this.internalOpen ? '' : undefined }, index.h("slot", { key: 'a4a4525a1ca768d65ff36b3889a821b8dda8b6f7' })));
     }
     static get watchers() { return {
         "open": [{

package/dist/cjs/ui-tooltip.cjs.entry.js

@@ -219,7 +219,7 @@ const UITooltip = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'ce34c51bc3a9c9f7f31b7f0d329175df0cee1ab3', role: "tooltip", hidden: !this.internalOpen, "data-open": this.internalOpen ? '' : undefined }, index.h("div", { key: 'e5bb2bcb146fe8ec3b4e9a6abb550961181e3c06', class: "tooltip__surface" }, index.h("slot", { key: 'bdb71bfcb0f72c212cbb5c64fb69510fdded4afb' }))));
+        return (index.h(index.Host, { key: '6c70f235889d6f1c425f0a51fcfc04e06a96dea4', role: "tooltip", hidden: !this.internalOpen, "data-open": this.internalOpen ? '' : undefined }, index.h("div", { key: '5c4f1d264e32d308f5b26af4e967e13369c4238a', class: "tooltip__surface" }, index.h("slot", { key: '52b5900d67ffa7590b0ff97511f99718d2e8c311' }))));
     }
     static get watchers() { return {
         "open": [{

package/dist/cjs/ui-top-bar.cjs.entry.js

@@ -35,7 +35,7 @@ const UITopBar = class {
         this.hasActions = slotHasContent(this.actionsSlot);
     };
     render() {
-        return (index.h(index.Host, { key: 'b92aa4e03475b3e623212a1e98f45d5532860b51' }, index.h("header", { key: 'a3552708b0e424e762e100ee55fc6bfac4cd830a', class: "top-bar", part: "base" }, index.h("div", { key: '4c8a9e3a04ff23a615bf09e368f4212dd5b38157', class: "top-bar__leading", hidden: !this.hasLeading }, index.h("slot", { key: '64ecc99672b8fd37305810e0776a24bf87ea6f08', name: "leading", ref: (el) => (this.leadingSlot = el), onSlotchange: this.syncSlots })), index.h("div", { key: '37fc003aba2b87f7c8c0e654cd6810d7f231f365', class: "top-bar__title" }, index.h("slot", { key: 'e6c901c15852e83340ca8ad1e264fd5e35445e84' })), index.h("div", { key: '37b1ac319367eeded4182ada401a31e0b9c2555a', class: "top-bar__search", hidden: !this.hasSearch }, index.h("slot", { key: '0a8b5ef500dd843909bb35a1133be548411f3b71', name: "search", ref: (el) => (this.searchSlot = el), onSlotchange: this.syncSlots })), index.h("div", { key: '7e5054a3ed6ecfe8d9d8b1b36992843aa0fb62eb', class: "top-bar__actions", hidden: !this.hasActions }, index.h("slot", { key: '19fe59c5ba4da7f0ceda764948f1288bfaa2a41d', name: "actions", ref: (el) => (this.actionsSlot = el), onSlotchange: this.syncSlots })))));
+        return (index.h(index.Host, { key: 'ef7cf644a8e8381d7d1f8d093bcfefcdc4620682' }, index.h("header", { key: '5055594a179d86efefd43529e070a582c51cb1d8', class: "top-bar", part: "base" }, index.h("div", { key: 'bd6ec069ae9d7820a6992250ba1aa997b4cc6754', class: "top-bar__leading", hidden: !this.hasLeading }, index.h("slot", { key: '3b9b1b73fb455ad720e1db46757555eb3713c0b8', name: "leading", ref: (el) => (this.leadingSlot = el), onSlotchange: this.syncSlots })), index.h("div", { key: 'e402cc0cb7ec4418460182f8f32cb161c6139221', class: "top-bar__title" }, index.h("slot", { key: 'fce0cfc11da269167853f591742b1369023864ae' })), index.h("div", { key: '6861bb04f399076378aa1fa9be24b35db277106a', class: "top-bar__search", hidden: !this.hasSearch }, index.h("slot", { key: '3857f37d53ec99b36a52cb7830e634afdee29d2e', name: "search", ref: (el) => (this.searchSlot = el), onSlotchange: this.syncSlots })), index.h("div", { key: '538f6297078b6d5aa85906e902066e8809f52540', class: "top-bar__actions", hidden: !this.hasActions }, index.h("slot", { key: '3c45ff59c4b48673e796c6e93842cb11fceb652f', name: "actions", ref: (el) => (this.actionsSlot = el), onSlotchange: this.syncSlots })))));
     }
 };
 UITopBar.style = uiTopBarCss();

package/dist/cjs/ui-tree-item.cjs.entry.js

@@ -119,10 +119,10 @@ const UITreeItem = class {
         const expanded = this.isExpanded();
         const disclosureLabel = `${expanded ? 'Collapse' : 'Expand'} ${this.label || 'item'}`;
         const dragLabel = `Drag ${this.label || 'item'} to reorder`;
-        return (index.h(index.Host, { key: '36ad9eac3e0fe2a606e63294891b1c0697034b46', role: "treeitem", "aria-label": this.label || undefined, "aria-level": String(level), "aria-expanded": this.container ? String(expanded) : undefined, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, "data-container": this.container ? '' : undefined, "data-selected": this.selected ? '' : undefined, "data-disabled": this.disabled ? '' : undefined, "data-drag-type": this.dragType || 'item', "data-drop-scope": this.dropScope || undefined, "data-accepts": this.accepts || undefined, tabIndex: this.disabled || !this.tabStop ? -1 : 0, style: {
+        return (index.h(index.Host, { key: 'f092fa9586a39aba1a9629ba42e52f8fbc10de05', role: "treeitem", "aria-label": this.label || undefined, "aria-level": String(level), "aria-expanded": this.container ? String(expanded) : undefined, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, "data-container": this.container ? '' : undefined, "data-selected": this.selected ? '' : undefined, "data-disabled": this.disabled ? '' : undefined, "data-drag-type": this.dragType || 'item', "data-drop-scope": this.dropScope || undefined, "data-accepts": this.accepts || undefined, tabIndex: this.disabled || !this.tabStop ? -1 : 0, style: {
                 '--ui-tree-item-depth': String(level - 1),
                 'margin-inline-start': level > 1 ? 'var(--ui-tree-indent, 16px)' : '0px',
-            } }, index.h("div", { key: 'e92f5bc73accef3b348559ea144e0b769c98c721', class: "row", part: "row", onClick: this.onRowClick }, this.sortable && !this.disabled ? (index.h("button", { class: "drag-handle", part: "drag-handle", type: "button", draggable: true, "aria-label": dragLabel, title: dragLabel }, index.h("span", { innerHTML: icons.loomaIconMarkup('grip-vertical') }))) : null, this.container ? (index.h("button", { class: "disclosure", part: "disclosure", type: "button", "aria-label": disclosureLabel, "aria-expanded": String(expanded), disabled: this.disabled, onClick: this.onDisclosureClick, onKeyDown: this.onDisclosureKeydown }, index.h("span", { class: { 'disclosure-icon': true, 'disclosure-icon--expanded': expanded }, innerHTML: icons.loomaIconMarkup('chevron-down') }))) : index.h("span", { class: "disclosure-spacer", "aria-hidden": "true" }), index.h("span", { key: 'dd2d0550d6846d0a4f80a4108968bfc32c18658f', class: "leading", part: "leading" }, index.h("slot", { key: '622d449a338dce57bc2e64aaf776471e8d3ce1b4', name: "leading" })), index.h("span", { key: '29c3e6ace4838ab941ada2547356288358faaeb2', class: "label", part: "label" }, index.h("slot", { key: 'f1594c11fa0b9fbe8a3c20df6edce19421cab148' })), index.h("span", { key: 'e4a6408f86b58a325145e713d116fc09322bb0d3', class: "actions", part: "actions" }, index.h("slot", { key: 'ff3afaf1089426e19ee1fc39c6567c3d40ca4272', name: "actions" })), index.h("span", { key: 'efcf23f7aad6c4353fa24bfe2a81001122335f72', class: "drop-indicator row-drop-indicator", part: "drop-indicator", "aria-hidden": "true" })), this.container ? (index.h("div", { class: "children", part: "children", role: "group", hidden: !expanded }, index.h("slot", { name: "children" }))) : null, index.h("span", { key: '21bfc8a6ad6e487cd044b5a3cbd7e8f900f2d1e1', class: "drop-indicator subtree-drop-indicator", part: "drop-indicator", "aria-hidden": "true" })));
+            } }, index.h("div", { key: '2f16d97219ba9ec9e37688d97ad9144508aa1ed5', class: "row", part: "row", onClick: this.onRowClick }, this.sortable && !this.disabled ? (index.h("button", { class: "drag-handle", part: "drag-handle", type: "button", draggable: true, "aria-label": dragLabel, title: dragLabel }, index.h("span", { innerHTML: icons.loomaIconMarkup('grip-vertical') }))) : null, this.container ? (index.h("button", { class: "disclosure", part: "disclosure", type: "button", "aria-label": disclosureLabel, "aria-expanded": String(expanded), disabled: this.disabled, onClick: this.onDisclosureClick, onKeyDown: this.onDisclosureKeydown }, index.h("span", { class: { 'disclosure-icon': true, 'disclosure-icon--expanded': expanded }, innerHTML: icons.loomaIconMarkup('chevron-down') }))) : index.h("span", { class: "disclosure-spacer", "aria-hidden": "true" }), index.h("span", { key: 'd984631c891df304edb3e1dc5bcd19af3ad8e20d', class: "leading", part: "leading" }, index.h("slot", { key: '81a0e055859df5d4daaa6dac39013b23dcc2831b', name: "leading" })), index.h("span", { key: '3ae295523d5a3b9feaa9bfaa16d807349e37d78b', class: "label", part: "label" }, index.h("slot", { key: 'db8503a41d087d283074a41e76fa872ff4b2a707' })), index.h("span", { key: 'ac5b5db7128b31a9263b912bd64cd90ac640eaeb', class: "actions", part: "actions" }, index.h("slot", { key: 'c8842a5d80215ec297688c86f6bfe9b4d9bed333', name: "actions" })), index.h("span", { key: 'b7f239bc16867678291850ad61a5cd752d6a7425', class: "drop-indicator row-drop-indicator", part: "drop-indicator", "aria-hidden": "true" })), this.container ? (index.h("div", { class: "children", part: "children", role: "group", hidden: !expanded }, index.h("slot", { name: "children" }))) : null, index.h("span", { key: '2a5f448db2f4f363a34a1a950785e0ee12cc9938', class: "drop-indicator subtree-drop-indicator", part: "drop-indicator", "aria-hidden": "true" })));
     }
     static get watchers() { return {
         "expanded": [{

package/dist/cjs/ui-tree.cjs.entry.js

@@ -492,7 +492,7 @@ const UITree = class {
         }
     };
     render() {
-        return (index.h(index.Host, { key: '549c09abc67dc60b16bf2d6b7d6346f214e9d6ae', role: "tree", "aria-label": this.label || 'Tree' }, index.h("slot", { key: 'fea59bde97611bf384e32ce4fb2b3eec9aca784f' })));
+        return (index.h(index.Host, { key: '7efbf793fe63471006df57f0045a5fe995c81440', role: "tree", "aria-label": this.label || 'Tree' }, index.h("slot", { key: '1804e391796e7451c93cb58258e0e23ec3ad98c7' })));
     }
 };
 UITree.style = uiTreeCss();

package/dist/collection/collection-manifest.json

@@ -12,12 +12,14 @@
     "components/ui-context-menu/ui-context-menu.js",
     "components/ui-dialog/ui-dialog.js",
     "components/ui-disclosure/ui-disclosure.js",
+    "components/ui-editable/ui-editable.js",
     "components/ui-floating-action-button/ui-floating-action-button.js",
     "components/ui-form-field/ui-form-field.js",
     "components/ui-icon-button/ui-icon-button.js",
     "components/ui-input/ui-input.js",
     "components/ui-menu/ui-menu.js",
     "components/ui-menu-item/ui-menu-item.js",
+    "components/ui-multi-combobox/ui-multi-combobox.js",
     "components/ui-popover/ui-popover.js",
     "components/ui-radio/ui-radio.js",
     "components/ui-radio-group/ui-radio-group.js",

package/dist/collection/components/ui-chip/ui-chip.css

@@ -13,6 +13,10 @@
   max-width: 100%;
 }
 
+:host([data-size='sm']) {
+  --ui-chip-font-size: var(--ui-font-size-sm);
+}
+
 .chip__surface {
   display: inline-flex;
   align-items: center;

package/dist/collection/components/ui-chip/ui-chip.js

@@ -3,8 +3,10 @@ import { Host, h } from "@stencil/core";
 export class UIChip {
     /** `tag` has a square leading edge and an angled trailing edge; `pill` is fully rounded. */
     appearance = 'tag';
+    /** Compact typography size. */
+    size = 'xs';
     render() {
-        return (h(Host, { key: 'fe1246a1e698098f0ca9cb04e749d5adf233e50c', "data-appearance": this.appearance }, h("span", { key: 'a17237699b9eb20fb0a084adbd900a3aa9bc12b0', class: "chip__surface" }, h("slot", { key: '7f4e5dcc82d360083d4ded2617fa39a9dc1fd3ef' }))));
+        return (h(Host, { key: '970cb48cf8d70c47feaab90fe428c09f0d052a03', "data-appearance": this.appearance, "data-size": this.size }, h("span", { key: '6d8c6104d2869520097a2a61bd2a887b363b4912', class: "chip__surface" }, h("slot", { key: 'b61c50a8060d8a2684aed6f87dc859b1c9e99858' }))));
     }
     static get is() { return "ui-chip"; }
     static get encapsulation() { return "shadow"; }
@@ -39,6 +41,26 @@ export class UIChip {
                 "reflect": false,
                 "attribute": "appearance",
                 "defaultValue": "'tag'"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'xs' | 'sm'",
+                    "resolved": "\"sm\" | \"xs\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Compact typography size."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "size",
+                "defaultValue": "'xs'"
             }
         };
     }

package/dist/collection/components/ui-combobox/ui-combobox.js

@@ -21,6 +21,8 @@ export class UICombobox {
     readOnly = false;
     required = false;
     size = 'md';
+    /** Keep the native label accessible while allowing compact composed controls. */
+    labelVisibility = 'visible';
     disclosure = false;
     clearable = false;
     /** Optional description shown by the connected question-mark button. */
@@ -242,8 +244,9 @@ export class UICombobox {
         }, reason === 'disclosure' ? 0 : Math.max(0, config.debounce ?? 200));
     }
     get canCreate() {
+        const candidates = this.config.options ? [...this.config.options, ...this.rows] : this.rows;
         return Boolean(this.config.allowCreate && this.raw.trim() && !this.loading && !this.lookupError
-            && !this.rows.some(row => row.label.toLocaleLowerCase() === this.raw.toLocaleLowerCase()));
+            && !candidates.some(row => row.label.toLocaleLowerCase() === this.raw.toLocaleLowerCase()));
     }
     format(timing) {
         if ((this.config.formatOn ?? 'blur') !== timing || !this.input)
@@ -428,19 +431,24 @@ export class UICombobox {
         catch { /* Aborted work never becomes current field state. */ }
         return this.validation;
     }
+    /** Focus the native editing input from a composed control. */
+    async focusInput() { this.input?.focus(); }
     render() {
         const description = [this.helpOpen ? 'help-text' : '', this.validation.issues.length ? 'validation' : ''].filter(Boolean).join(' ') || undefined;
         const status = this.loading ? 'Loading suggestions…' : this.lookupError || (this.expanded ? `${this.rows.length} suggestions available.` : '');
         const groups = [...new Set(this.rows.map(row => row.group ?? ''))];
-        return h(Host, { key: 'b485462943bef9e5cb0a4b42f82888024132ab3a', "data-size": this.size, "data-validation": this.validation.status, onFocusout: this.onFocusOut }, h("label", { key: '99db32d80b0a250ff4ebea8481dda94be53df2eb', htmlFor: "input", part: "label" }, this.label, this.required ? ' *' : ''), h("div", { key: '922adddf41c07215d3ec73947e8e3fe801c7ef89', class: "field", part: "field", ref: element => this.field = element }, h("input", { key: '557780297c5afee8112a5085984c5dd4ea1a02be', id: "input", ref: element => this.input = element, role: "combobox", "aria-autocomplete": "list", "aria-expanded": String(this.expanded), "aria-controls": "listbox", "aria-activedescendant": this.expanded && this.active >= 0 ? `option-${this.active}` : undefined, "aria-describedby": description, "aria-invalid": String(this.validation.status === 'error'), "aria-busy": String(this.validation.status === 'pending'), value: this.display, placeholder: this.placeholder, name: this.name || undefined, disabled: this.disabled, readOnly: this.readOnly, required: this.required, autoComplete: "off", part: "input", onInput: this.onInput, onKeyDown: this.onKeydown, onCompositionstart: () => this.composing = true, onCompositionend: () => { this.composing = false; this.onInput(new InputEvent('input')); } }), this.clearable && h("button", { key: 'ab180bacc7f5232eb517b7fed9bee0d62a4b1156', type: "button", part: "affordance", "aria-label": `Clear ${this.label}`, disabled: this.disabled || this.readOnly, onClick: () => { this.commit(null, '', null, 'clear', 'pointer'); this.close(); this.input?.focus(); } }, "\u00D7"), this.help && h("button", { key: 'b4ea9b44c9e22eb9ac259fb67b86368eede2b13f', id: "help", type: "button", part: "affordance", "aria-label": `Help for ${this.label}`, disabled: this.disabled }, h("span", { key: '36222d7a98a4f6abb12f785e9b4f28c2479a4e37', "aria-hidden": "true" }, "?")), this.disclosure && h("button", { key: '1d8757b7c817575b6915d0e8c164e20776df83e5', type: "button", part: "affordance", "aria-label": `Suggestions for ${this.label}`, "aria-controls": "listbox", "aria-expanded": String(this.expanded), disabled: this.disabled || this.readOnly, onClick: () => {
+        return h(Host, { key: 'a33890c2824f29dfea5e22edddca4480a6d1d032', "data-size": this.size, "data-validation": this.validation.status, onFocusout: this.onFocusOut }, h("label", { key: 'c936530cf696c1d14245fd83895e9c58c908df12', htmlFor: "input", part: "label", class: this.labelVisibility === 'sr-only' ? 'sr-only' : undefined }, this.label, this.required ? ' *' : ''), h("div", { key: '0fe0ed9b15a3e256867e071ca7e4fa3abc66f27c', class: "field", part: "field", ref: element => this.field = element, onClick: event => {
+                if (!event.composedPath().some(node => node instanceof HTMLButtonElement))
+                    this.input?.focus();
+            } }, h("slot", { key: '9cc4c22eb7776e415792fbdf3c17c962c7107f70', name: "start" }), h("input", { key: '0898e8ec5af57c7ba8ad227164f7955ef4011729', id: "input", ref: element => this.input = element, role: "combobox", "aria-autocomplete": "list", "aria-expanded": String(this.expanded), "aria-controls": "listbox", "aria-activedescendant": this.expanded && this.active >= 0 ? `option-${this.active}` : undefined, "aria-describedby": description, "aria-invalid": String(this.validation.status === 'error'), "aria-busy": String(this.validation.status === 'pending'), value: this.display, placeholder: this.placeholder, name: this.name || undefined, disabled: this.disabled, readOnly: this.readOnly, required: this.required, autoComplete: "off", part: "input", onInput: this.onInput, onKeyDown: this.onKeydown, onCompositionstart: () => this.composing = true, onCompositionend: () => { this.composing = false; this.onInput(new InputEvent('input')); } }), this.clearable && h("button", { key: 'f9a49484ae9bcc4ace72a46d0c59202040ff39d8', type: "button", part: "affordance", "aria-label": `Clear ${this.label}`, disabled: this.disabled || this.readOnly, onClick: () => { this.commit(null, '', null, 'clear', 'pointer'); this.close(); this.input?.focus(); } }, "\u00D7"), this.help && h("button", { key: '597106eda4dcc68aa9fb2eaa99c1edad0d68a892', id: "help", type: "button", part: "affordance", "aria-label": `Help for ${this.label}`, disabled: this.disabled }, h("span", { key: 'd26085a52b16d65e26dc20ef8afacb5defec5f7b', "aria-hidden": "true" }, "?")), this.disclosure && h("button", { key: '391d1c987eb8e868b2846eafd0627cfc78ab7478', type: "button", part: "affordance", "aria-label": `Suggestions for ${this.label}`, "aria-controls": "listbox", "aria-expanded": String(this.expanded), disabled: this.disabled || this.readOnly, onClick: () => {
                 if (this.expanded)
                     this.close();
                 else
                     this.open('disclosure');
                 this.input?.focus();
-            } }, h("span", { key: 'cd2dad7694dc24104521a58d4182d6e866f54095', "aria-hidden": "true" }, "\u2304"))), this.help && h("ui-tooltip", { key: '5e0eecd828a0e82d94b0be5b5f3233cddca4a87b', id: "help-text", for: "help", toggleOnClick: true, onOpen: () => this.helpOpen = true, onClose: () => this.helpOpen = false }, this.help), h("div", { key: '694902d8c8f58664838a943e0e2c14c856be9a08', class: "popup", part: "popup", hidden: !this.expanded, ref: element => this.popup = element }, h("div", { key: '81b18e296151afde18c47492aa997bdd13d553bc', id: "listbox", role: "listbox", "aria-label": `${this.label} suggestions`, "aria-busy": String(this.loading) }, groups.map(group => h("div", { role: group ? 'group' : 'presentation', "aria-label": group || undefined }, group && h("div", { class: "group", part: "group" }, group), this.rows.map((row, index) => (row.group ?? '') !== group ? null : h("div", { id: `option-${index}`, role: "option", "aria-selected": String(this.selected === row.value), "aria-disabled": String(Boolean(row.disabled)), "data-active": this.active === index ? '' : undefined, part: "option", class: "option", onPointerDown: event => event.preventDefault(), onClick: () => this.choose(index, 'pointer') }, h("slot", { name: `option-${row.id}` }, h("span", { class: "primary", part: "option-primary" }, row.label), row.description && h("span", { class: "secondary", part: "option-secondary" }, row.description)))))), this.canCreate && h("div", { key: 'dbf87523b5c6f17aedf15295d9703557f2d31524', id: `option-${this.rows.length}`, role: "option", "aria-selected": "false", class: "option", part: "option", "data-active": this.active === this.rows.length ? '' : undefined, onPointerDown: event => event.preventDefault(), onClick: () => this.choose(this.rows.length, 'pointer') }, h("slot", { key: 'bd4bdd2b132de7f72c1e5450fb0c0d16254aeedb', name: "create" }, "Create \u201C", this.raw, "\u201D"))), this.loading ? h("div", { class: "message" }, h("slot", { name: "loading" }, "Loading suggestions\u2026"))
+            } }, h("span", { key: '45678ce468fd7944306d4542e3c6af0fe211af14', "aria-hidden": "true" }, "\u2304"))), this.help && h("ui-tooltip", { key: 'a8dc037639a60aff5a12b4651ffa10fc5ccd33eb', id: "help-text", for: "help", toggleOnClick: true, onOpen: () => this.helpOpen = true, onClose: () => this.helpOpen = false }, this.help), h("div", { key: 'f13fc7a11c3d22995035b6701ea24637a048a5b8', class: "popup", part: "popup", hidden: !this.expanded, ref: element => this.popup = element }, h("div", { key: '9d2bdfcc558f8e7de87f2915ea5607a8f32c1762', id: "listbox", role: "listbox", "aria-label": `${this.label} suggestions`, "aria-busy": String(this.loading) }, groups.map(group => h("div", { role: group ? 'group' : 'presentation', "aria-label": group || undefined }, group && h("div", { class: "group", part: "group" }, group), this.rows.map((row, index) => (row.group ?? '') !== group ? null : h("div", { id: `option-${index}`, role: "option", "aria-selected": String(this.selected === row.value), "aria-disabled": String(Boolean(row.disabled)), "data-active": this.active === index ? '' : undefined, part: "option", class: "option", onPointerDown: event => event.preventDefault(), onClick: () => this.choose(index, 'pointer') }, h("slot", { name: `option-${row.id}` }, h("span", { class: "primary", part: "option-primary" }, row.label), row.description && h("span", { class: "secondary", part: "option-secondary" }, row.description)))))), this.canCreate && h("div", { key: '9495fd43a721c84621b8083cb8eac776f843ab59', id: `option-${this.rows.length}`, role: "option", "aria-selected": "false", class: "option", part: "option", "data-active": this.active === this.rows.length ? '' : undefined, onPointerDown: event => event.preventDefault(), onClick: () => this.choose(this.rows.length, 'pointer') }, h("slot", { key: 'f0407c5622dcf3b325985c136657f8b9ac8a4ab5', name: "create" }, "Create \u201C", this.raw, "\u201D"))), this.loading ? h("div", { class: "message" }, h("slot", { name: "loading" }, "Loading suggestions\u2026"))
             : this.lookupError ? h("div", { class: "message" }, h("slot", { name: "error" }, this.lookupError))
-                : !this.rows.length && !this.canCreate ? h("div", { class: "message" }, h("slot", { name: "empty" }, "No suggestions.")) : null), h("div", { key: '0d39fb1acb6d65307fabc3f502785a19710dc4af', id: "validation", class: "message", part: "validation", hidden: !this.validation.issues.length }, this.validation.issues.map(issue => h("div", null, issue.message))), h("div", { key: 'a83334d72b90ca0f411e6161a8bf5e2e8c2e33a8', class: "sr-only", role: "status", "aria-live": "polite", "aria-atomic": "true" }, status, " ", this.validation.status === 'pending' ? 'Checking value…' : this.validation.issues.map(issue => issue.message).join(' ')));
+                : !this.rows.length && !this.canCreate ? h("div", { class: "message" }, h("slot", { name: "empty" }, "No suggestions.")) : null, h("slot", { key: 'efcaee3efb029a9e0bb4e033ab61b251331c1c93', name: "footer" })), h("div", { key: 'b44ccb319f94ebc9e6ac3204a8c1771d49485a58', id: "validation", class: "message", part: "validation", hidden: !this.validation.issues.length }, this.validation.issues.map(issue => h("div", null, issue.message))), h("div", { key: 'c3cb51dd4603734af4c7a02d8fe0bb42ac69083a', class: "sr-only", role: "status", "aria-live": "polite", "aria-atomic": "true" }, status, " ", this.validation.status === 'pending' ? 'Checking value…' : this.validation.issues.map(issue => issue.message).join(' ')));
     }
     static get is() { return "ui-combobox"; }
     static get encapsulation() { return "shadow"; }
@@ -698,6 +706,26 @@ export class UICombobox {
                 "attribute": "size",
                 "defaultValue": "'md'"
             },
+            "labelVisibility": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'visible' | 'sr-only'",
+                    "resolved": "\"sr-only\" | \"visible\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Keep the native label accessible while allowing compact composed controls."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "label-visibility",
+                "defaultValue": "'visible'"
+            },
             "disclosure": {
                 "type": "boolean",
                 "mutable": false,
@@ -948,6 +976,23 @@ export class UICombobox {
                     "text": "Validate for submission. Caller submits only non-pending, non-error output.",
                     "tags": []
                 }
+            },
+            "focusInput": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Focus the native editing input from a composed control.",
+                    "tags": []
+                }
             }
         };
     }

package/dist/collection/components/ui-context-menu/ui-context-menu.js

@@ -212,7 +212,7 @@ export class UIContextMenu {
         this.closeMenu('action', 'pointer');
     };
     render() {
-        return (h(Host, { key: '5d927f41a72e680ad6d6d4a3fa0c913360cb8660', "data-open": this.internalOpen ? '' : undefined, "data-focus-trigger": this.internalOpen ? this.focusTrigger : undefined, onKeyDown: this.onKeydown, onClick: this.onItemClick }, h("slot", { key: 'e5b1ec05d96093671fb839e3b81ddefb730575e1', name: "trigger" }), h("div", { key: 'a0c4a8ca50bcca2b7d3ee53b4c26db054af93151', class: "menu", "data-open": this.internalOpen ? '' : undefined }, h("ui-menu", { key: 'ac03b9dc3fa56d0cbb28115060726de4500a668b', open: this.internalOpen }, h("slot", { key: 'f2d8484cb9fb3956a3a5979795633a74d423577d' })))));
+        return (h(Host, { key: '171e647667bab4a9f905f2b531aa2db182fc426f', "data-open": this.internalOpen ? '' : undefined, "data-focus-trigger": this.internalOpen ? this.focusTrigger : undefined, onKeyDown: this.onKeydown, onClick: this.onItemClick }, h("slot", { key: 'f1a15e54ab3b14515553e05b4b3cf60ed7a99f8b', name: "trigger" }), h("div", { key: '450aaacf3f75a71ecce86300c0d824452ceec4a0', class: "menu", "data-open": this.internalOpen ? '' : undefined }, h("ui-menu", { key: '667003b7c6ab3ccbaa888b25cb87d921036ab827', open: this.internalOpen }, h("slot", { key: 'c0731115bc3dbd02c4125ef8208269dd97e124bf' })))));
     }
     static get is() { return "ui-context-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ui-dialog/ui-dialog.js

@@ -104,7 +104,7 @@ export class UIDialog {
             this.accessibleLabel = nextLabel;
     };
     render() {
-        return (h(Host, { key: 'b7aa33e24a74527a58718b3fa2218f5a09e9e439', "data-open": this.internalOpen ? '' : undefined, onKeyDown: this.onKeydown }, h("dialog", { key: 'f24455edc404581b5040c9c0090bf64141f9e296', ref: (el) => (this.dialogRef = el), open: this.internalOpen, "aria-label": this.accessibleLabel }, h("slot", { key: 'bad318e44b9c80dc0aae04ea5cdbb7b2ab472c35' }))));
+        return (h(Host, { key: '6e12a287866c76305c791c0ae538dcde63da3044', "data-open": this.internalOpen ? '' : undefined, onKeyDown: this.onKeydown }, h("dialog", { key: '99ba3815e8a8c70ce50ff08d9a8b162aa9c1011f', ref: (el) => (this.dialogRef = el), open: this.internalOpen, "aria-label": this.accessibleLabel }, h("slot", { key: 'e72b001877d2dfad1bcee9af87167c66d77fc952' }))));
     }
     static get is() { return "ui-dialog"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ui-disclosure/ui-disclosure.js

@@ -88,7 +88,7 @@ export class UIDisclosure {
         this.setOpen(!this.internalOpen, { reason: 'action', trigger: 'keyboard' });
     };
     render() {
-        return (h(Host, { key: '55a6fd71965104b96b55fd53870becce748a4116' }, h("slot", { key: '542727e10d335ff44fc7cf8250e80f045f89b8f2' })));
+        return (h(Host, { key: '55f998f8e47ebe01fd5832d6c3dac310dda34b8d' }, h("slot", { key: '0d88728151901e1e412d7f5a3ae78b06aa7548fb' })));
     }
     static get is() { return "ui-disclosure"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ui-editable/ui-editable.css

@@ -0,0 +1,2 @@
+:host { display: block; min-inline-size: 0; }
+[hidden] { display: none !important; }