@sekiui/elements 0.0.65 → 0.0.69

package/dist/cdn/seki-card-footer.js

@@ -16,7 +16,7 @@ const CardFooter = /*@__PURE__*/ proxyCustomElement(class CardFooter extends H {
         this.alignment = 'flex-start';
     }
     render() {
-        return (h("footer", { key: '6b19ac36822ab00c916557f798683526518eb009', class: `card-footer ${this.class || ''}`, style: { justifyContent: this.alignment } }, h("slot", { key: '10e4ad24216317524cfae114fb1e9c05f90842c3' })));
+        return (h("footer", { key: 'd23aa5f3f2e5b924ad2c91b6ba8c61adcff9535e', class: `card-footer ${this.class || ''}`, style: { justifyContent: this.alignment } }, h("slot", { key: 'fc9ea2a694839af39757aeb059b289db3e50ea8c' })));
     }
     static get style() { return sekiCardCss; }
 }, [257, "seki-card-footer", {

package/dist/cdn/seki-card-header.js

@@ -11,7 +11,7 @@ const CardHeader = /*@__PURE__*/ proxyCustomElement(class CardHeader extends H {
         this.__attachShadow();
     }
     render() {
-        return (h("header", { key: 'e617d4bd27f67bc41edb9c2705c956e314048874', class: `card-header ${this.class || ''}` }, h("slot", { key: '986906e925a6d1b735971fdb07c718693504ae65' })));
+        return (h("header", { key: '65aa324de8feee180e8c1606207a7fab830baa66', class: `card-header ${this.class || ''}` }, h("slot", { key: '54cf81a25ac43193eab8faee377de9a2855ef403' })));
     }
     static get style() { return sekiCardCss; }
 }, [257, "seki-card-header", {

package/dist/cdn/seki-card.js

@@ -11,7 +11,7 @@ const Card = /*@__PURE__*/ proxyCustomElement(class Card extends H {
         this.__attachShadow();
     }
     render() {
-        return (h("section", { key: 'fb7f38217354b898038ef588476e8163f378f4c1', class: this.class }, h("slot", { key: 'a875303ebc48eaa0f8bc5bc21d92aa32ef3a589f' })));
+        return (h("section", { key: '9a7d21c871a9ba7b4fe00e8a5fa1d3aa27368352', class: this.class }, h("slot", { key: 'cd2b315f1be88b8c22062178f975bbd443514735' })));
     }
     static get style() { return sekiCardCss; }
 }, [257, "seki-card", {

package/dist/cdn/seki-carousel-content.js

@@ -10,7 +10,7 @@ const SekiCarouselContent$1 = /*@__PURE__*/ proxyCustomElement(class SekiCarouse
         }
     }
     render() {
-        return (h(Host, { key: 'e8ba3c9a4ef861336d66954dbc13a0250520c590', class: "carousel-content-host" }, h("div", { key: '2e0520a2e279509d3f5ae38745cc41df4cf5b02f', class: "carousel-content" }, h("slot", { key: 'a43f5a1ea69ce53f4a9cc18ac9f0a7dbc1268399' }))));
+        return (h(Host, { key: '858ff1adcebe01d43ddeea8de7e7213caeebfc79', class: "carousel-content-host" }, h("div", { key: '98971216ed4496a92dd8e712f989d692f52f1b42', class: "carousel-content" }, h("slot", { key: 'c24e17ae54bb609ed8969d3ad3d3fd8ffc37a4b4' }))));
     }
     static get style() { return sekiCarouselContentCss; }
 }, [262, "seki-carousel-content"]);

package/dist/cdn/seki-carousel-dots.js

@@ -87,7 +87,7 @@ const SekiCarouselDots$1 = /*@__PURE__*/ proxyCustomElement(class SekiCarouselDo
     }
     render() {
         const dots = Array.from({ length: this.scrollSnapCount }, (_, i) => i);
-        return (h(Host, { key: '94362738e93936733be8af0e087772cfeea490f1', class: "carousel-dots" }, h("div", { key: '0b69b089634ee151104b1586bd5ed50b4b56b981', class: "carousel-dots__container", role: "tablist", "aria-label": "Carousel pagination" }, dots.map((index) => (h("button", { key: index, type: "button", class: {
+        return (h(Host, { key: 'ad29bcb018e0c950fba88fa069089dbedf68f415', class: "carousel-dots" }, h("div", { key: 'e8bea3f10c6f1ac3e4d8c66aba3772775511a654', class: "carousel-dots__container", role: "tablist", "aria-label": "Carousel pagination" }, dots.map((index) => (h("button", { key: index, type: "button", class: {
                 'carousel-dots__dot': true,
                 'carousel-dots__dot--active': index === this.selectedIndex,
             }, role: "tab", "aria-selected": index === this.selectedIndex ? 'true' : 'false', "aria-label": `Go to slide ${index + 1}`, tabindex: index === this.selectedIndex ? '0' : '-1', onClick: () => this.handleDotClick(index), onKeyDown: (e) => this.handleKeyDown(e, index) }, h("span", { class: "carousel-dots__dot-inner" })))))));

package/dist/cdn/seki-carousel-item.js

@@ -16,7 +16,7 @@ const SekiCarouselItem$1 = /*@__PURE__*/ proxyCustomElement(class SekiCarouselIt
         this.basis = '100%';
     }
     render() {
-        return (h(Host, { key: '54a39ec4d98934294fe9351d1f7ff5a05fe6cd13', class: "carousel-item", style: { flexBasis: this.basis }, role: "group", "aria-roledescription": "slide" }, h("slot", { key: 'f3bad935c7602fd9f6e5fb1180dd4a72751402f4' })));
+        return (h(Host, { key: '03bfc0370e5f2d306c6d6cdc38b414686cd791f1', class: "carousel-item", style: { flexBasis: this.basis }, role: "group", "aria-roledescription": "slide" }, h("slot", { key: '2a5b0bc4bbe830a098e3cd33065865a7fe0ecf6a' })));
     }
     static get style() { return sekiCarouselItemCss; }
 }, [257, "seki-carousel-item", {

package/dist/cdn/seki-carousel-next.js

@@ -53,7 +53,7 @@ const SekiCarouselNext$1 = /*@__PURE__*/ proxyCustomElement(class SekiCarouselNe
         this.disabled = !context.canScrollNext;
     }
     render() {
-        return (h(Host, { key: 'ba14cb410b0c92db37ba22aac1cd06b9c2988170', class: { 'carousel-nav': true, 'carousel-nav--next': true } }, h("button", { key: '7bd007f22cb950d918f96736d70f94eb7a6fc1de', type: "button", class: "carousel-nav__button", disabled: this.disabled, "aria-label": "Next slide", onClick: this.handleClick }, h("svg", { key: '2e3b6fff2abff1f2533c4bb048c79bbeb89e5b3d', class: "carousel-nav__icon", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: 'fabd3f3fa329abe2f3dd8b3b3c30a2766ade7870', points: "9 18 15 12 9 6" })))));
+        return (h(Host, { key: '27b6f6bdd8902959fb1a1d4906466cbf783a959c', class: { 'carousel-nav': true, 'carousel-nav--next': true } }, h("button", { key: 'b81fc359c344f394eb00b38a5228d28d8dfebd83', type: "button", class: "carousel-nav__button", disabled: this.disabled, "aria-label": "Next slide", onClick: this.handleClick }, h("svg", { key: '2c9f62c7860663e64c9cc2afcfb39b7be1d1f01d', class: "carousel-nav__icon", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: '0fce24db47046b22678bf0432c0843772e82e837', points: "9 18 15 12 9 6" })))));
     }
     get el() { return this; }
     static get style() { return sekiCarouselNavigationCss; }

package/dist/cdn/seki-carousel-previous.js

@@ -53,7 +53,7 @@ const SekiCarouselPrevious$1 = /*@__PURE__*/ proxyCustomElement(class SekiCarous
         this.disabled = !context.canScrollPrev;
     }
     render() {
-        return (h(Host, { key: 'f06ada05f7248ea39e14b693d0cde6ba45321521', class: { 'carousel-nav': true, 'carousel-nav--prev': true } }, h("button", { key: '0f47c32406ca271f3cf2dfaa6ebe36877dfcb6dd', type: "button", class: "carousel-nav__button", disabled: this.disabled, "aria-label": "Previous slide", onClick: this.handleClick }, h("svg", { key: '521f8ae84fbeb7ad17968ed0c8f444c9ec911c95', class: "carousel-nav__icon", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: 'fe8503accd343f182270b1e823722763eaf5fa13', points: "15 18 9 12 15 6" })))));
+        return (h(Host, { key: 'da4b0ea3b667d7d5b69b780346babf9f13825e8e', class: { 'carousel-nav': true, 'carousel-nav--prev': true } }, h("button", { key: 'f231ba294276e8428e8a68ebd8ab6784f0bee91b', type: "button", class: "carousel-nav__button", disabled: this.disabled, "aria-label": "Previous slide", onClick: this.handleClick }, h("svg", { key: 'bdca569fa954522d34dafed7010866167b6d6563', class: "carousel-nav__icon", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: '109cbaaa76454002037637ab0a041e626650ee73', points: "15 18 9 12 15 6" })))));
     }
     get el() { return this; }
     static get style() { return sekiCarouselNavigationCss; }

package/dist/cdn/seki-checkbox.js

@@ -104,11 +104,11 @@ const SekiCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class SekiCheckbox exten
     render() {
         const isChecked = this.isChecked;
         const dataState = this.indeterminate ? 'indeterminate' : isChecked ? 'checked' : 'unchecked';
-        return (h(Host, { key: '4d96fc6069e7aed2b871cd0d8dc08b56cde2afe7', "data-state": dataState, "data-disabled": this.disabled ? '' : null }, h("button", { key: '9ae2d2bdb41abfddd91d13305548a26cc5c1f9d1', type: "button", role: "checkbox", class: "checkbox", part: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : isChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel || undefined, "aria-describedby": this.ariaDescribedby || undefined, "aria-required": this.required ? 'true' : undefined, tabindex: this.disabled ? -1 : 0, disabled: this.disabled, onClick: this.handleClick }, (isChecked || this.indeterminate) && (h("span", { key: '49cef415f26e56a2676bf3e715c4d1f211bcfd2a', class: "indicator", part: "indicator" }, this.indeterminate ? (
+        return (h(Host, { key: 'e92ee1e3ae6554974fd28a2602cc971c33aeaaef', "data-state": dataState, "data-disabled": this.disabled ? '' : null }, h("button", { key: '06a8f74c647e708653514531271c5f2e7cab7410', type: "button", role: "checkbox", class: "checkbox", part: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : isChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel || undefined, "aria-describedby": this.ariaDescribedby || undefined, "aria-required": this.required ? 'true' : undefined, tabindex: this.disabled ? -1 : 0, disabled: this.disabled, onClick: this.handleClick }, (isChecked || this.indeterminate) && (h("span", { key: '532259b886d3e8af73b5932784746086a630439f', class: "indicator", part: "indicator" }, this.indeterminate ? (
         // Minus icon for indeterminate state
         h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "3", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("line", { x1: "5", y1: "12", x2: "19", y2: "12" }))) : (
         // Checkmark icon for checked state
-        h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "3", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { points: "20 6 9 17 4 12" })))))), this.name && (h("input", { key: '86d8b33c4513fca4e12d7a29747d1f1dc90e7cd8', type: "checkbox", name: this.name, value: this.value, checked: isChecked, required: this.required, disabled: this.disabled, style: { display: 'none' }, tabindex: -1, "aria-hidden": "true" }))));
+        h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "3", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { points: "20 6 9 17 4 12" })))))), this.name && (h("input", { key: '4c848e4cdb0f10f8592d95a7da95032b202502f4', type: "checkbox", name: this.name, value: this.value, checked: isChecked, required: this.required, disabled: this.disabled, style: { display: 'none' }, tabindex: -1, "aria-hidden": "true" }))));
     }
     static get formAssociated() { return true; }
     static get style() { return sekiCheckboxCss; }

package/dist/cdn/seki-collapsible-content.js

@@ -87,11 +87,11 @@ const SekiCollapsibleContent$1 = /*@__PURE__*/ proxyCustomElement(class SekiColl
         else {
             contentStyle.height = '0';
         }
-        return (h(Host, { key: 'e025e4f99175d7de796412bfe109875ce573849c', "data-state": this._isOpen ? 'open' : 'closed' }, h("div", { key: 'aea2cd5b9a0ed647b69558000e48efb1a419edf2', ref: (el) => (this.contentRef = el), part: "content", id: contentId, role: "region", "aria-labelledby": triggerId, "aria-hidden": !this._isOpen, class: {
+        return (h(Host, { key: '27f18a16cb1324bba8f02502131c29e6471b32bc', "data-state": this._isOpen ? 'open' : 'closed' }, h("div", { key: 'f82033ef12b4f0ea12ae60ca8157def45421c252', ref: (el) => (this.contentRef = el), part: "content", id: contentId, role: "region", "aria-labelledby": triggerId, "aria-hidden": !this._isOpen, class: {
                 'collapsible-content': true,
                 'collapsible-content--open': this._isOpen,
                 'collapsible-content--animating': this._isAnimating,
-            }, style: contentStyle }, h("div", { key: 'bf591bc5697d85681c8b95660bcd3a510fc42a31', class: "collapsible-content-inner" }, h("slot", { key: '77c9141495a0a24622cc08860056ee5b4aacb6f2' })))));
+            }, style: contentStyle }, h("div", { key: '48898deaeab9bac2ec61bd22e6895265a5a797d7', class: "collapsible-content-inner" }, h("slot", { key: '4952c3bdce1a9df77517eae7c996c2ef2f107811' })))));
     }
     get el() { return this; }
     static get style() { return sekiCollapsibleContentCss; }

package/dist/cdn/seki-collapsible.js

@@ -91,7 +91,7 @@ const SekiCollapsible$1 = /*@__PURE__*/ proxyCustomElement(class SekiCollapsible
         };
     }
     render() {
-        return (h(Host, { key: 'c65f0a79cc6f865f4e74e7c72b17c6ad01d496d2', "data-state": this._isOpen ? 'open' : 'closed', "data-disabled": this.disabled ? '' : undefined }, h("div", { key: 'fea15873c67cf46620d0f56578d8b1ca1f1a02e1', part: "collapsible", class: "collapsible" }, h("slot", { key: 'f27e929ea49fdd6b2fedb39cee2b67762795b022' }))));
+        return (h(Host, { key: '3d46e1be1070262917348a933841fdc653cfb3c5', "data-state": this._isOpen ? 'open' : 'closed', "data-disabled": this.disabled ? '' : undefined }, h("div", { key: '8499206ae23b4cadf07ee92b46c431f757934afd', part: "collapsible", class: "collapsible" }, h("slot", { key: 'a4133f7a00e3d7807c98c4cdca5f5991a2778f25' }))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/cdn/seki-combobox-content.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface SekiComboboxContent extends Components.SekiComboboxContent, HTMLElement {}
+export const SekiComboboxContent: {
+    prototype: SekiComboboxContent;
+    new (): SekiComboboxContent;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/cdn/seki-combobox-content.js

@@ -0,0 +1,68 @@
+import { p as proxyCustomElement, H, h, d as Host } from './p-DJy0z1-k.js';
+
+const sekiComboboxContentCss = ":host{display:block;position:absolute;top:100%;left:0;right:0;z-index:50;margin-top:var(--seki-spacing-1, 0.25rem)}:host(.hidden){display:none}.combobox-content{overflow-y:auto;background-color:var(--seki-color-background, hsl(0 0% 100%));border:1px solid var(--seki-color-border, hsl(240 5.9% 90%));border-radius:var(--seki-radius-md, 0.375rem);box-shadow:var(--seki-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1));padding:var(--seki-spacing-1, 0.25rem)}.combobox-content::-webkit-scrollbar{width:8px}.combobox-content::-webkit-scrollbar-track{background:transparent}.combobox-content::-webkit-scrollbar-thumb{background-color:var(--seki-color-muted, hsl(240 4.8% 95.9%));border-radius:4px}.combobox-content::-webkit-scrollbar-thumb:hover{background-color:var(--seki-color-muted-foreground, hsl(240 3.8% 46.1%))}:host([data-theme=\"dark\"]) .combobox-content,:host-context([data-theme=\"dark\"]) .combobox-content{background-color:var(--seki-color-background-dark, hsl(240 10% 3.9%));border-color:var(--seki-color-border-dark, hsl(240 3.7% 15.9%))}:host([data-theme=\"dark\"]) .combobox-content::-webkit-scrollbar-thumb,:host-context([data-theme=\"dark\"]) .combobox-content::-webkit-scrollbar-thumb{background-color:var(--seki-color-accent-dark, hsl(240 3.7% 15.9%))}";
+
+const SekiComboboxContent$1 = /*@__PURE__*/ proxyCustomElement(class SekiComboboxContent extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        /** Maximum height of the dropdown */
+        this.maxHeight = '15rem';
+        this.isOpen = false;
+        this.listboxId = '';
+    }
+    getContext() {
+        const combobox = this.el.closest('seki-combobox');
+        return (combobox === null || combobox === void 0 ? void 0 : combobox.comboboxContext) || null;
+    }
+    componentDidLoad() {
+        this.updateState();
+        // Set up mutation observer to watch for context changes
+        this.observeParent();
+    }
+    observeParent() {
+        const combobox = this.el.closest('seki-combobox');
+        if (combobox) {
+            const observer = new MutationObserver(() => this.updateState());
+            observer.observe(combobox, { attributes: true, subtree: false });
+        }
+    }
+    updateState() {
+        const ctx = this.getContext();
+        if (ctx) {
+            this.isOpen = ctx.open;
+            this.listboxId = ctx.listboxId;
+        }
+    }
+    render() {
+        return (h(Host, { key: '075c772adf87a091ea837910a765a85f2f562c1b', class: { 'hidden': !this.isOpen } }, h("div", { key: 'afa4a691a9cc139e48fbd2a1b3975b15dee44d5e', id: this.listboxId, class: "combobox-content", role: "listbox", style: { maxHeight: this.maxHeight } }, h("slot", { key: 'f00a97069107edd4340eaf181278d8ec905a5343' }))));
+    }
+    get el() { return this; }
+    static get style() { return sekiComboboxContentCss; }
+}, [257, "seki-combobox-content", {
+        "maxHeight": [1, "max-height"],
+        "isOpen": [32],
+        "listboxId": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["seki-combobox-content"];
+    components.forEach(tagName => { switch (tagName) {
+        case "seki-combobox-content":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SekiComboboxContent$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const SekiComboboxContent = SekiComboboxContent$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { SekiComboboxContent, defineCustomElement };

package/dist/cdn/seki-combobox-empty.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface SekiComboboxEmpty extends Components.SekiComboboxEmpty, HTMLElement {}
+export const SekiComboboxEmpty: {
+    prototype: SekiComboboxEmpty;
+    new (): SekiComboboxEmpty;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/cdn/seki-combobox-empty.js

@@ -0,0 +1,68 @@
+import { p as proxyCustomElement, H, h, d as Host } from './p-DJy0z1-k.js';
+
+const sekiComboboxEmptyCss = ":host{display:block;--seki-combobox-empty-font-family:var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif);--seki-combobox-empty-font-size:var(--seki-font-size-sm, 0.875rem);--seki-combobox-empty-font-weight:var(--seki-font-weight-normal, 400);--seki-combobox-empty-line-height:var(--seki-line-height-normal, 1.5);--seki-combobox-empty-color:var(--seki-color-text-muted, hsl(0, 0%, 45%));--seki-combobox-empty-error-color:var(--seki-color-destructive, hsl(0, 84%, 60%));--seki-combobox-empty-padding:var(--seki-spacing-4, 1rem)}:host([data-theme='dark']){--seki-combobox-empty-color:var(--seki-color-text-muted, hsl(0, 0%, 65%))}.seki-combobox-empty{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--seki-spacing-2, 0.5rem);padding:var(--seki-combobox-empty-padding);font-family:var(--seki-combobox-empty-font-family);font-size:var(--seki-combobox-empty-font-size);font-weight:var(--seki-combobox-empty-font-weight);line-height:var(--seki-combobox-empty-line-height);color:var(--seki-combobox-empty-color);text-align:center;box-sizing:border-box}.seki-combobox-empty--no-results{}.seki-combobox-empty--loading{}.seki-combobox-empty--no-input{}.seki-combobox-empty--error{color:var(--seki-combobox-empty-error-color)}@media (prefers-reduced-motion: reduce){.seki-combobox-empty{transition:none}}@media (prefers-contrast: more){.seki-combobox-empty{color:var(--seki-color-text, hsl(0, 0%, 10%))}.seki-combobox-empty--error{color:var(--seki-color-destructive, hsl(0, 84%, 50%))}}";
+
+const SekiComboboxEmpty$1 = /*@__PURE__*/ proxyCustomElement(class SekiComboboxEmpty extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        /**
+         * The reason why the combobox is showing an empty state
+         * @default 'no-results'
+         */
+        this.reason = 'no-results';
+    }
+    render() {
+        const containerClasses = {
+            'seki-combobox-empty': true,
+            [`seki-combobox-empty--${this.reason}`]: true,
+        };
+        const classString = Object.entries(containerClasses)
+            .filter(([, active]) => active)
+            .map(([name]) => name)
+            .join(' ');
+        return (h(Host, { key: '6425da7611e88a06900cd83ad20190aba67c020d' }, h("div", { key: '84878796d46a346231e6b0eca977d34f4dcd36a4', class: classString, role: "status" }, this.renderSlotForReason(), h("slot", { key: '764dc897c6389b53d2f171fdacc1d1628996b5ba' }))));
+    }
+    /**
+     * Renders the appropriate named slot based on the current reason
+     */
+    renderSlotForReason() {
+        switch (this.reason) {
+            case 'loading':
+                return h("slot", { name: "loading" });
+            case 'no-results':
+                return h("slot", { name: "no-results" });
+            case 'no-input':
+                return h("slot", { name: "no-input" });
+            case 'error':
+                return h("slot", { name: "error" });
+            default:
+                return null;
+        }
+    }
+    static get style() { return sekiComboboxEmptyCss; }
+}, [257, "seki-combobox-empty", {
+        "reason": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["seki-combobox-empty"];
+    components.forEach(tagName => { switch (tagName) {
+        case "seki-combobox-empty":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SekiComboboxEmpty$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const SekiComboboxEmpty = SekiComboboxEmpty$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { SekiComboboxEmpty, defineCustomElement };

package/dist/cdn/seki-combobox-group.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface SekiComboboxGroup extends Components.SekiComboboxGroup, HTMLElement {}
+export const SekiComboboxGroup: {
+    prototype: SekiComboboxGroup;
+    new (): SekiComboboxGroup;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/cdn/seki-combobox-group.js

@@ -0,0 +1,39 @@
+import { p as proxyCustomElement, H, h, d as Host } from './p-DJy0z1-k.js';
+
+const sekiComboboxGroupCss = ":host{display:block}.combobox-group{padding:var(--seki-spacing-1, 0.25rem) 0}.combobox-group-label{padding:var(--seki-spacing-2, 0.5rem) var(--seki-spacing-3, 0.75rem);font-family:var(--seki-font-sans, system-ui, -apple-system, sans-serif);font-size:var(--seki-font-size-xs, 0.75rem);font-weight:var(--seki-font-weight-medium, 500);line-height:var(--seki-line-height-tight, 1.25);color:var(--seki-color-muted-foreground, hsl(240 3.8% 46.1%));text-transform:uppercase;letter-spacing:0.05em}.combobox-group-items{display:flex;flex-direction:column}:host([data-theme=\"dark\"]) .combobox-group-label,:host-context([data-theme=\"dark\"]) .combobox-group-label{color:var(--seki-color-muted-foreground-dark, hsl(240 5% 64.9%))}";
+
+const SekiComboboxGroup$1 = /*@__PURE__*/ proxyCustomElement(class SekiComboboxGroup extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.groupId = `combobox-group-${Math.random().toString(36).substr(2, 9)}`;
+    }
+    render() {
+        return (h(Host, { key: '8f7afc4a5d4610aecf985c3e1f8c2496608d9498' }, h("div", { key: '6766aa357f6a00b2a4fbcb6126aca916200da698', class: "combobox-group", role: "group", "aria-labelledby": this.groupId }, h("div", { key: 'faefff69bc4f5264809ef2e6a73a93e479afdbae', id: this.groupId, class: "combobox-group-label" }, this.label), h("div", { key: '89d5eceb7245acd5e36160c1f8cfc82a1c656455', class: "combobox-group-items" }, h("slot", { key: '1f2b6e708021437a34cd2cb7bdf5a857189ee5f0' })))));
+    }
+    static get style() { return sekiComboboxGroupCss; }
+}, [257, "seki-combobox-group", {
+        "label": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["seki-combobox-group"];
+    components.forEach(tagName => { switch (tagName) {
+        case "seki-combobox-group":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SekiComboboxGroup$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const SekiComboboxGroup = SekiComboboxGroup$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { SekiComboboxGroup, defineCustomElement };

package/dist/cdn/seki-combobox-input.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface SekiComboboxInput extends Components.SekiComboboxInput, HTMLElement {}
+export const SekiComboboxInput: {
+    prototype: SekiComboboxInput;
+    new (): SekiComboboxInput;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/cdn/seki-combobox-input.js

@@ -0,0 +1,195 @@
+import { p as proxyCustomElement, H, h, d as Host } from './p-DJy0z1-k.js';
+
+const sekiComboboxInputCss = ":host{display:block}.combobox-input-wrapper{display:flex;flex-wrap:wrap;align-items:center;gap:var(--seki-spacing-1, 0.25rem);min-height:2.5rem;padding:var(--seki-spacing-2, 0.5rem) var(--seki-spacing-3, 0.75rem);background-color:var(--seki-color-background, hsl(0 0% 100%));border:1px solid var(--seki-color-border, hsl(240 5.9% 90%));border-radius:var(--seki-radius-md, 0.375rem);transition:border-color 0.15s ease, box-shadow 0.15s ease}.combobox-input-wrapper:focus-within{border-color:var(--seki-color-ring, hsl(240 5% 64.9%));box-shadow:0 0 0 2px var(--seki-color-ring-offset, hsl(0 0% 100%)), 0 0 0 4px var(--seki-color-ring, hsl(240 5% 64.9%))}.combobox-input{flex:1;min-width:4rem;border:none;outline:none;background:transparent;font-family:var(--seki-font-sans, system-ui, -apple-system, sans-serif);font-size:var(--seki-font-size-sm, 0.875rem);line-height:var(--seki-line-height-normal, 1.5);color:var(--seki-color-foreground, hsl(240 10% 3.9%))}.combobox-input::placeholder{color:var(--seki-color-muted-foreground, hsl(240 3.8% 46.1%))}.combobox-input:disabled{cursor:not-allowed;opacity:0.5}.combobox-chip{display:inline-flex;align-items:center;gap:var(--seki-spacing-1, 0.25rem);padding:var(--seki-spacing-1, 0.25rem) var(--seki-spacing-2, 0.5rem);background:var(--seki-color-muted, hsl(240 4.8% 95.9%));border-radius:var(--seki-radius-sm, 0.25rem);font-family:var(--seki-font-sans, system-ui, -apple-system, sans-serif);font-size:var(--seki-font-size-xs, 0.75rem);line-height:var(--seki-line-height-tight, 1.25)}.chip-label{max-width:8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chip-remove{display:flex;align-items:center;justify-content:center;width:1rem;height:1rem;padding:0;border:none;background:transparent;cursor:pointer;color:var(--seki-color-muted-foreground, hsl(240 3.8% 46.1%));border-radius:var(--seki-radius-sm, 0.25rem)}.chip-remove:hover{background:var(--seki-color-accent, hsl(240 4.8% 95.9%));color:var(--seki-color-foreground, hsl(240 10% 3.9%))}.chip-remove svg{width:0.75rem;height:0.75rem}.combobox-count,.combobox-text{font-family:var(--seki-font-sans, system-ui, -apple-system, sans-serif);font-size:var(--seki-font-size-sm, 0.875rem);color:var(--seki-color-foreground, hsl(240 10% 3.9%))}:host([data-theme=\"dark\"]) .combobox-input-wrapper,:host-context([data-theme=\"dark\"]) .combobox-input-wrapper{background-color:var(--seki-color-background-dark, hsl(240 10% 3.9%));border-color:var(--seki-color-border-dark, hsl(240 3.7% 15.9%))}:host([data-theme=\"dark\"]) .combobox-input,:host-context([data-theme=\"dark\"]) .combobox-input{color:var(--seki-color-foreground-dark, hsl(0 0% 98%))}:host([data-theme=\"dark\"]) .combobox-chip,:host-context([data-theme=\"dark\"]) .combobox-chip{background:var(--seki-color-accent-dark, hsl(240 3.7% 15.9%))}:host([data-theme=\"dark\"]) .combobox-count,:host-context([data-theme=\"dark\"]) .combobox-count,:host([data-theme=\"dark\"]) .combobox-text,:host-context([data-theme=\"dark\"]) .combobox-text{color:var(--seki-color-foreground-dark, hsl(0 0% 98%))}";
+
+const SekiComboboxInput$1 = /*@__PURE__*/ proxyCustomElement(class SekiComboboxInput extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.searchQuery = '';
+        this.isOpen = false;
+        this.selectedItems = [];
+        this.multiple = false;
+        this.multiSelectDisplay = 'chips';
+        this.placeholder = 'Search...';
+        this.disabled = false;
+        this.listboxId = '';
+        this.inputId = '';
+        this.focusedItemValue = null;
+        this.handleInput = (event) => {
+            const input = event.target;
+            this.searchQuery = input.value;
+            const ctx = this.getContext();
+            if (ctx) {
+                ctx.onSearchChange(input.value);
+            }
+        };
+        this.handleFocus = () => {
+            const ctx = this.getContext();
+            if (ctx && !this.disabled) {
+                ctx.onOpenChange(true);
+            }
+        };
+        this.handleKeyDown = (event) => {
+            const ctx = this.getContext();
+            if (!ctx)
+                return;
+            switch (event.key) {
+                case 'ArrowDown':
+                    event.preventDefault();
+                    if (!this.isOpen) {
+                        ctx.onOpenChange(true);
+                    }
+                    // Navigate to next item - parent handles via keyboard method
+                    this.dispatchKeyboardEvent('ArrowDown');
+                    break;
+                case 'ArrowUp':
+                    event.preventDefault();
+                    this.dispatchKeyboardEvent('ArrowUp');
+                    break;
+                case 'Enter':
+                    event.preventDefault();
+                    if (this.focusedItemValue) {
+                        ctx.onItemSelect(this.focusedItemValue);
+                    }
+                    else if (ctx.allowCustomValue && this.searchQuery.trim()) {
+                        ctx.onCustomValueCreate(this.searchQuery.trim());
+                    }
+                    break;
+                case 'Escape':
+                    event.preventDefault();
+                    ctx.onOpenChange(false);
+                    this.searchQuery = '';
+                    ctx.onSearchChange('');
+                    break;
+                case 'Backspace':
+                    if (this.multiple && this.multiSelectDisplay === 'chips' && !this.searchQuery && this.selectedItems.length > 0) {
+                        const lastItem = this.selectedItems[this.selectedItems.length - 1];
+                        ctx.removeValue(lastItem.value);
+                    }
+                    break;
+                case 'Home':
+                    if (this.isOpen) {
+                        event.preventDefault();
+                        this.dispatchKeyboardEvent('Home');
+                    }
+                    break;
+                case 'End':
+                    if (this.isOpen) {
+                        event.preventDefault();
+                        this.dispatchKeyboardEvent('End');
+                    }
+                    break;
+            }
+        };
+        this.handleChipRemove = (event, value) => {
+            event.stopPropagation();
+            const ctx = this.getContext();
+            if (ctx) {
+                ctx.removeValue(value);
+            }
+        };
+    }
+    getContext() {
+        const combobox = this.el.closest('seki-combobox');
+        return (combobox === null || combobox === void 0 ? void 0 : combobox.comboboxContext) || null;
+    }
+    componentDidLoad() {
+        this.updateState();
+    }
+    updateState() {
+        const ctx = this.getContext();
+        if (ctx) {
+            this.searchQuery = ctx.searchQuery;
+            this.isOpen = ctx.open;
+            this.selectedItems = ctx.getSelectedItems();
+            this.multiple = ctx.multiple;
+            this.multiSelectDisplay = ctx.multiSelectDisplay;
+            this.disabled = ctx.disabled;
+            this.listboxId = ctx.listboxId;
+            this.inputId = ctx.inputId;
+            this.focusedItemValue = ctx.focusedItemValue;
+        }
+    }
+    dispatchKeyboardEvent(key) {
+        const combobox = this.el.closest('seki-combobox');
+        if (combobox) {
+            combobox.dispatchEvent(new CustomEvent('comboboxKeyboard', {
+                detail: { key },
+                bubbles: false
+            }));
+        }
+    }
+    renderChips() {
+        return this.selectedItems.map(item => (h("span", { class: "combobox-chip", key: item.value }, h("span", { class: "chip-label" }, item.label), h("button", { type: "button", class: "chip-remove", "aria-label": `Remove ${item.label}`, onClick: (e) => this.handleChipRemove(e, item.value), tabIndex: -1 }, h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), h("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))))));
+    }
+    renderCount() {
+        if (this.selectedItems.length === 0)
+            return null;
+        return (h("span", { class: "combobox-count" }, this.selectedItems.length, " selected"));
+    }
+    renderText() {
+        if (this.selectedItems.length === 0)
+            return null;
+        const labels = this.selectedItems.map(i => i.label);
+        const text = labels.length <= 3
+            ? labels.join(', ')
+            : `${labels.slice(0, 3).join(', ')}...`;
+        return h("span", { class: "combobox-text" }, text);
+    }
+    renderSelectedDisplay() {
+        if (!this.multiple)
+            return null;
+        switch (this.multiSelectDisplay) {
+            case 'chips':
+                return this.renderChips();
+            case 'count':
+                return this.renderCount();
+            case 'text':
+                return this.renderText();
+            default:
+                return null;
+        }
+    }
+    render() {
+        const focusedItemId = this.focusedItemValue
+            ? `combobox-item-${this.focusedItemValue}`
+            : undefined;
+        return (h(Host, { key: 'af55bf9ddfbd93b2f8eb506598f336642f9e3baa' }, h("div", { key: 'd8276ec24a1ed4725b3c9d0ed4995dd267dea024', class: "combobox-input-wrapper" }, this.renderSelectedDisplay(), h("input", { key: '40754676011f95b9e1bc201aea1c2037849c1ef6', id: this.inputId, type: "text", class: "combobox-input", value: this.searchQuery, placeholder: this.selectedItems.length > 0 && this.multiple ? '' : this.placeholder, disabled: this.disabled, "aria-autocomplete": "list", "aria-controls": this.listboxId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-activedescendant": focusedItemId, onInput: this.handleInput, onFocus: this.handleFocus, onKeyDown: this.handleKeyDown }))));
+    }
+    get el() { return this; }
+    static get style() { return sekiComboboxInputCss; }
+}, [257, "seki-combobox-input", {
+        "searchQuery": [32],
+        "isOpen": [32],
+        "selectedItems": [32],
+        "multiple": [32],
+        "multiSelectDisplay": [32],
+        "placeholder": [32],
+        "disabled": [32],
+        "listboxId": [32],
+        "inputId": [32],
+        "focusedItemValue": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["seki-combobox-input"];
+    components.forEach(tagName => { switch (tagName) {
+        case "seki-combobox-input":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SekiComboboxInput$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const SekiComboboxInput = SekiComboboxInput$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { SekiComboboxInput, defineCustomElement };

package/dist/cdn/seki-combobox-item.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface SekiComboboxItem extends Components.SekiComboboxItem, HTMLElement {}
+export const SekiComboboxItem: {
+    prototype: SekiComboboxItem;
+    new (): SekiComboboxItem;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;