@sekiui/elements 0.0.82 → 0.0.84

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

@@ -11,6 +11,13 @@ const SekiSelect = class {
         this.sekiChange = index.createEvent(this, "sekiChange");
         this.sekiOpenChange = index.createEvent(this, "sekiOpenChange");
         this.sekiValidate = index.createEvent(this, "sekiValidate");
+        if (hostRef.$hostElement$["s-ei"]) {
+            this.internals = hostRef.$hostElement$["s-ei"];
+        }
+        else {
+            this.internals = hostRef.$hostElement$.attachInternals();
+            hostRef.$hostElement$["s-ei"] = this.internals;
+        }
         /** Enable multi-select mode */
         this.multiple = false;
         /** Placeholder text shown when no selection */
@@ -129,7 +136,17 @@ const SekiSelect = class {
             return this.registeredOptions.filter(opt => opt.value === this.internalValue);
         };
         this.registerOption = (option) => {
-            this.registeredOptions = [...this.registeredOptions, option];
+            // Idempotent: replace in place if this value already exists (e.g. an option
+            // re-registering after a DOM move) so reconnects can't create duplicates.
+            const existingIndex = this.registeredOptions.findIndex(opt => opt.value === option.value);
+            if (existingIndex >= 0) {
+                const next = [...this.registeredOptions];
+                next[existingIndex] = option;
+                this.registeredOptions = next;
+            }
+            else {
+                this.registeredOptions = [...this.registeredOptions, option];
+            }
         };
         this.unregisterOption = (value) => {
             this.registeredOptions = this.registeredOptions.filter(opt => opt.value !== value);
@@ -169,6 +186,8 @@ const SekiSelect = class {
         }
         // Expose context on the element for child components
         this.el.selectContext = this.selectContext;
+        // Seed the form value so an unchanged select still submits its initial value.
+        this.syncFormValue();
     }
     componentDidLoad() {
         // Expose context on the element for child components
@@ -208,10 +227,45 @@ const SekiSelect = class {
     }
     handleInternalValueChange() {
         this.updateContextOnElement();
+        this.syncFormValue();
+    }
+    handleDisabledChange() {
+        this.syncFormValue();
     }
     updateContextOnElement() {
         this.el.selectContext = this.selectContext;
     }
+    /**
+     * Mirror the current selection into the associated form via ElementInternals.
+     * Replaces the previous hidden native control, which lived inside the shadow
+     * root and therefore never participated in form submission.
+     */
+    syncFormValue() {
+        if (!this.internals || typeof this.internals.setFormValue !== 'function') {
+            return;
+        }
+        // Disabled controls do not contribute a value to the form.
+        if (this.disabled) {
+            this.internals.setFormValue(null);
+            return;
+        }
+        if (this.multiple) {
+            const values = Array.isArray(this.internalValue) ? this.internalValue : [];
+            if (!this.name || values.length === 0) {
+                this.internals.setFormValue(null);
+                return;
+            }
+            const formData = new FormData();
+            for (const val of values) {
+                formData.append(this.name, String(val));
+            }
+            this.internals.setFormValue(formData);
+        }
+        else {
+            const value = this.internalValue;
+            this.internals.setFormValue(value === '' || value === undefined || value === null ? null : String(value));
+        }
+    }
     // ===========================
     // Methods
     // ===========================
@@ -274,29 +328,33 @@ const SekiSelect = class {
         }
     }
     focusNextOption() {
-        if (this.registeredOptions.length === 0)
+        const options = this.registeredOptions;
+        if (options.length === 0)
             return;
-        let nextIndex = 0;
-        if (this.focusedOptionValue !== null) {
-            const currentIndex = this.registeredOptions.findIndex(opt => opt.value === this.focusedOptionValue);
-            nextIndex = currentIndex >= 0 ? Math.min(currentIndex + 1, this.registeredOptions.length - 1) : 0;
-        }
-        const nextOption = this.registeredOptions[nextIndex];
-        if (nextOption && !nextOption.disabled) {
-            this.handleOptionFocus(nextOption.value);
+        const currentIndex = this.focusedOptionValue !== null
+            ? options.findIndex(opt => opt.value === this.focusedOptionValue)
+            : -1;
+        // Walk forward to the next enabled option, skipping disabled ones.
+        for (let i = currentIndex + 1; i < options.length; i++) {
+            if (!options[i].disabled) {
+                this.handleOptionFocus(options[i].value);
+                return;
+            }
         }
     }
     focusPreviousOption() {
-        if (this.registeredOptions.length === 0)
+        const options = this.registeredOptions;
+        if (options.length === 0)
             return;
-        let prevIndex = this.registeredOptions.length - 1;
-        if (this.focusedOptionValue !== null) {
-            const currentIndex = this.registeredOptions.findIndex(opt => opt.value === this.focusedOptionValue);
-            prevIndex = currentIndex > 0 ? currentIndex - 1 : this.registeredOptions.length - 1;
-        }
-        const prevOption = this.registeredOptions[prevIndex];
-        if (prevOption && !prevOption.disabled) {
-            this.handleOptionFocus(prevOption.value);
+        const currentIndex = this.focusedOptionValue !== null
+            ? options.findIndex(opt => opt.value === this.focusedOptionValue)
+            : options.length;
+        // Walk backward to the previous enabled option, skipping disabled ones.
+        for (let i = currentIndex - 1; i >= 0; i--) {
+            if (!options[i].disabled) {
+                this.handleOptionFocus(options[i].value);
+                return;
+            }
         }
     }
     addToSearchBuffer(char) {
@@ -345,23 +403,16 @@ const SekiSelect = class {
     // Render
     // ===========================
     render() {
-        return (index.h(index.Host, { key: '5a1333b70dd0f6cb4e02c42643cd21b89f896ceb' }, index.h("slot", { key: 'd67d8ebd047bb146f42a5ce73871324868235137' }), this.name && this.renderHiddenNativeElement()));
-    }
-    renderHiddenNativeElement() {
-        if (this.multiple) {
-            return (index.h("select", { class: "select-native", name: this.name, multiple: true, required: this.required, disabled: this.disabled, "aria-hidden": "true", tabindex: -1 }, Array.isArray(this.internalValue) &&
-                this.internalValue.map(val => (index.h("option", { value: val, selected: true }, val)))));
-        }
-        else {
-            return (index.h("input", { type: "hidden", class: "select-native", name: this.name, value: this.internalValue, required: this.required, disabled: this.disabled }));
-        }
+        return (index.h(index.Host, { key: '3fad15b79a53f9ef681d129650f0f533c6c07ff8' }, index.h("slot", { key: 'f6d571849ceb5fa3459a252a76311df4c2c6dff4' })));
     }
+    static get formAssociated() { return true; }
     get el() { return index.getElement(this); }
     static get watchers() { return {
         "value": ["handleValuePropChange"],
         "open": ["handleOpenPropChange"],
         "isOpen": ["handleIsOpenChange"],
-        "internalValue": ["handleInternalValueChange"]
+        "internalValue": ["handleInternalValueChange"],
+        "disabled": ["handleDisabledChange"]
     }; }
 };
 SekiSelect.style = sekiSelectCss;

package/dist/cjs/seki-separator.cjs.entry.js

@@ -28,7 +28,7 @@ const SekiSeparator = class {
     }
     render() {
         const isVertical = this.orientation === 'vertical';
-        return (index.h("div", { key: 'ed4e388d8b14612ba2e7d5ba56d3107398a8f75f', class: {
+        return (index.h("div", { key: '7c9d4f8485d17373b0b8ba181be63c4fa56aa1aa', class: {
                 'seki-separator': true,
                 'seki-separator--horizontal': !isVertical,
                 'seki-separator--vertical': isVertical,

package/dist/cjs/seki-sheet-close.cjs.entry.js

@@ -20,7 +20,7 @@ const SekiSheetClose = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: '1cbac3a45a982cf402b796e8a5d1a2a7a555e967', class: "seki-sheet-close", part: "close", onClick: this.handleClick }, index.h("slot", { key: 'e0383ad8d5b6be4d9333387eb57a9555cd20f395' })));
+        return (index.h("div", { key: '6dd2f5309d4da6557f4f570677f80c91c244ab6e', class: "seki-sheet-close", part: "close", onClick: this.handleClick }, index.h("slot", { key: '39a1f16e2aa3d19e1b9a62b96c4aef6a30278aeb' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sheet-description.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSheetDescription = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("p", { key: '1051b675aa3674a86d624b5bb520a6d9f37824bd', class: "seki-sheet-description", part: "description" }, index.h("slot", { key: '9117ef53a2d4c44ceeacfe9db450725f1ded8cb2' })));
+        return (index.h("p", { key: '30311fecac67e26c13a4ebf25b16f14c2a2c7dc0', class: "seki-sheet-description", part: "description" }, index.h("slot", { key: '0fcba9a2e7b525f21bf4ff3a8e5deabf7bc9f861' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sheet-footer.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSheetFooter = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: 'dd056f387174e6588b920f3e42ecbadd05ce85eb', class: "seki-sheet-footer", part: "footer" }, index.h("slot", { key: '9dc0a77787334c15730e5c9123f90f33a1914d12' })));
+        return (index.h("div", { key: 'b7fb7fcf90475d33930f27895a565ef588bf4e6f', class: "seki-sheet-footer", part: "footer" }, index.h("slot", { key: '89fc76ca642736afd2c614a2cf924c2017f0bb47' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sheet-header.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSheetHeader = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: '8792fcbb571404574ee5e7f016482b8fdb02edb2', class: "seki-sheet-header", part: "header" }, index.h("slot", { key: 'd151a643e10d99bca1029414b78ba260931d28fa' })));
+        return (index.h("div", { key: '6876a4ebeb5ad508f94a02dfd05e1cef1892013b', class: "seki-sheet-header", part: "header" }, index.h("slot", { key: '3e2019eb8835587cb9aebfd06ad0fb9e20f9bde7' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sheet-title.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSheetTitle = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("h2", { key: 'fa86c77c1e03fd9ab3f974347072def9827d2fa3', class: "seki-sheet-title", part: "title" }, index.h("slot", { key: '367a5f16a209b6fd0f3dc71f6b7be6bd1ed07573' })));
+        return (index.h("h2", { key: 'd0cdb3c0743914e4501aeb2b396b75800a183eed', class: "seki-sheet-title", part: "title" }, index.h("slot", { key: '3d978b2c5a42a971aae11ba31cf6c3b8ed452fe8' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sheet-trigger.cjs.entry.js

@@ -20,7 +20,7 @@ const SekiSheetTrigger = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: '994e3c0c66b00e3957dd5590c5a66639d1aff515', class: "seki-sheet-trigger", part: "trigger", onClick: this.handleClick }, index.h("slot", { key: '167575e4915968c6c45efe1a248a27b121c7937d' })));
+        return (index.h("div", { key: '0139f6ffe5f5039c1c098f194048254ee3cc8c2b', class: "seki-sheet-trigger", part: "trigger", onClick: this.handleClick }, index.h("slot", { key: 'dd86e3fdd694b556e2112d76279036d8d4252c4c' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sheet.cjs.entry.js

@@ -58,10 +58,10 @@ const SekiSheet = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: '614727058a67df99cd883d34eea0fc10c89e07a6', class: {
+        return (index.h("div", { key: 'bba151ac6fe32ddaa36a6d60b3ebb45209786362', class: {
                 'seki-sheet': true,
                 'seki-sheet--open': this.isOpen,
-            }, part: "sheet" }, index.h("slot", { key: '8d921a4be67d5ba1f9c27c56b913c46a611e1f76' }), this.isOpen && (index.h("div", { key: '2ef22f47303aaf10bc632db09dbf7d27380ab69c', class: "seki-sheet-overlay", part: "overlay", onClick: () => this.close() }))));
+            }, part: "sheet" }, index.h("slot", { key: '6e28341b810135c669581f010e5c3c6d8d276232' }), this.isOpen && (index.h("div", { key: 'a8382da9411b2b7e1929b938287a28b06628cc46', class: "seki-sheet-overlay", part: "overlay", onClick: () => this.close() }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-content.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSidebarContent = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: 'efb6267ec6d84337046779af5c1750f939dddb70', class: "sidebar-content" }, index.h("slot", { key: '4d2b422428b2616e6c144dc628f15fd70f1122b9' })));
+        return (index.h("div", { key: '4737da0a0a4d547b659e9b160b07c2923cc1e3e0', class: "sidebar-content" }, index.h("slot", { key: '90ec37f12264da090fe9ace989dae3c402521e28' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-footer.cjs.entry.js

@@ -30,7 +30,7 @@ const SekiSidebarFooter = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h(index.Host, { key: '5aa96420d96f1b83b57199a65c7bdd42c3df5211', "data-icon-mode": this._isIconMode ? 'true' : 'false' }, index.h("div", { key: 'd29f73d957757e1e0737dc3cbb7e540ab97e083b', class: { 'sidebar-footer': true, 'sidebar-footer--icon-mode': this._isIconMode } }, index.h("slot", { key: '6538184599c0bfeda91dc324ca9a2655dce0b5ea' }))));
+        return (index.h(index.Host, { key: '1152c6a4fa0594df739634a51897d2883d30377f', "data-icon-mode": this._isIconMode ? 'true' : 'false' }, index.h("div", { key: 'ec7d23a6d84fcaa3ccbda15ce237eb76e54ae48d', class: { 'sidebar-footer': true, 'sidebar-footer--icon-mode': this._isIconMode } }, index.h("slot", { key: 'bb8181e7b3c865bc599d9eb6dc480e484e250a39' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-group-action.cjs.entry.js

@@ -20,7 +20,7 @@ const SekiSidebarGroupAction = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h(index.Host, { key: 'a6a84f2617364ca6c7f422010f8834506289bff3' }, index.h("button", { key: 'fe83283065195ad8bd76a5a4360c3d744812672f', class: "sidebar-group-action", type: "button", disabled: this.disabled, "aria-label": this.ariaLabel }, index.h("slot", { key: 'af5206dbafaba73927305d054737b8b9cc3eb446' }))));
+        return (index.h(index.Host, { key: 'dd28ffe5695923ac553db63ce9fd916911294a9b' }, index.h("button", { key: '6bc353a3635240cfb30118e6fbbcd66896ff3e9f', class: "sidebar-group-action", type: "button", disabled: this.disabled, "aria-label": this.ariaLabel }, index.h("slot", { key: '9f917fd544e68ce996283893a8b056467a16c153' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-group-content.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSidebarGroupContent = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: '0b54d0090e51db825125ba86c21be82c08e5f74a', class: "sidebar-group-content" }, index.h("slot", { key: '23e35cfef208e22808272cf0cf2d55392cae873a' })));
+        return (index.h("div", { key: 'ad67fd3d5a4d329c748aada24f1e4f3b034ea900', class: "sidebar-group-content" }, index.h("slot", { key: 'f15f2b6f4f43b44869cfcb7d3bae08ada6089d2b' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-group-label.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSidebarGroupLabel = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: 'a3f5d1d810c990c84570abb1131ec7d7ab7ae7bf', class: "sidebar-group-label" }, index.h("slot", { key: '3d494ea1b43a7ab858e2cd1a99d8ecae3379855d' })));
+        return (index.h("div", { key: 'b4a500dc386a3333272a90ab43ace88ba8176fe2', class: "sidebar-group-label" }, index.h("slot", { key: 'ae0568dcb2cba975c086408e2ea3cd3ed8815c22' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-group.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSidebarGroup = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: '57ee8c7f266be7817ef0c2c08d00a8804a73052b', class: "sidebar-group" }, this.label && (index.h("seki-sidebar-group-label", { key: 'c2f47870898d7c1c256e20a08142660c2af5039d' }, this.label)), index.h("div", { key: '36b8f12110274b6df9a13214e12296e4e9c06fb3', class: "sidebar-group-content" }, index.h("slot", { key: 'b827f8839760b048df21bff413e30114e6234e8f' }))));
+        return (index.h("div", { key: '1d6a7c3473f7af44bd1af50b62ae089d7fc35c81', class: "sidebar-group" }, this.label && (index.h("seki-sidebar-group-label", { key: '42883a80189fb71391d35c24f303687b9efb7887' }, this.label)), index.h("div", { key: '429b4273b9511d07e55c34d5118d299c05bf0d0b', class: "sidebar-group-content" }, index.h("slot", { key: 'cef4eb3f9946caac5c3daae5d824a243d98d887c' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-header.cjs.entry.js

@@ -30,7 +30,7 @@ const SekiSidebarHeader = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h(index.Host, { key: '0f4ec9ec27ba10ab22d2aa80adab6f396d4c371d', "data-icon-mode": this._isIconMode ? 'true' : 'false' }, index.h("div", { key: '045caea28040bca8270e39ddcb46911e3aba0b4a', class: { 'sidebar-header': true, 'sidebar-header--icon-mode': this._isIconMode } }, index.h("slot", { key: '62f68e1a0a2dfae1d15586ae88ee3ba69482936d' }))));
+        return (index.h(index.Host, { key: 'f9fb878683bbbfae9545a60e489600cab7cd43de', "data-icon-mode": this._isIconMode ? 'true' : 'false' }, index.h("div", { key: '183ee2acb6d6eb84f07f926e29b206f41bbc351d', class: { 'sidebar-header': true, 'sidebar-header--icon-mode': this._isIconMode } }, index.h("slot", { key: '4bb0f792eb9b6e3e76284a4e42282eacc400ad95' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-inset.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSidebarInset = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: 'e6a4bd76f1f368ea260bdeb82216214f35489d1c', class: "sidebar-inset" }, index.h("slot", { key: 'c47810e0a61e203cb4b67f2e52953c6e90e1872e' })));
+        return (index.h("div", { key: 'd62538c4b0e8288d5fe2298b14033fef14a7422e', class: "sidebar-inset" }, index.h("slot", { key: '22332275106cabf678d852c9f2d68e5dae431fd4' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-menu-action.cjs.entry.js

@@ -20,7 +20,7 @@ const SekiSidebarMenuAction = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("button", { key: '52f62e4805f9cd25af4dfeb71aa39e69222a3c53', class: "sidebar-menu-action", disabled: this.disabled, type: "button", "aria-label": "More options" }, index.h("slot", { key: '3b0a9b8c54b8295ddc0dc661440d37e981ac7e78' })));
+        return (index.h("button", { key: 'a0a0a2b9ef20c017f81e95455fdfc95e3abde327', class: "sidebar-menu-action", disabled: this.disabled, type: "button", "aria-label": "More options" }, index.h("slot", { key: '405909f82702834fa0720dc99bd66d073488bb93' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-menu-badge.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSidebarMenuBadge = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("span", { key: '6ae5c7cfb2b951de023cf1279fa283f4dc22c591', class: "sidebar-menu-badge" }, index.h("slot", { key: '9a64baad72ab4e181519c25f65d2f387cbc705c2' })));
+        return (index.h("span", { key: '9c93081ef049dc7279a9dc30d84bed26eb90ed81', class: "sidebar-menu-badge" }, index.h("slot", { key: '829ff0a30a549d5af22f1fb120724ba439fbb6f8' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-menu-button.cjs.entry.js

@@ -81,7 +81,7 @@ const SekiSidebarMenuButton = class {
                 buttonProps.tabIndex = -1;
             }
         }
-        return (index.h(Tag, Object.assign({ key: '7fbaba520bf2b28e168deb190d9d0bb6abcbffc9' }, buttonProps), index.h("span", { key: 'd2f140cb3e39e3356f0edd15d4f4b6445e711774', class: "sidebar-menu-button-content" }, index.h("slot", { key: 'bb9d89ad6bc654a4ea7c9370b29582489ffdffd9' })), this._isIconMode && this.tooltipText && (index.h("span", { key: '6d2e98119e4f29b72fb995d17a10602b092d7880', class: "sr-only" }, this.tooltipText))));
+        return (index.h(Tag, Object.assign({ key: '179d84c9793283ca3bfb1df829aa50716a17bc01' }, buttonProps), index.h("span", { key: 'db744ac337d23993724b8cffee15ea5cd006ac12', class: "sidebar-menu-button-content" }, index.h("slot", { key: '76ff227ce25de9d09e42f35bb2899e433b65896c' })), this._isIconMode && this.tooltipText && (index.h("span", { key: 'edc0c9f934fc2ad1becb26424e26abffd950978b', class: "sr-only" }, this.tooltipText))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-menu-item.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSidebarMenuItem = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("li", { key: 'fdb8de4eb5aa7b3658957e1a8e27911861efb6a6', class: "sidebar-menu-item", role: "none" }, index.h("slot", { key: 'c698d4bdb297604a9b5961f1c9a77a8f81bef097' })));
+        return (index.h("li", { key: '9d40705651a7a5b0ec08bce35d762009d5e13fe5', class: "sidebar-menu-item", role: "none" }, index.h("slot", { key: 'e60b735684d04569ea8c0c54137e63a50656226f' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-menu-skeleton.cjs.entry.js

@@ -20,7 +20,7 @@ const SekiSidebarMenuSkeleton = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("div", { key: '85a9efb11df2e46c6a60dfeb9edd4a4aa1ef47d6', class: "sidebar-menu-skeleton" }, this.showIcon && index.h("div", { key: '5792eb27ab44821461349beeaa974b17ba33d034', class: "sidebar-menu-skeleton-icon" }), index.h("div", { key: '7dd2be2d6ef9e46960fef8a7973f9df32bd02fec', class: "sidebar-menu-skeleton-text" })));
+        return (index.h("div", { key: '60223e62bc0664334f7c6a053d549fbb815de24c', class: "sidebar-menu-skeleton" }, this.showIcon && index.h("div", { key: 'cc8deccd40d11dbc6ecd293e8f4d60d0e09058dc', class: "sidebar-menu-skeleton-icon" }), index.h("div", { key: '2547f0d62fa2d2c759aa9c8e5e870d870636fd16', class: "sidebar-menu-skeleton-text" })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-menu-sub-button.cjs.entry.js

@@ -24,10 +24,10 @@ const SekiSidebarMenuSubButton = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("button", { key: '569ded092594cfd100d9c2506505649f1235a59e', class: {
+        return (index.h("button", { key: 'dbc73fe2fad907f5ec4d7ee134d28b64ab9eb99b', class: {
                 'sidebar-menu-sub-button': true,
                 'sidebar-menu-sub-button--active': this.active,
-            }, disabled: this.disabled, type: "button", role: "menuitem" }, index.h("slot", { key: '72eebc0d783976bf4b41acb126fcccc4f102ac59' })));
+            }, disabled: this.disabled, type: "button", role: "menuitem" }, index.h("slot", { key: '4876029f6e54515e9ad84f6884c0dc47cdb5af8c' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-menu-sub-item.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSidebarMenuSubItem = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("li", { key: '64d04313ca85f7b3596ccfaa1e4582e5376ee400', class: "sidebar-menu-sub-item", role: "none" }, index.h("slot", { key: '88b826f8fdaf0357bdaf9d3cad064c563f977b9b' })));
+        return (index.h("li", { key: 'e6ca17f7652ffc8d9f8472cd4a6ec7587e37ce45', class: "sidebar-menu-sub-item", role: "none" }, index.h("slot", { key: '3b7d4660c701d6af1435304010422c2d25fbd160' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-menu-sub.cjs.entry.js

@@ -8,7 +8,7 @@ const sekiSidebarMenuSubCss = ":host{--seki-neutral-50:hsl(0, 0%, 98%);--seki-ne
 const SekiSidebarMenuSub = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.openChange = index.createEvent(this, "openChange");
+        this.openChange = index.createEvent(this, "sekiOpenChange");
         /**
          * Whether the submenu is open
          */
@@ -19,6 +19,12 @@ const SekiSidebarMenuSub = class {
             this.open = this._open;
             this.openChange.emit(this._open);
         };
+        this.onTriggerSlotChange = () => {
+            const assigned = this.triggerSlotEl.assignedElements();
+            assigned.forEach((el) => {
+                el.addEventListener('click', this.handleTriggerClick);
+            });
+        };
     }
     componentWillLoad() {
         this._open = this.open;
@@ -27,25 +33,20 @@ const SekiSidebarMenuSub = class {
         this._open = newValue;
     }
     componentDidLoad() {
-        var _a;
+        var _a, _b, _c;
         // Attach click handler to trigger slot
-        const triggerSlot = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot[name="trigger"]');
-        if (triggerSlot) {
-            triggerSlot.addEventListener('slotchange', () => {
-                const assigned = triggerSlot.assignedElements();
-                assigned.forEach((el) => {
-                    el.addEventListener('click', this.handleTriggerClick);
-                });
-            });
-        }
+        this.triggerSlotEl =
+            (_b = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot[name="trigger"]')) !== null && _b !== void 0 ? _b : undefined;
+        (_c = this.triggerSlotEl) === null || _c === void 0 ? void 0 : _c.addEventListener('slotchange', this.onTriggerSlotChange);
     }
     connectedCallback() {
         themeSync.registerThemeSync(this.el);
     }
     disconnectedCallback() {
-        var _a;
+        var _a, _b;
         themeSync.unregisterThemeSync(this.el);
-        const triggerSlot = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot[name="trigger"]');
+        (_a = this.triggerSlotEl) === null || _a === void 0 ? void 0 : _a.removeEventListener('slotchange', this.onTriggerSlotChange);
+        const triggerSlot = (_b = this.el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('slot[name="trigger"]');
         if (triggerSlot) {
             const assigned = triggerSlot.assignedElements();
             assigned.forEach((el) => {
@@ -54,13 +55,13 @@ const SekiSidebarMenuSub = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '44de65088b7a7af24b58834e2f76b682b82f08ef', "data-state": this._open ? 'open' : 'closed' }, index.h("div", { key: 'ff6747399742dd5c19935888439e057fa195be69', class: "sidebar-menu-sub" }, index.h("div", { key: '866de831043299ed1ed6411481435d5df744c5b5', class: "sidebar-menu-sub-trigger" }, index.h("slot", { key: 'fd2baeae92bffd74fa8c98cb8d3f1d04b99958aa', name: "trigger" }), index.h("svg", { key: 'c9e661a93f06d9ee5013eca384c0e0e4e8cb22c8', class: {
+        return (index.h(index.Host, { key: '99cca69767ffac341239b92bb86111aa9913a00b', "data-state": this._open ? 'open' : 'closed' }, index.h("div", { key: '2790d32dd4adc4072a52e987b5a37e25c93b9565', class: "sidebar-menu-sub" }, index.h("div", { key: 'b3176021bcb358b75df5adf6cb4f392c27e4a6be', class: "sidebar-menu-sub-trigger" }, index.h("slot", { key: '37a6f9dedc8e1c1fcdbd986016b8659e413e5690', name: "trigger" }), index.h("svg", { key: 'd07288989cf5a67ea984d07d9e02b87be54eef0b', class: {
                 'sidebar-menu-sub-chevron': true,
                 'sidebar-menu-sub-chevron--open': this._open,
-            }, xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, index.h("path", { key: '6a94bb94f0cb912f534f1d47d25c33bfd4e6127a', d: "m9 18 6-6-6-6" }))), index.h("div", { key: 'da13609b77530ca5489c5e5f140452f2fdbe59cc', class: {
+            }, xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, index.h("path", { key: 'd10b3b8710cb57681b7fd0a6bc4046d1187efc68', d: "m9 18 6-6-6-6" }))), index.h("div", { key: 'd37ea17a3391c0f3ea2168e881a832cfee9624d8', class: {
                 'sidebar-menu-sub-wrapper': true,
                 'sidebar-menu-sub-wrapper--open': this._open,
-            } }, index.h("ul", { key: '5d865c387c6e127975f547cc0f079919c8c015d4', class: "sidebar-menu-sub-content", role: "menu", "aria-hidden": !this._open }, index.h("slot", { key: 'acb7a4bedcb9e925929855551fb3ec5e2e00fceb' }))))));
+            } }, index.h("ul", { key: '4e79718513135e7da7787b1474a977514b447d2f', class: "sidebar-menu-sub-content", role: "menu", "aria-hidden": !this._open }, index.h("slot", { key: 'b9eb1888ecf0a1df66b4880189480dae68b89e96' }))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/seki-sidebar-menu.cjs.entry.js

@@ -16,7 +16,7 @@ const SekiSidebarMenu = class {
         themeSync.unregisterThemeSync(this.el);
     }
     render() {
-        return (index.h("ul", { key: 'fdd6f79f87a529287a5c1a65c70c0a6899129981', class: "sidebar-menu", role: "menu" }, index.h("slot", { key: 'd07341579fbdc482519ea75ffc3305d8295a5dcf' })));
+        return (index.h("ul", { key: 'dda2e45029289d2024c0464e1b2a8303ecfef917', class: "sidebar-menu", role: "menu" }, index.h("slot", { key: 'dc949a20b097e24953da92936478a201b97a53e9' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/seki-sidebar-provider.cjs.entry.js

@@ -11,7 +11,7 @@ const SIDEBAR_MOBILE_BREAKPOINT = 768;
 const SekiSidebarProvider = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.openChange = index.createEvent(this, "openChange");
+        this.openChange = index.createEvent(this, "sekiOpenChange");
         this.sekiSidebarStateChange = index.createEvent(this, "sekiSidebarStateChange");
         /**
          * Default open state
@@ -42,11 +42,11 @@ const SekiSidebarProvider = class {
         };
     }
     componentWillLoad() {
-        // Set up mobile detection
+        // Initial mobile detection (the 'change' listener is wired in
+        // connectedCallback so it survives a disconnect/reconnect cycle).
         if (typeof window !== 'undefined') {
             this.mediaQuery = window.matchMedia(`(max-width: ${SIDEBAR_MOBILE_BREAKPOINT}px)`);
             this._isMobile = this.mediaQuery.matches;
-            this.mediaQuery.addEventListener('change', this.handleMediaChange);
         }
         // Check cookie for persisted state
         if (this.open === undefined) {
@@ -64,6 +64,15 @@ const SekiSidebarProvider = class {
     }
     connectedCallback() {
         themeSync.registerThemeSync(this.el);
+        // Register here (not componentWillLoad) so reconnecting the provider after a
+        // DOM move re-subscribes to viewport changes. componentWillLoad only fires once.
+        if (typeof window !== 'undefined') {
+            if (!this.mediaQuery) {
+                this.mediaQuery = window.matchMedia(`(max-width: ${SIDEBAR_MOBILE_BREAKPOINT}px)`);
+            }
+            this._isMobile = this.mediaQuery.matches;
+            this.mediaQuery.addEventListener('change', this.handleMediaChange);
+        }
     }
     disconnectedCallback() {
         themeSync.unregisterThemeSync(this.el);
@@ -144,7 +153,7 @@ const SekiSidebarProvider = class {
             '--sidebar-width-icon': this.sidebarWidthIcon,
             '--sidebar-width-mobile': this.sidebarWidthMobile,
         };
-        return (index.h(index.Host, { key: '24cbf1ac13e40ff10282a5654b8bbc1f31674b80', "data-state": this._open ? 'open' : 'closed', "data-mobile": this._isMobile ? 'true' : 'false', "data-mobile-open": this._openMobile ? 'true' : 'false', style: style }, index.h("slot", { key: '2915542f994834abe07abc724cbe1d4fd193d6d3' })));
+        return (index.h(index.Host, { key: '3906bd78fefe61bb18d1c2f1e6fd9db4c65185ec', "data-state": this._open ? 'open' : 'closed', "data-mobile": this._isMobile ? 'true' : 'false', "data-mobile-open": this._openMobile ? 'true' : 'false', style: style }, index.h("slot", { key: 'd27384bbfb9863acc478f500f8ee6ac31db9a48b' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {