@sekiui/elements 0.0.80 → 0.0.82

package/dist/collection/components/sheet/seki-sheet.js

@@ -1,4 +1,5 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 /**
  * seki-sheet: Root sheet component (slide-out panel)
  *
@@ -60,11 +61,17 @@ export class SekiSheet {
             this.close();
         }
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("div", { key: '3dd115bb7f8acdb544b80b9fe590c443ce9b64b1', class: {
+        return (h("div", { key: '614727058a67df99cd883d34eea0fc10c89e07a6', class: {
                 'seki-sheet': true,
                 'seki-sheet--open': this.isOpen,
-            }, part: "sheet" }, h("slot", { key: 'a838469c70ff1c66fb058bc4d1b22e8f850d704e' }), this.isOpen && (h("div", { key: '9270232aa2a78ce45e144357dacf11a480208632', class: "seki-sheet-overlay", part: "overlay", onClick: () => this.close() }))));
+            }, part: "sheet" }, h("slot", { key: '8d921a4be67d5ba1f9c27c56b913c46a611e1f76' }), this.isOpen && (h("div", { key: '2ef22f47303aaf10bc632db09dbf7d27380ab69c', class: "seki-sheet-overlay", part: "overlay", onClick: () => this.close() }))));
     }
     static get is() { return "seki-sheet"; }
     static get encapsulation() { return "shadow"; }
@@ -171,6 +178,7 @@ export class SekiSheet {
             }
         };
     }
+    static get elementRef() { return "el"; }
     static get listeners() {
         return [{
                 "name": "triggerClick",

package/dist/collection/components/sidebar/seki-sidebar-content.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarContent {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("div", { key: '3d80353838a30aabaadb62c97856c932cae761ae', class: "sidebar-content" }, h("slot", { key: 'e928f0c52e70f4b0079a843f99d6a74fbe1d60b5' })));
+        return (h("div", { key: 'efb6267ec6d84337046779af5c1750f939dddb70', class: "sidebar-content" }, h("slot", { key: '4d2b422428b2616e6c144dc628f15fd70f1122b9' })));
     }
     static get is() { return "seki-sidebar-content"; }
     static get encapsulation() { return "shadow"; }
@@ -15,4 +22,5 @@ export class SekiSidebarContent {
             "$": ["seki-sidebar-content.css"]
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-footer.js

@@ -1,4 +1,5 @@
 import { h, Host } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarFooter {
     constructor() {
         this._isIconMode = false;
@@ -16,8 +17,14 @@ export class SekiSidebarFooter {
     handleStateChange(event) {
         this._isIconMode = !event.detail.open && !event.detail.isMobile;
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h(Host, { key: 'f077472a6e42974fc0c9271f46f5f1440a1f5983', "data-icon-mode": this._isIconMode ? 'true' : 'false' }, h("div", { key: 'ab09851d3c2fcf159733b18fd7eafb30be79a0f4', class: { 'sidebar-footer': true, 'sidebar-footer--icon-mode': this._isIconMode } }, h("slot", { key: '91042ab89c57f4333764c358d5e8f83455c0e543' }))));
+        return (h(Host, { key: '5aa96420d96f1b83b57199a65c7bdd42c3df5211', "data-icon-mode": this._isIconMode ? 'true' : 'false' }, h("div", { key: 'd29f73d957757e1e0737dc3cbb7e540ab97e083b', class: { 'sidebar-footer': true, 'sidebar-footer--icon-mode': this._isIconMode } }, h("slot", { key: '6538184599c0bfeda91dc324ca9a2655dce0b5ea' }))));
     }
     static get is() { return "seki-sidebar-footer"; }
     static get encapsulation() { return "shadow"; }
@@ -36,6 +43,7 @@ export class SekiSidebarFooter {
             "_isIconMode": {}
         };
     }
+    static get elementRef() { return "el"; }
     static get listeners() {
         return [{
                 "name": "sekiSidebarStateChange",

package/dist/collection/components/sidebar/seki-sidebar-group-action.js

@@ -1,4 +1,5 @@
 import { h, Host } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarGroupAction {
     constructor() {
         /**
@@ -6,8 +7,14 @@ export class SekiSidebarGroupAction {
          */
         this.disabled = false;
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h(Host, { key: '8d1b391b107ff497d6a8fa1aa0286d315789d6c6' }, h("button", { key: 'ca2da85fe2274201d2735e290e51552dce68cfe6', class: "sidebar-group-action", type: "button", disabled: this.disabled, "aria-label": this.ariaLabel }, h("slot", { key: 'dd2bc6e4243049cea0d7afb9a6a94176e72efaa5' }))));
+        return (h(Host, { key: 'a6a84f2617364ca6c7f422010f8834506289bff3' }, h("button", { key: 'fe83283065195ad8bd76a5a4360c3d744812672f', class: "sidebar-group-action", type: "button", disabled: this.disabled, "aria-label": this.ariaLabel }, h("slot", { key: 'af5206dbafaba73927305d054737b8b9cc3eb446' }))));
     }
     static get is() { return "seki-sidebar-group-action"; }
     static get encapsulation() { return "shadow"; }
