@sekiui/elements 0.0.75 → 0.0.80

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

@@ -26,7 +26,7 @@ export class SekiMenubarMenu {
         }
     }
     render() {
-        return (h(Host, { key: 'af586b2041235d7f678f36a76f129769e5b6fbda' }, h("div", { key: '3b08ec4dfb6fb44a86f8da01aa42c8c625ebc4c1', part: "menu", class: "menubar-menu" }, h("slot", { key: 'd0eb9639e69e83d7d1fd59b81ecfcfabe6627d2e' }))));
+        return (h(Host, { key: '987f390fc17517baa44620f2c1b1c57d2eef5e83' }, h("div", { key: '1f2940d2b9041433c12b4f04d81e016f5ac34929', part: "menu", class: "menubar-menu" }, h("slot", { key: '528316419f524a06916edd68eadf3ba7b22733a8' }))));
     }
     static get is() { return "seki-menubar-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/menubar/seki-menubar-radio-group.js

@@ -31,7 +31,7 @@ export class SekiMenubarRadioGroup {
         this._radioGroupContext.setValue(event.detail);
     }
     render() {
-        return (h(Host, { key: '0b50af19a12ca5f45e57e14343db97524135268c' }, h("div", { key: '31ff8643523b09b87d94c53d45107b365f3d0555', part: "group", role: "group", class: "menubar-radio-group" }, h("slot", { key: 'edd62eca1badaf6ee0675f180f0de8fb95ed2046' }))));
+        return (h(Host, { key: '368ed309fdc79d9810644e6058f05ea11add079b' }, h("div", { key: '5674301216cc4106a77a127c65c02e67996ad9c2', part: "group", role: "group", class: "menubar-radio-group" }, h("slot", { key: 'ac97f64579e22db2cbff0cc63ed434356ee2e090' }))));
     }
     static get is() { return "seki-menubar-radio-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/menubar/seki-menubar-radio.js

@@ -47,10 +47,10 @@ export class SekiMenubarRadio {
         }
     }
     render() {
-        return (h(Host, { key: '83e0653964122b386092d6ab6134bd02e31f2c60' }, h("div", { key: 'a46b0065b406543883ad2afd53527ec1eed1a2ef', part: "item", role: "menuitemradio", class: {
+        return (h(Host, { key: '2bf7c057d1597b33248e066e29c39eb61674c632' }, h("div", { key: 'cbc4a459454a61cca230b89f2e0a877e9cb49c93', part: "item", role: "menuitemradio", class: {
                 'menubar-radio': true,
                 'menubar-radio--disabled': this.disabled,
-            }, tabindex: this.disabled ? -1 : 0, "aria-checked": this._isChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: '73b8bd5aa54a00940e3f986a59f61b6bcec6ccc4', part: "indicator", class: "menubar-radio__indicator" }, this._isChecked && (h("svg", { key: '7fd4f9600fc9d61406d5e8696792d50ecdce90bf', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor" }, h("circle", { key: 'ab0f0a646fdddacbe2470503e3d16ceb6f5d1146', cx: "12", cy: "12", r: "4" })))), h("slot", { key: '4d72d46faa0b9a1d0ef258564181229ea600c734' }))));
+            }, tabindex: this.disabled ? -1 : 0, "aria-checked": this._isChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: 'c0c43951781733e3c2be0197b0eef323822d4c1d', part: "indicator", class: "menubar-radio__indicator" }, this._isChecked && (h("svg", { key: 'b2ce0b97fa18104a4f993d054a780f4115e5bdaf', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor" }, h("circle", { key: '83d4d7c0212e095d2f0b12e0f5d82c0810180a0f', cx: "12", cy: "12", r: "4" })))), h("slot", { key: '71067f8c5307e7e09d6f3afc7b7b1b3b5ac8b5e5' }))));
     }
     static get is() { return "seki-menubar-radio"; }
     static get encapsulation() { return "shadow"; }

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

@@ -6,7 +6,7 @@ import { h, Host } from "@stencil/core";
  */
 export class SekiMenubarSeparator {
     render() {
-        return (h(Host, { key: '1d5d135764872c0da04fdbdc5a70b79f45623db7' }, h("div", { key: 'ed28c9e3d861bec2cf919b2bc8b74da78c517eac', part: "separator", role: "separator", class: "menubar-separator" })));
+        return (h(Host, { key: '6f294ae0cdbf47b556a66afb803e3aa9d68ddc3b' }, h("div", { key: '9dd3885e37d3f1b38c5c11357cb8e27721a5153f', part: "separator", role: "separator", class: "menubar-separator" })));
     }
     static get is() { return "seki-menubar-separator"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/menubar/seki-menubar-shortcut.js

@@ -8,7 +8,7 @@ import { h, Host } from "@stencil/core";
  */
 export class SekiMenubarShortcut {
     render() {
-        return (h(Host, { key: 'd23f57889cd46a9a6db5066a6285356ece8ebb3b' }, h("span", { key: '914f6f4c81a0da51ed8a5f8b25daae9b11213822', part: "shortcut", class: "menubar-shortcut" }, h("slot", { key: 'cebe7e745d35c3376aa00a99af2ca3d708e670fc' }))));
+        return (h(Host, { key: 'c2290a0535664a7806d1338b96fc4aa6974b6b55' }, h("span", { key: '58483850b753a9ae853534e71d2a6704d577c4aa', part: "shortcut", class: "menubar-shortcut" }, h("slot", { key: '8d4fb6dfdb0b5f27ef43e6418c2e6266c6eecda9' }))));
     }
     static get is() { return "seki-menubar-shortcut"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/menubar/seki-menubar-sub-trigger.js

@@ -30,11 +30,11 @@ export class SekiMenubarSubTrigger {
         }
     }
     render() {
-        return (h(Host, { key: 'dcf28f8344c55fd3563226cd0254487f3b64443f' }, h("div", { key: '437d7dbce7ab6b3d40db030117e0bf2b5871bc75', part: "trigger", role: "menuitem", class: {
+        return (h(Host, { key: '9c864ddad897a720027c6652f839db3cc10a56f1' }, h("div", { key: 'faae229a49efcef3d38fe748e3b610c80a426279', part: "trigger", role: "menuitem", class: {
                 'menubar-sub-trigger': true,
                 'menubar-sub-trigger--disabled': this.disabled,
                 'menubar-sub-trigger--inset': this.inset,
-            }, tabindex: this.disabled ? -1 : 0, "aria-haspopup": "menu", "aria-expanded": this._isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, "data-state": this._isOpen ? 'open' : 'closed' }, h("slot", { key: 'e45d5c4f0060bb87427cf567df15b020ad3b1737' }), h("svg", { key: '60e8a90d95b7e1a72da733ce576088e75f06dbf1', part: "chevron", class: "menubar-sub-trigger__chevron", 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("polyline", { key: 'e363f67423caa68ee1e495ec566b46d5894e17d7', points: "9 18 15 12 9 6" })))));
+            }, tabindex: this.disabled ? -1 : 0, "aria-haspopup": "menu", "aria-expanded": this._isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, "data-state": this._isOpen ? 'open' : 'closed' }, h("slot", { key: 'd1edc4057fa09e80c4a5b885c1f64e68449da26e' }), h("svg", { key: '4356fdd74ce60d9bd4f306d41bc675291c62cec2', part: "chevron", class: "menubar-sub-trigger__chevron", 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("polyline", { key: 'ecce7cef2d55a2fc91e326b276358d6266df45bc', points: "9 18 15 12 9 6" })))));
     }
     static get is() { return "seki-menubar-sub-trigger"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/menubar/seki-menubar-sub.js

@@ -103,7 +103,7 @@ export class SekiMenubarSub {
         }
     }
     render() {
-        return (h(Host, { key: '2f889a2588f4dfa96f318bea86a9fbb3fdde3e11', "data-state": this._isOpen ? 'open' : 'closed', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("div", { key: 'e5d94a8d4749d8b37b74675b1d2e52279998aa0a', part: "sub", class: "menubar-sub", style: { position: 'relative' } }, h("slot", { key: '8038e64f5b9456d9868631a017ec389fa8c1be89', name: "trigger" }), h("slot", { key: '45fca1220fa023719b93746d11c6e13b56441b08', name: "content" }))));
+        return (h(Host, { key: '51283d3e1f2d9b9dbd10305380938d1706958032', "data-state": this._isOpen ? 'open' : 'closed', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("div", { key: 'f4dcce62c5449a26148d7d33a4ebef67183479fe', part: "sub", class: "menubar-sub", style: { position: 'relative' } }, h("slot", { key: '7378adf6a49c213ce279c73dd1ead3f08a04edca', name: "trigger" }), h("slot", { key: '442aa4a70139b9a65f96e35de29c5c9e6af829a3', name: "content" }))));
     }
     static get is() { return "seki-menubar-sub"; }
     static get encapsulation() { return "shadow"; }

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

@@ -98,10 +98,10 @@ export class SekiMenubarTrigger {
         }
     }
     render() {
-        return (h(Host, { key: '003319508bafa3e29a23cf80a092c28b606efa8c' }, h("button", { key: '1f05184feb664b7127fbc747a0fb1c01b0ed5ae8', part: "trigger", type: "button", role: "menuitem", class: {
+        return (h(Host, { key: '11d6ac7d5a3c01e9cc12b373a8b1f0a6785a34cf' }, h("button", { key: 'babd7d454c87dad3a9574145f0ec8a7137d35dfc', part: "trigger", type: "button", role: "menuitem", class: {
                 'menubar-trigger': true,
                 'menubar-trigger--disabled': this.disabled,
-            }, tabindex: this.disabled ? -1 : 0, "aria-haspopup": "menu", "aria-expanded": this._isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, "data-state": this._isOpen ? 'open' : 'closed', onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("slot", { key: 'ccbfbd2acbbfaf6cbe91084bc10ef29129c93217' }))));
+            }, tabindex: this.disabled ? -1 : 0, "aria-haspopup": "menu", "aria-expanded": this._isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, "data-state": this._isOpen ? 'open' : 'closed', onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("slot", { key: '74c784f2224e30d6eba8716e760eaa2404cc626d' }))));
     }
     static get is() { return "seki-menubar-trigger"; }
     static get encapsulation() { return "shadow"; }

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

@@ -140,7 +140,7 @@ export class SekiMenubar {
         this.removeClickOutside();
     }
     render() {
-        return (h(Host, { key: 'af0555d49eb9c8e6414fced6c81cbcc6c48b749d' }, h("div", { key: '69401a474d7e813a706f8f5259371f5625114c21', part: "menubar", role: "menubar", class: "menubar" }, h("slot", { key: 'afdb9ed02037a6e16f11824905702b9eecd27178' }))));
+        return (h(Host, { key: '946f76fc634fd6196d87d77599fb761d65577d89' }, h("div", { key: '2e9da2ab35945ef037a40c315d914be4447d68d3', part: "menubar", role: "menubar", class: "menubar" }, h("slot", { key: 'c10530d620561c153400c7fee2066de93d5561f7' }))));
     }
     static get is() { return "seki-menubar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/native-select/seki-native-select.css

@@ -0,0 +1,114 @@
+/* Native Select Component Styles
+ * Styled wrapper around native HTML <select> for better mobile UX.
+ * Uses typography system tokens for consistent text rendering.
+ * Reference: src/styles/typography/tokens.css
+ */
+
+:host {
+  display: inline-block;
+
+  /* Typography tokens */
+  --seki-native-select-font-size: var(--seki-font-size-base, 14px);
+  --seki-native-select-font-weight: var(--seki-font-weight-normal, 400);
+  --seki-native-select-font-family: var(--seki-font-sans, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
+  --seki-native-select-line-height: var(--seki-line-height-tight, 1.25);
+
+  /* Layout tokens */
+  --seki-native-select-height: 2.5rem;
+  --seki-native-select-padding-x: var(--seki-spacing-3, 0.75rem);
+  --seki-native-select-radius: var(--seki-radius-md, 0.375rem);
+
+  /* Color tokens */
+  --seki-native-select-border: var(--seki-input-border, hsl(240 5.9% 90%));
+  --seki-native-select-bg: var(--seki-input-bg, hsl(0 0% 100%));
+  --seki-native-select-color: var(--seki-input-text, hsl(240 10% 3.9%));
+  --seki-native-select-placeholder: var(--seki-input-placeholder, hsl(240 3.8% 46.1%));
+  --seki-native-select-ring: var(--seki-input-ring, hsl(240 5.9% 10%));
+  --seki-native-select-ring-offset: var(--seki-input-ring-offset, 2px);
+  --seki-native-select-disabled-opacity: var(--seki-input-disabled-opacity, 0.5);
+}
+
+/* Dark mode support */
+:host([data-theme='dark']) {
+  --seki-native-select-border: var(--seki-input-border, hsl(240 3.7% 15.9%));
+  --seki-native-select-bg: var(--seki-input-bg, hsl(240 10% 3.9%));
+  --seki-native-select-color: var(--seki-input-text, hsl(0 0% 98%));
+  --seki-native-select-placeholder: var(--seki-input-placeholder, hsl(240 5% 64.9%));
+}
+
+.seki-native-select {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  width: 100%;
+}
+
+.seki-native-select__select {
+  appearance: none;
+  -webkit-appearance: none;
+  width: 100%;
+  height: var(--seki-native-select-height);
+  padding: 0 calc(var(--seki-native-select-padding-x) + 1.5rem) 0 var(--seki-native-select-padding-x);
+  border: 1px solid var(--seki-native-select-border);
+  border-radius: var(--seki-native-select-radius);
+  background-color: var(--seki-native-select-bg);
+  color: var(--seki-native-select-color);
+  font-family: var(--seki-native-select-font-family);
+  font-size: var(--seki-native-select-font-size);
+  font-weight: var(--seki-native-select-font-weight);
+  line-height: var(--seki-native-select-line-height);
+  cursor: pointer;
+  outline: none;
+  transition: border-color 0.15s ease, box-shadow 0.15s ease;
+}
+
+/* Focus state - matches seki-input focus ring */
+.seki-native-select__select:focus-visible {
+  outline: 2px solid var(--seki-native-select-ring);
+  outline-offset: var(--seki-native-select-ring-offset);
+  border-color: var(--seki-native-select-ring);
+}
+
+/* Hover state */
+.seki-native-select__select:hover:not(:disabled) {
+  border-color: var(--seki-native-select-ring);
+}
+
+/* Disabled state */
+.seki-native-select__select:disabled {
+  opacity: var(--seki-native-select-disabled-opacity);
+  cursor: not-allowed;
+}
+
+/* Placeholder option styling */
+.seki-native-select__select option[disabled] {
+  color: var(--seki-native-select-placeholder);
+}
+
+/* Chevron icon */
+.seki-native-select__chevron {
+  position: absolute;
+  right: var(--seki-native-select-padding-x);
+  pointer-events: none;
+  color: var(--seki-native-select-placeholder);
+  flex-shrink: 0;
+}
+
+:host(.seki-native-select--disabled) .seki-native-select__chevron {
+  opacity: var(--seki-native-select-disabled-opacity);
+}
+
+/* High contrast mode support */
+@media (prefers-contrast: more) {
+  .seki-native-select__select:focus-visible {
+    outline: 3px solid;
+    outline-offset: 2px;
+  }
+}
+
+/* Reduced motion support */
+@media (prefers-reduced-motion: reduce) {
+  .seki-native-select__select {
+    transition: none;
+  }
+}

package/dist/collection/components/native-select/seki-native-select.js

@@ -0,0 +1,203 @@
+import { Host, h } from "@stencil/core";
+/**
+ * seki-native-select: Styled native HTML select wrapper
+ *
+ * Uses the browser's native select dropdown for better mobile UX and accessibility.
+ * Unlike seki-select (which uses a custom dropdown), this component wraps a native
+ * `<select>` element with consistent SekiUI styling.
+ *
+ * @component NativeSelect
+ * @slot - Default slot for <option> and <optgroup> elements
+ * @example
+ * <seki-native-select placeholder="Select a fruit">
+ *   <option value="apple">Apple</option>
+ *   <option value="banana">Banana</option>
+ *   <option value="cherry">Cherry</option>
+ * </seki-native-select>
+ */
+export class SekiNativeSelect {
+    constructor() {
+        /** Disable the select */
+        this.disabled = false;
+        /** Mark as required for form validation */
+        this.required = false;
+        this.handleChange = (event) => {
+            const select = event.target;
+            this.value = select.value;
+            this.sekiChange.emit({ value: select.value });
+        };
+    }
+    render() {
+        return (h(Host, { key: '8f1bad88434857a6a0d9e11789a59dc9dc5bd65b', class: { 'seki-native-select--disabled': this.disabled } }, h("div", { key: 'b78c09b9536e42d64ce478276e973e043123fe89', class: "seki-native-select" }, h("select", { key: 'f593959bb9601962e612944c36aeb57abc2fbf7f', class: "seki-native-select__select", name: this.name, disabled: this.disabled, required: this.required, "aria-label": this.ariaLabel, onChange: this.handleChange }, this.placeholder && (h("option", { key: '0785b1ae6dc07faf190644a80b00a55f01921d1b', value: "", disabled: true, selected: !this.value && !this.defaultValue }, this.placeholder)), h("slot", { key: 'bf81ecba782783c4839ab7d3fbceb15b8fa74e1c' })), h("svg", { key: '500a8bd3de14952bded1cb5c7ef8283d9424b6e1', class: "seki-native-select__chevron", 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", "aria-hidden": "true" }, h("path", { key: 'e71d6349f6603e7d7ecdbabe06d507ce00cc9d50', d: "m6 9 6 6 6-6" })))));
+    }
+    static get is() { return "seki-native-select"; }
+    static get encapsulation() { return "scoped"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["seki-native-select.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["seki-native-select.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "value": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Current value of the select"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value"
+            },
+            "defaultValue": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Default value (used when value is not set)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "default-value"
+            },
+            "placeholder": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Placeholder text shown as a disabled first option"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "placeholder"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Disable the select"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "required": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Mark as required for form validation"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "required",
+                "defaultValue": "false"
+            },
+            "name": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Form field name for form submission"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "name"
+            },
+            "ariaLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible label for screen readers"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "aria-label"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "sekiChange",
+                "name": "sekiChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the selected value changes"
+                },
+                "complexType": {
+                    "original": "{ value: string }",
+                    "resolved": "{ value: string; }",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "el"; }
+}

package/dist/collection/components/navigation-menu/seki-navigation-menu-content.js

@@ -193,13 +193,13 @@ export class SekiNavigationMenuContent {
         if (this.layout === 'grid') {
             customStyles['--content-columns'] = String(this.columns);
         }
-        return (h(Host, { key: '498dd8fe8a1ba27188f3a07ee808a0cf2d28fbcc', class: {
+        return (h(Host, { key: '66ff833f203aec61698dd3ea8c215ec21b986bc6', class: {
                 'navigation-menu-content': true,
                 'navigation-menu-content--open': this.isOpen,
                 'navigation-menu-content--mobile': this.isMobile,
                 [`navigation-menu-content--layout-${this.layout}`]: true,
                 [`navigation-menu-content--align-${this.align}`]: true,
-            }, style: customStyles }, h("div", { key: 'ffba9a1ba4f5bf5c6afe19d9431a7f1363571b9c', id: `content-${itemId}`, class: "navigation-menu-content__inner", role: "menu", "aria-labelledby": `trigger-${itemId}` }, h("slot", { key: '384893648470caf617f00544e04bb8530c7cf50e' }))));
+            }, style: customStyles }, h("div", { key: '7cecc1f1d9bf627ae982991722dc977483c39892', id: `content-${itemId}`, class: "navigation-menu-content__inner", role: "menu", "aria-labelledby": `trigger-${itemId}` }, h("slot", { key: 'db6b30eb556ebed0907ead2a3182a9691e8e784f' }))));
     }
     static get is() { return "seki-navigation-menu-content"; }
     static get encapsulation() { return "shadow"; }

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

@@ -86,12 +86,12 @@ export class SekiNavigationMenuItem {
         return this.parentMenu;
     }
     render() {
-        return (h(Host, { key: '1d3fc8fd3b8191e91d64ac15d90d3982bd00b7a9', class: {
+        return (h(Host, { key: '7fefb0c419a0d84ce1c56eb8e9be3ed9df0fa97a', class: {
                 'navigation-menu-item': true,
                 'navigation-menu-item--open': this.isOpen,
                 'navigation-menu-item--mobile': this.isMobile,
                 'navigation-menu-item--mobile-expanded': this.mobileExpanded,
-            }, "data-item-id": this.itemId }, h("li", { key: '3767528f364241090ce705ed57db7d6e63211b35', class: "navigation-menu-item__container", role: "none" }, h("slot", { key: 'ce2daaa3e3ca6e36f6b74aac51f609402baac1ef' }))));
+            }, "data-item-id": this.itemId }, h("li", { key: '5eee0169ffaf8af408abfabab8fa0db20db7d2b9', class: "navigation-menu-item__container", role: "none" }, h("slot", { key: 'fdf76b7494dbc8377540b1407544c8ab99b68ef5' }))));
     }
     static get is() { return "seki-navigation-menu-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/navigation-menu/seki-navigation-menu-link.js

@@ -67,13 +67,13 @@ export class SekiNavigationMenuLink {
     }
     render() {
         const hasDescription = Boolean(this.description);
-        return (h(Host, { key: '455f19822679cb53d91cdaa89db3f15f18f3ca13', class: {
+        return (h(Host, { key: 'ab26e14f38e14d8691840a943eb0dffcd5012258', class: {
                 'navigation-menu-link': true,
                 'navigation-menu-link--active': this.active,
                 'navigation-menu-link--disabled': this.disabled,
                 'navigation-menu-link--in-content': this.isInContent,
                 'navigation-menu-link--with-description': hasDescription,
-            } }, h("a", { key: '56208d5d8cacea4f354a8b73d9cb2a243b864ebf', class: "navigation-menu-link__anchor", href: this.disabled ? undefined : this.href, target: this.target || undefined, rel: this.target === '_blank' ? 'noopener noreferrer' : undefined, role: this.isInContent ? 'menuitem' : undefined, "aria-current": this.active ? 'page' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, tabindex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, hasDescription ? (h("div", { class: "navigation-menu-link__content" }, h("span", { class: "navigation-menu-link__title" }, h("slot", null)), h("span", { class: "navigation-menu-link__description" }, this.description))) : (h("slot", null)))));
+            } }, h("a", { key: '89080bdcab9b2b71ab8f1c7a3658040a484d8d99', class: "navigation-menu-link__anchor", href: this.disabled ? undefined : this.href, target: this.target || undefined, rel: this.target === '_blank' ? 'noopener noreferrer' : undefined, role: this.isInContent ? 'menuitem' : undefined, "aria-current": this.active ? 'page' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, tabindex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, hasDescription ? (h("div", { class: "navigation-menu-link__content" }, h("span", { class: "navigation-menu-link__title" }, h("slot", null)), h("span", { class: "navigation-menu-link__description" }, this.description))) : (h("slot", null)))));
     }
     static get is() { return "seki-navigation-menu-link"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/navigation-menu/seki-navigation-menu-list.js

@@ -96,7 +96,7 @@ export class SekiNavigationMenuList {
         this.focusedIndex = index;
     }
     render() {
-        return (h(Host, { key: '05bf1393f6a694d93d3c10208ed2be76a6c94685' }, h("ul", { key: 'd1c9ba40c90bb2b1c668dd68fa5cc534a61dd186', class: "navigation-menu-list", role: "menubar" }, h("slot", { key: 'd134cc7e5712846c160b9488199b19716fea66d8' }))));
+        return (h(Host, { key: 'fc64604bce44c5a514ba7bf31dcb1c37a54cece9' }, h("ul", { key: '6f0b9bc015d8ff64bdc175624a869e742017f1b4', class: "navigation-menu-list", role: "menubar" }, h("slot", { key: 'be61b54b93c3a61d1ff18fc0010c2e1681ccc480' }))));
     }
     static get is() { return "seki-navigation-menu-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/navigation-menu/seki-navigation-menu-trigger.js

@@ -174,12 +174,12 @@ export class SekiNavigationMenuTrigger {
     }
     render() {
         const itemId = this.getItemId();
-        return (h(Host, { key: '6bf4dceea21f9f07f5b9f98eca9562be098edd9e', class: {
+        return (h(Host, { key: 'c87073cccc2ec87cb72c766e1ff808917318fb2e', class: {
                 'navigation-menu-trigger': true,
                 'navigation-menu-trigger--open': this.isOpen,
                 'navigation-menu-trigger--disabled': this.disabled,
                 'navigation-menu-trigger--mobile': this.isMobile,
-            } }, h("button", { key: '75c011f8deb97c6ced40aaa2e89d8076f931820b', ref: el => (this.buttonRef = el), type: "button", class: "navigation-menu-trigger__button", role: "menuitem", "aria-haspopup": "true", "aria-expanded": String(this.isOpen), "aria-controls": `content-${itemId}`, disabled: this.disabled, tabindex: this.isOpen ? '0' : '-1', onClick: this.handleClick, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onKeyDown: this.handleKeyDown }, h("span", { key: 'a61468ea08940a8c5eec5dabdfbd547af38a71a2', class: "navigation-menu-trigger__label" }, h("slot", { key: '252423c24af2d2cd0bfe71d0a7ccd752abcd7cdd' })), h("svg", { key: '58a9ecaf37968d6dfc3dbc2ebbe2b6c27d9c748b', class: "navigation-menu-trigger__chevron", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: '50658c7c7aabaa07fe87e0ca4cb14c75a0b33327', points: "2 4 6 8 10 4" })))));
+            } }, h("button", { key: 'cc5ef6c4e29a2c8e5e5c75dbac1573a706fb1112', ref: el => (this.buttonRef = el), type: "button", class: "navigation-menu-trigger__button", role: "menuitem", "aria-haspopup": "true", "aria-expanded": String(this.isOpen), "aria-controls": `content-${itemId}`, disabled: this.disabled, tabindex: this.isOpen ? '0' : '-1', onClick: this.handleClick, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onKeyDown: this.handleKeyDown }, h("span", { key: '52e0775682e3b12a18b2985dadc86fffaca6a7f8', class: "navigation-menu-trigger__label" }, h("slot", { key: '34f7ffb02b73dfc72e794a4e7f53001db584b8e6' })), h("svg", { key: '436e45326da389a3d15075db07e39b4ba100723c', class: "navigation-menu-trigger__chevron", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: 'c8fbe13815ccce7debfc79f111bedfa3dc0fa3b8', points: "2 4 6 8 10 4" })))));
     }
     static get is() { return "seki-navigation-menu-trigger"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/navigation-menu/seki-navigation-menu-viewport.js

@@ -138,14 +138,14 @@ export class SekiNavigationMenuViewport {
         return h("slot", null);
     }
     render() {
-        return (h(Host, { key: 'c15f352adc191348b3a1e58c25183f23e3978d65', class: {
+        return (h(Host, { key: '8aae278c53014c06a9f9162116abc53b6b0e624e', class: {
                 'navigation-menu-viewport': true,
                 'navigation-menu-viewport--visible': this.isVisible,
             }, style: {
                 '--indicator-left': `${this.indicatorLeft}px`,
                 '--content-offset': `${this.contentOffset}px`,
                 '--content-height': `${this.contentHeight}px`,
-            } }, h("div", { key: '652f2de3f35eb956f80c8ef513e8ef4234ffff5c', class: "navigation-menu-viewport__indicator" }, h("svg", { key: '4a5c9d457cc497623e92f59c6e99adf6b8f95a1f', width: "20", height: "10", viewBox: "0 0 20 10", fill: "currentColor" }, h("polygon", { key: '33b4d5c0d942d30648cd14834ebb1a105df02ba1', points: "10,0 20,10 0,10" }))), h("div", { key: '99943856d2859ba65c7a5e8f2731d598b3eecf9b', ref: el => (this.contentRef = el), class: "navigation-menu-viewport__content" }, this.renderContent())));
+            } }, h("div", { key: '2ca0f31b1f0fb5149b9c76a828e290af243cffb3', class: "navigation-menu-viewport__indicator" }, h("svg", { key: '77f9881f67462b6a46c2a747bffa0b977d3f1933', width: "20", height: "10", viewBox: "0 0 20 10", fill: "currentColor" }, h("polygon", { key: '5af582fa0d357e121a017d288795fad0cec76725', points: "10,0 20,10 0,10" }))), h("div", { key: 'b7869f693dc107977e377eaf4f20d971b38fe529', ref: el => (this.contentRef = el), class: "navigation-menu-viewport__content" }, this.renderContent())));
     }
     static get is() { return "seki-navigation-menu-viewport"; }
     static get encapsulation() { return "shadow"; }

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

@@ -362,7 +362,7 @@ export class SekiNavigationMenu {
                         },
                         "NavigationMenuContext": {
                             "location": "local",
-                            "path": "/home/rockia/seki-actions-runner/_work/seki-ui/seki-ui/src/components/navigation-menu/seki-navigation-menu.tsx",
+                            "path": "/__w/seki-ui/seki-ui/src/components/navigation-menu/seki-navigation-menu.tsx",
                             "id": "src/components/navigation-menu/seki-navigation-menu.tsx::NavigationMenuContext"
                         }
                     },

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

@@ -6,7 +6,7 @@ import { h } from "@stencil/core";
  */
 export class SekiPaginationContent {
     render() {
-        return (h("ul", { key: '7367f63ec5dc0dcbef0d21ae990264b423358c75', class: "seki-pagination-content", part: "content" }, h("slot", { key: '9bc967c0a37f8df24892467dc5de22970018c595' })));
+        return (h("ul", { key: '4cc959e3fe5cf9b1870a5d78fa98a027b5762c26', class: "seki-pagination-content", part: "content" }, h("slot", { key: 'd5842c876afc4944274a9866cd9d676d7f341363' })));
     }
     static get is() { return "seki-pagination-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-ellipsis.js

@@ -6,7 +6,7 @@ import { h } from "@stencil/core";
  */
 export class SekiPaginationEllipsis {
     render() {
-        return (h("span", { key: '6de041c61d44992a9eeda1c2f38a8d6ddc72fd7a', "aria-hidden": "true", class: "seki-pagination-ellipsis", part: "ellipsis" }, h("svg", { key: '1c06dbfbc940856d153bd6ae0cc3d97f0ec32339', 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", "aria-hidden": "true" }, h("circle", { key: '39cd475be5cf08be415d887439c7fc5f107be963', cx: "12", cy: "12", r: "1" }), h("circle", { key: '175c075dec5028564e2bf352d38efbf16988b3e2', cx: "19", cy: "12", r: "1" }), h("circle", { key: '98a85bdc3329379b32957d9bb5b8b18ef3b61a0b', cx: "5", cy: "12", r: "1" })), h("span", { key: 'c216d37d5afec49d764fc11dbb9c402b0f6b393c', class: "sr-only" }, "More pages")));
+        return (h("span", { key: '46490efca7224ad6012c02a6f8881ae441b6d266', "aria-hidden": "true", class: "seki-pagination-ellipsis", part: "ellipsis" }, h("svg", { key: 'dedb88f2eb424c2080514474dee8017755abd5eb', 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", "aria-hidden": "true" }, h("circle", { key: '5a037c1ca86a9aea3bbaeed5ebd8c533ed6bcd92', cx: "12", cy: "12", r: "1" }), h("circle", { key: 'fde882ffaaac253544293dcc494e8895614e0183', cx: "19", cy: "12", r: "1" }), h("circle", { key: 'ed13773a070b10dd316a8ef6744aed2bf774b4eb', cx: "5", cy: "12", r: "1" })), h("span", { key: 'e68f64f659ff543c97175be8f2727ba9b9cc5370', class: "sr-only" }, "More pages")));
     }
     static get is() { return "seki-pagination-ellipsis"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-item.js

@@ -6,7 +6,7 @@ import { h } from "@stencil/core";
  */
 export class SekiPaginationItem {
     render() {
-        return (h("li", { key: '855e1bded3bd0bc2aa28fb90fa6591f812d029c8', class: "seki-pagination-item", part: "item" }, h("slot", { key: '40d7461faa4439a6cc2ebeab30ed9aca0fe6043f' })));
+        return (h("li", { key: 'c0f0edc8d93ed4342f6d3e899c10f96d724b85ef', class: "seki-pagination-item", part: "item" }, h("slot", { key: 'a6973fc40b6790ccd11cd0b45ae48cff03e3d325' })));
     }
     static get is() { return "seki-pagination-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-link.js

@@ -17,11 +17,11 @@ export class SekiPaginationLink {
     }
     render() {
         const Tag = this.href && !this.disabled ? 'a' : 'span';
-        return (h(Tag, { key: 'a0bf219e9651779ef6621b9c253265bc1134b5d6', href: this.href && !this.disabled ? this.href : undefined, "aria-current": this.active ? 'page' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, class: {
+        return (h(Tag, { key: '8d454a19ea4373fa208e8d2c8dfe62af59f64257', href: this.href && !this.disabled ? this.href : undefined, "aria-current": this.active ? 'page' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, class: {
                 'seki-pagination-link': true,
                 'seki-pagination-link--active': !!this.active,
                 'seki-pagination-link--disabled': !!this.disabled,
-            }, part: "link" }, h("slot", { key: '1f3bc4fa8d160ed36bed8ff7d64c1f25296d88b8' })));
+            }, part: "link" }, h("slot", { key: '2291abe68aa04cbf49cb7624754463d0d0e1a19d' })));
     }
     static get is() { return "seki-pagination-link"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-next.js

@@ -13,11 +13,11 @@ export class SekiPaginationNext {
     }
     render() {
         const Tag = this.href && !this.disabled ? 'a' : 'span';
-        return (h(Tag, { key: 'd1d8a2489b1cd32415b47bef77f4757a813faa99', href: this.href && !this.disabled ? this.href : undefined, "aria-label": "Go to next page", "aria-disabled": this.disabled ? 'true' : undefined, class: {
+        return (h(Tag, { key: '13114af2a724f7fbb8d67dc3882696c7c6103ab0', href: this.href && !this.disabled ? this.href : undefined, "aria-label": "Go to next page", "aria-disabled": this.disabled ? 'true' : undefined, class: {
                 'seki-pagination-link': true,
                 'seki-pagination-nav': true,
                 'seki-pagination-link--disabled': !!this.disabled,
-            }, part: "next" }, h("span", { key: '8995f6c4933d5196c9da291da9d269d6daf900ba' }, "Next"), h("svg", { key: 'b09789a129c385fa5bed45e9a7a78d75fff8fd58', 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", "aria-hidden": "true" }, h("path", { key: 'e86c5dc53bb6550a48bef1210f959bd09968285c', d: "m9 18 6-6-6-6" }))));
+            }, part: "next" }, h("span", { key: '08cc90e1a75637297b73bfcbeb923ae96370a757' }, "Next"), h("svg", { key: 'b4811948c2631d8af500b76eb06b518b0bbfd3cc', 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", "aria-hidden": "true" }, h("path", { key: 'b45f5e476f0c22b7931d4ed31283d03e84be0a77', d: "m9 18 6-6-6-6" }))));
     }
     static get is() { return "seki-pagination-next"; }
     static get encapsulation() { return "shadow"; }