@@ -64,4 +71,5 @@ export class SekiSidebarGroupAction {
             }
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-group-content.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarGroupContent {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("div", { key: '7e6398b1948ef54dda5037a0bc18067a1d6b85df', class: "sidebar-group-content" }, h("slot", { key: 'a7ff6147f35b9b0f208941c793195e6b4759a378' })));
+        return (h("div", { key: '0b54d0090e51db825125ba86c21be82c08e5f74a', class: "sidebar-group-content" }, h("slot", { key: '23e35cfef208e22808272cf0cf2d55392cae873a' })));
     }
     static get is() { return "seki-sidebar-group-content"; }
     static get encapsulation() { return "shadow"; }
@@ -15,4 +22,5 @@ export class SekiSidebarGroupContent {
             "$": ["seki-sidebar-group.css"]
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-group-label.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarGroupLabel {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("div", { key: 'add11b5b13b0beb33c9602dd1ec6cffab1420907', class: "sidebar-group-label" }, h("slot", { key: '75123826715e42a3b98173a900b7cfadd7b2a8bf' })));
+        return (h("div", { key: 'a3f5d1d810c990c84570abb1131ec7d7ab7ae7bf', class: "sidebar-group-label" }, h("slot", { key: '3d494ea1b43a7ab858e2cd1a99d8ecae3379855d' })));
     }
     static get is() { return "seki-sidebar-group-label"; }
     static get encapsulation() { return "shadow"; }
@@ -15,4 +22,5 @@ export class SekiSidebarGroupLabel {
             "$": ["seki-sidebar-group.css"]
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-group.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarGroup {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("div", { key: '64a50d59b94f36be568f4a10c6cfcb24bb22cef6', class: "sidebar-group" }, this.label && (h("seki-sidebar-group-label", { key: '4d92c781e4d1b775485ae4fdea724aabb0dc089d' }, this.label)), h("div", { key: '89b5247654fd6f72e6de4399ea1e893e7fa9d462', class: "sidebar-group-content" }, h("slot", { key: 'b76f5aeea6a5e90dff6ff4897230a082dab51da4' }))));
+        return (h("div", { key: '57ee8c7f266be7817ef0c2c08d00a8804a73052b', class: "sidebar-group" }, this.label && (h("seki-sidebar-group-label", { key: 'c2f47870898d7c1c256e20a08142660c2af5039d' }, this.label)), h("div", { key: '36b8f12110274b6df9a13214e12296e4e9c06fb3', class: "sidebar-group-content" }, h("slot", { key: 'b827f8839760b048df21bff413e30114e6234e8f' }))));
     }
     static get is() { return "seki-sidebar-group"; }
     static get encapsulation() { return "shadow"; }
@@ -38,4 +45,5 @@ export class SekiSidebarGroup {
             }
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-header.js

@@ -1,4 +1,5 @@
 import { h, Host } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarHeader {
     constructor() {
         this._isIconMode = false;
@@ -16,8 +17,14 @@ export class SekiSidebarHeader {
     handleStateChange(event) {
         this._isIconMode = !event.detail.open && !event.detail.isMobile;
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h(Host, { key: '4ce2fab104d6d883e3be4cc0785ff4b0fcb64d4f', "data-icon-mode": this._isIconMode ? 'true' : 'false' }, h("div", { key: '2ae4abd611478cacc60324a1690912b3f54d2b3a', class: { 'sidebar-header': true, 'sidebar-header--icon-mode': this._isIconMode } }, h("slot", { key: 'f79d9ee9353debd733cb9134afd675d5e09d52a3' }))));
+        return (h(Host, { key: '0f4ec9ec27ba10ab22d2aa80adab6f396d4c371d', "data-icon-mode": this._isIconMode ? 'true' : 'false' }, h("div", { key: '045caea28040bca8270e39ddcb46911e3aba0b4a', class: { 'sidebar-header': true, 'sidebar-header--icon-mode': this._isIconMode } }, h("slot", { key: '62f68e1a0a2dfae1d15586ae88ee3ba69482936d' }))));
     }
     static get is() { return "seki-sidebar-header"; }
     static get encapsulation() { return "shadow"; }
@@ -36,6 +43,7 @@ export class SekiSidebarHeader {
             "_isIconMode": {}
         };
     }
+    static get elementRef() { return "el"; }
     static get listeners() {
         return [{
                 "name": "sekiSidebarStateChange",

package/dist/collection/components/sidebar/seki-sidebar-inset.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarInset {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("div", { key: 'e83043a03b6e7bf84a673ae3ce0259ba1e96ecc0', class: "sidebar-inset" }, h("slot", { key: '0fffd4947aaf282ceb9535ce56d51dec7f734e19' })));
+        return (h("div", { key: 'e6a4bd76f1f368ea260bdeb82216214f35489d1c', class: "sidebar-inset" }, h("slot", { key: 'c47810e0a61e203cb4b67f2e52953c6e90e1872e' })));
     }
     static get is() { return "seki-sidebar-inset"; }
     static get encapsulation() { return "shadow"; }
@@ -15,4 +22,5 @@ export class SekiSidebarInset {
             "$": ["seki-sidebar.css"]
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-menu-action.js

@@ -1,4 +1,5 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarMenuAction {
     constructor() {
         /**
@@ -6,8 +7,14 @@ export class SekiSidebarMenuAction {
          */
         this.disabled = false;
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("button", { key: 'c4848d22b7c96c25f048f7aac81276dd5cb431e7', class: "sidebar-menu-action", disabled: this.disabled, type: "button", "aria-label": "More options" }, h("slot", { key: '8adfc3d2c42dbe44fe07d35cfad605d0ac1d7706' })));
+        return (h("button", { key: '52f62e4805f9cd25af4dfeb71aa39e69222a3c53', class: "sidebar-menu-action", disabled: this.disabled, type: "button", "aria-label": "More options" }, h("slot", { key: '3b0a9b8c54b8295ddc0dc661440d37e981ac7e78' })));
     }
     static get is() { return "seki-sidebar-menu-action"; }
     static get encapsulation() { return "shadow"; }
@@ -45,4 +52,5 @@ export class SekiSidebarMenuAction {
             }
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-menu-badge.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarMenuBadge {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("span", { key: 'dd6da1fcf361d743a11c7301ad7c300f8d026e4e', class: "sidebar-menu-badge" }, h("slot", { key: '578cd8cfe99c4169d10ad367c505c196d0ae59e4' })));
+        return (h("span", { key: '6ae5c7cfb2b951de023cf1279fa283f4dc22c591', class: "sidebar-menu-badge" }, h("slot", { key: '9a64baad72ab4e181519c25f65d2f387cbc705c2' })));
     }
     static get is() { return "seki-sidebar-menu-badge"; }
     static get encapsulation() { return "shadow"; }
@@ -15,4 +22,5 @@ export class SekiSidebarMenuBadge {
             "$": ["seki-sidebar-menu.css"]
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-menu-button.js

@@ -1,4 +1,5 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarMenuButton {
     constructor() {
         /**
@@ -37,6 +38,12 @@ export class SekiSidebarMenuButton {
         // Icon mode is when sidebar is closed on desktop
         this._isIconMode = !event.detail.open && !event.detail.isMobile;
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
         const hasHref = this.href || this.el.hasAttribute('href');
         const Tag = hasHref ? 'a' : 'button';
@@ -68,7 +75,7 @@ export class SekiSidebarMenuButton {
                 buttonProps.tabIndex = -1;
             }
         }
-        return (h(Tag, Object.assign({ key: '02a8ff58f9075764909668fead3b396fdcadc548' }, buttonProps), h("span", { key: 'b3ce49b75a59f39ed34f747f84cacae42b40e82f', class: "sidebar-menu-button-content" }, h("slot", { key: 'c3fad6159bffbfcb5b4fbc29a4fc641589947477' })), this._isIconMode && this.tooltipText && (h("span", { key: 'b16d7d2d618026822b3c6a02cb4a7022d4bc9035', class: "sr-only" }, this.tooltipText))));
+        return (h(Tag, Object.assign({ key: '7fbaba520bf2b28e168deb190d9d0bb6abcbffc9' }, buttonProps), h("span", { key: 'd2f140cb3e39e3356f0edd15d4f4b6445e711774', class: "sidebar-menu-button-content" }, h("slot", { key: 'bb9d89ad6bc654a4ea7c9370b29582489ffdffd9' })), this._isIconMode && this.tooltipText && (h("span", { key: '6d2e98119e4f29b72fb995d17a10602b092d7880', class: "sr-only" }, this.tooltipText))));
     }
     static get is() { return "seki-sidebar-menu-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/sidebar/seki-sidebar-menu-item.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarMenuItem {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("li", { key: '0bea2d9df36b90fe71a9a4f002531e4204135d44', class: "sidebar-menu-item", role: "none" }, h("slot", { key: '97df612e987a34d24ea9bae26d5eed77417d820f' })));
+        return (h("li", { key: 'fdb8de4eb5aa7b3658957e1a8e27911861efb6a6', class: "sidebar-menu-item", role: "none" }, h("slot", { key: 'c698d4bdb297604a9b5961f1c9a77a8f81bef097' })));
     }
     static get is() { return "seki-sidebar-menu-item"; }
     static get encapsulation() { return "shadow"; }
@@ -15,4 +22,5 @@ export class SekiSidebarMenuItem {
             "$": ["seki-sidebar-menu.css"]
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-menu-skeleton.js

@@ -1,4 +1,5 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarMenuSkeleton {
     constructor() {
         /**
@@ -6,8 +7,14 @@ export class SekiSidebarMenuSkeleton {
          */
         this.showIcon = false;
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("div", { key: '51708748769c1cda5f0c3324fb8308014e55bf8c', class: "sidebar-menu-skeleton" }, this.showIcon && h("div", { key: 'a182d8134c960bb416196e8ec9c890d6e55f6223', class: "sidebar-menu-skeleton-icon" }), h("div", { key: '55fbadd7be8b0470dce9eda76695d4e0b1a55b7e', class: "sidebar-menu-skeleton-text" })));
+        return (h("div", { key: '85a9efb11df2e46c6a60dfeb9edd4a4aa1ef47d6', class: "sidebar-menu-skeleton" }, this.showIcon && h("div", { key: '5792eb27ab44821461349beeaa974b17ba33d034', class: "sidebar-menu-skeleton-icon" }), h("div", { key: '7dd2be2d6ef9e46960fef8a7973f9df32bd02fec', class: "sidebar-menu-skeleton-text" })));
     }
     static get is() { return "seki-sidebar-menu-skeleton"; }
     static get encapsulation() { return "shadow"; }
@@ -45,4 +52,5 @@ export class SekiSidebarMenuSkeleton {
             }
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-menu-sub-button.js

@@ -1,4 +1,5 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarMenuSubButton {
     constructor() {
         /**
@@ -10,11 +11,17 @@ export class SekiSidebarMenuSubButton {
          */
         this.disabled = false;
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("button", { key: 'b3caad25851c0380cff68ff53ddc3b0eba8d9b5e', class: {
+        return (h("button", { key: '569ded092594cfd100d9c2506505649f1235a59e', class: {
                 'sidebar-menu-sub-button': true,
                 'sidebar-menu-sub-button--active': this.active,
-            }, disabled: this.disabled, type: "button", role: "menuitem" }, h("slot", { key: '8a16f6b2ab6682358b324a35361b1edbc9b869cb' })));
+            }, disabled: this.disabled, type: "button", role: "menuitem" }, h("slot", { key: '72eebc0d783976bf4b41acb126fcccc4f102ac59' })));
     }
     static get is() { return "seki-sidebar-menu-sub-button"; }
     static get encapsulation() { return "shadow"; }
@@ -72,4 +79,5 @@ export class SekiSidebarMenuSubButton {
             }
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-menu-sub-item.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarMenuSubItem {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("li", { key: 'da6e3f063785d75d55df4ec3f02c5abd7cc75ce8', class: "sidebar-menu-sub-item", role: "none" }, h("slot", { key: '5eb437e35c51ef3b90d71aed91f1a82d47a5c8ba' })));
+        return (h("li", { key: '64d04313ca85f7b3596ccfaa1e4582e5376ee400', class: "sidebar-menu-sub-item", role: "none" }, h("slot", { key: '88b826f8fdaf0357bdaf9d3cad064c563f977b9b' })));
     }
     static get is() { return "seki-sidebar-menu-sub-item"; }
     static get encapsulation() { return "shadow"; }
@@ -15,4 +22,5 @@ export class SekiSidebarMenuSubItem {
             "$": ["seki-sidebar-menu-sub.css"]
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-menu-sub.js

@@ -1,4 +1,5 @@
 import { h, Host } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarMenuSub {
     constructor() {
         /**
@@ -31,8 +32,12 @@ export class SekiSidebarMenuSub {
             });
         }
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
     disconnectedCallback() {
         var _a;
+        unregisterThemeSync(this.el);
         const triggerSlot = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot[name="trigger"]');
         if (triggerSlot) {
             const assigned = triggerSlot.assignedElements();
@@ -42,13 +47,13 @@ export class SekiSidebarMenuSub {
         }
     }
     render() {
-        return (h(Host, { key: '270a4c6e8476a9c1c632adeadfb7e600cab4f4d1', "data-state": this._open ? 'open' : 'closed' }, h("div", { key: '220e31e48920b6bceafb03189bf7504e57a0afbe', class: "sidebar-menu-sub" }, h("div", { key: '67e75750cd15c30d43ad96d0f824c04d7d240d20', class: "sidebar-menu-sub-trigger" }, h("slot", { key: 'c8ba6e5194b62dd1f3c0df3b0263eec3d43f3d61', name: "trigger" }), h("svg", { key: 'd574446a8d95af718ae61e5c23e9c481d38eff1f', class: {
+        return (h(Host, { key: '44de65088b7a7af24b58834e2f76b682b82f08ef', "data-state": this._open ? 'open' : 'closed' }, h("div", { key: 'ff6747399742dd5c19935888439e057fa195be69', class: "sidebar-menu-sub" }, h("div", { key: '866de831043299ed1ed6411481435d5df744c5b5', class: "sidebar-menu-sub-trigger" }, h("slot", { key: 'fd2baeae92bffd74fa8c98cb8d3f1d04b99958aa', name: "trigger" }), h("svg", { key: 'c9e661a93f06d9ee5013eca384c0e0e4e8cb22c8', 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" }, h("path", { key: '865120802e3ffd8c54625369868578ee5b97489a', d: "m9 18 6-6-6-6" }))), h("div", { key: '31202317c60de9b380602c0eb9430da6a1ecb7ab', 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" }, h("path", { key: '6a94bb94f0cb912f534f1d47d25c33bfd4e6127a', d: "m9 18 6-6-6-6" }))), h("div", { key: 'da13609b77530ca5489c5e5f140452f2fdbe59cc', class: {
                 'sidebar-menu-sub-wrapper': true,
                 'sidebar-menu-sub-wrapper--open': this._open,
-            } }, h("ul", { key: 'd112a372062a9911e7b5790e6ccc0edd55546f61', class: "sidebar-menu-sub-content", role: "menu", "aria-hidden": !this._open }, h("slot", { key: '8e34ed90e44b500287cd2f0dc217ca66eaa9084b' }))))));
+            } }, h("ul", { key: '5d865c387c6e127975f547cc0f079919c8c015d4', class: "sidebar-menu-sub-content", role: "menu", "aria-hidden": !this._open }, h("slot", { key: 'acb7a4bedcb9e925929855551fb3ec5e2e00fceb' }))))));
     }
     static get is() { return "seki-sidebar-menu-sub"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/sidebar/seki-sidebar-menu.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarMenu {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("ul", { key: '0952257762d7200dafe46b138ddecc836e58bf6e', class: "sidebar-menu", role: "menu" }, h("slot", { key: 'ee9977566a7f3e625db19311fd72ae7f4894a1af' })));
+        return (h("ul", { key: 'fdd6f79f87a529287a5c1a65c70c0a6899129981', class: "sidebar-menu", role: "menu" }, h("slot", { key: 'd07341579fbdc482519ea75ffc3305d8295a5dcf' })));
     }
     static get is() { return "seki-sidebar-menu"; }
     static get encapsulation() { return "shadow"; }
@@ -15,4 +22,5 @@ export class SekiSidebarMenu {
             "$": ["seki-sidebar-menu.css"]
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-provider.js

@@ -1,4 +1,5 @@
 import { h, Host } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 const SIDEBAR_COOKIE_NAME = 'sidebar:state';
 const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7; // 7 days
 const SIDEBAR_MOBILE_BREAKPOINT = 768;
@@ -53,7 +54,11 @@ export class SekiSidebarProvider {
             this._open = this.open;
         }
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
     disconnectedCallback() {
+        unregisterThemeSync(this.el);
         if (this.mediaQuery) {
             this.mediaQuery.removeEventListener('change', this.handleMediaChange);
         }
@@ -131,7 +136,7 @@ export class SekiSidebarProvider {
             '--sidebar-width-icon': this.sidebarWidthIcon,
             '--sidebar-width-mobile': this.sidebarWidthMobile,
         };
-        return (h(Host, { key: 'd79545734bb16870384b1478d4f2302ddb9c83de', "data-state": this._open ? 'open' : 'closed', "data-mobile": this._isMobile ? 'true' : 'false', "data-mobile-open": this._openMobile ? 'true' : 'false', style: style }, h("slot", { key: 'bc0c69752dc849c45b7fb90dea988104631e5745' })));
+        return (h(Host, { key: '24cbf1ac13e40ff10282a5654b8bbc1f31674b80', "data-state": this._open ? 'open' : 'closed', "data-mobile": this._isMobile ? 'true' : 'false', "data-mobile-open": this._openMobile ? 'true' : 'false', style: style }, h("slot", { key: '2915542f994834abe07abc724cbe1d4fd193d6d3' })));
     }
     static get is() { return "seki-sidebar-provider"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/sidebar/seki-sidebar-rail.js

@@ -1,4 +1,5 @@
 import { h, Host } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarRail {
     constructor() {
         this.handleClick = async () => {
@@ -8,8 +9,14 @@ export class SekiSidebarRail {
             }
         };
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h(Host, { key: '14562534455b696a935593052ea64e8903e0929e' }, h("button", { key: '8df6770fe2194de8a60899b4ca3b2a243df921d4', class: "sidebar-rail", type: "button", tabIndex: -1, "aria-hidden": "true", onClick: this.handleClick, title: "Toggle sidebar" }, h("slot", { key: '44795ce59ad5452c200721a04a36c50c09755b11' }))));
+        return (h(Host, { key: '904fd7bd24e44263d20ef93a81d8084e111605d8' }, h("button", { key: 'c3866d11c91a4648114bac8029bd6424005a6f2d', class: "sidebar-rail", type: "button", tabIndex: -1, "aria-hidden": "true", onClick: this.handleClick, title: "Toggle sidebar" }, h("slot", { key: '4a760016b67c8ad26b6db4f2dd3e0b89ead72a55' }))));
     }
     static get is() { return "seki-sidebar-rail"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/sidebar/seki-sidebar-separator.js

@@ -1,7 +1,14 @@
 import { h } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarSeparator {
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h("div", { key: 'd30c3d1c8491d86a49b85f6063d911cd43f8ab1c', class: "sidebar-separator", role: "separator" }));
+        return (h("div", { key: '07cacd4242f71700b41544a21f11a2055d422f7d', class: "sidebar-separator", role: "separator" }));
     }
     static get is() { return "seki-sidebar-separator"; }
     static get encapsulation() { return "shadow"; }
@@ -15,4 +22,5 @@ export class SekiSidebarSeparator {
             "$": ["seki-sidebar.css"]
         };
     }
+    static get elementRef() { return "el"; }
 }

package/dist/collection/components/sidebar/seki-sidebar-trigger.js

@@ -1,4 +1,5 @@
 import { h, Host } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebarTrigger {
     constructor() {
         /**
@@ -29,8 +30,14 @@ export class SekiSidebarTrigger {
         this._isOpen = event.detail.isMobile ? event.detail.openMobile : event.detail.open;
         this._isMobile = event.detail.isMobile;
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
-        return (h(Host, { key: 'a0417c0c7a1655219287b62a1ec269d335fb980d' }, h("button", { key: '7a6bc6c5543057e02e09ad1a884cea091fed3ae1', class: "sidebar-trigger", type: "button", disabled: this.disabled, onClick: this.handleClick, "aria-label": this._isOpen ? 'Close sidebar' : 'Open sidebar', "aria-expanded": this._isOpen ? 'true' : 'false', "data-state": this._isOpen ? 'open' : 'closed' }, h("slot", { key: '417e0988bc0311efe0d4af0d2a0827edea841368' }, h("svg", { key: '365b0f69d14d323bb470bebdebb9455547d44e57', 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" }, h("rect", { key: '8deed4f98c0204d0a747fbef9cd0dbf16c17fa5a', width: "18", height: "18", x: "3", y: "3", rx: "2" }), h("path", { key: 'fd51a35b556983180c11022a27219a70ad664974', d: "M9 3v18" }))), h("span", { key: '393f5d121450b1af6426f0ffcdfcfc5a2bdaaf91', class: "sr-only" }, this._isOpen ? 'Close sidebar' : 'Open sidebar'))));
+        return (h(Host, { key: 'ae94307341cfe08efb37c01e65f8e79ad116b9f1' }, h("button", { key: 'dec1f5e89bda9dd7b55865a4ddc359c2f9529e7b', class: "sidebar-trigger", type: "button", disabled: this.disabled, onClick: this.handleClick, "aria-label": this._isOpen ? 'Close sidebar' : 'Open sidebar', "aria-expanded": this._isOpen ? 'true' : 'false', "data-state": this._isOpen ? 'open' : 'closed' }, h("slot", { key: '3daef9f3a2b1f9382f671f57fc696b9ffb9ded4f' }, h("svg", { key: '2643a0ac707e57c7aa4833364aed9ec8f3847028', 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" }, h("rect", { key: 'cc6638a1e6bfcce63275a7a370c37d6df71bcdcb', width: "18", height: "18", x: "3", y: "3", rx: "2" }), h("path", { key: 'ab0125b427918dda94a07da8590254aa2dd357d6', d: "M9 3v18" }))), h("span", { key: '033593c1293c237d3f7369104d7518994f0eecb3', class: "sr-only" }, this._isOpen ? 'Close sidebar' : 'Open sidebar'))));
     }
     static get is() { return "seki-sidebar-trigger"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/sidebar/seki-sidebar.js

@@ -1,4 +1,5 @@
 import { h, Host } from "@stencil/core";
+import { registerThemeSync, unregisterThemeSync } from "../../utils/theme-sync";
 export class SekiSidebar {
     constructor() {
         /**
@@ -41,16 +42,22 @@ export class SekiSidebar {
         this._openMobile = event.detail.openMobile;
         this._isMobile = event.detail.isMobile;
     }
+    connectedCallback() {
+        registerThemeSync(this.el);
+    }
+    disconnectedCallback() {
+        unregisterThemeSync(this.el);
+    }
     render() {
         const isOpen = this._isMobile ? this._openMobile : this._open;
         const isClosed = !isOpen;
         const isIconMode = this.collapsible === 'icon' && isClosed && !this._isMobile;
         const isOffcanvas = this.collapsible === 'offcanvas' && isClosed && !this._isMobile;
         const showMobileSheet = this._isMobile && this._openMobile;
-        return (h(Host, { key: '47d8c9c51c9eb1ce690164b2759dc9730a44a9a0', "data-variant": this.variant, "data-collapsible": this.collapsible, "data-side": this.side, "data-state": isOpen ? 'open' : 'closed', "data-mobile": this._isMobile ? 'true' : 'false', "data-icon-mode": isIconMode ? 'true' : 'false', "data-offcanvas": isOffcanvas ? 'true' : 'false' }, showMobileSheet && (h("div", { key: '6523b42a75a9d79b1ac93751aa8a4a2334c67746', class: "sidebar-overlay", onClick: this.handleOverlayClick, "aria-hidden": "true" })), h("aside", { key: '307271a9db2cb17f3d5387e64caa1bc683b6214e', class: {
+        return (h(Host, { key: '8a3385dba5ef601d39727f2d66755bd38c2ecc62', "data-variant": this.variant, "data-collapsible": this.collapsible, "data-side": this.side, "data-state": isOpen ? 'open' : 'closed', "data-mobile": this._isMobile ? 'true' : 'false', "data-icon-mode": isIconMode ? 'true' : 'false', "data-offcanvas": isOffcanvas ? 'true' : 'false' }, showMobileSheet && (h("div", { key: '5f4842e436a878d00e05affd6aea36d01afafe8a', class: "sidebar-overlay", onClick: this.handleOverlayClick, "aria-hidden": "true" })), h("aside", { key: 'dffdcec958865fdcf5be7d140510801324918c71', class: {
                 'sidebar': true,
                 'sidebar--mobile-sheet': showMobileSheet,
-            }, role: "complementary", "aria-label": "Sidebar" }, h("slot", { key: 'adc989e01ffcc2d5d2d5df25c38a60a18e85c4fd' }))));
+            }, role: "complementary", "aria-label": "Sidebar" }, h("slot", { key: '352f7151b3343b81f8be2cee94e3f612f5e5fb35' }))));
     }
     static get is() { return "seki-sidebar"; }
     static get encapsulation() { return "shadow"; }