@sekiui/elements 0.0.72 → 0.0.78

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

@@ -0,0 +1,177 @@
+import { Host, h } from "@stencil/core";
+/**
+ * seki-item: Composable base item for lists and menus
+ *
+ * @component Item
+ * @slot leading - Leading content (icon, avatar, checkbox)
+ * @slot - Default slot for main content
+ * @slot trailing - Trailing content (badge, icon, shortcut)
+ * @example
+ * <seki-item>
+ *   <span slot="leading">📄</span>
+ *   Document title
+ *   <seki-badge slot="trailing">New</seki-badge>
+ * </seki-item>
+ */
+export class SekiItem {
+    constructor() {
+        /**
+         * Visual variant of the item
+         * @default 'default'
+         */
+        this.variant = 'default';
+        /**
+         * Whether the item is in active/selected state
+         */
+        this.active = false;
+        /**
+         * Whether the item is disabled
+         */
+        this.disabled = false;
+        /**
+         * Whether the item is interactive (clickable/focusable)
+         * @default true
+         */
+        this.interactive = true;
+        this.handleClick = () => {
+            if (!this.disabled && this.interactive) {
+                this.sekiSelect.emit();
+            }
+        };
+        this.handleKeyDown = (event) => {
+            if (!this.disabled && this.interactive && (event.key === 'Enter' || event.key === ' ')) {
+                event.preventDefault();
+                this.sekiSelect.emit();
+            }
+        };
+    }
+    render() {
+        const isInteractive = this.interactive && !this.disabled;
+        return (h(Host, { key: '4d6535794744c36086f3c9242757c61c3c4b758d', class: {
+                'seki-item--active': this.active,
+                'seki-item--disabled': this.disabled,
+                'seki-item--inset': this.variant === 'inset',
+                'seki-item--interactive': isInteractive,
+            } }, h("div", { key: '839ba9c32ee980cbdb919971a833aa83d1162892', class: "seki-item", part: "item", role: isInteractive ? 'option' : undefined, tabindex: isInteractive ? 0 : -1, "aria-selected": this.active ? 'true' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: 'b38c41f70c7e5d8e6b86b85408e9b9f2e5ce7ec2', class: "seki-item__leading", part: "leading" }, h("slot", { key: 'b4330ae0ac48b16c326204116f8f22f8c1763047', name: "leading" })), h("span", { key: 'e7329059ce8a88058b1a26c4b9c65a6ea633cb12', class: "seki-item__content", part: "content" }, h("slot", { key: 'bcc3e6a047247585e40f1aba51429b0eeb4f9b52' })), h("span", { key: '11f2c98572ba112489d5ac7e4955b255e8d5c5ac', class: "seki-item__trailing", part: "trailing" }, h("slot", { key: '3ab27f7f5719e9e87fbcd20095f0ab005c4bf77d', name: "trailing" })))));
+    }
+    static get is() { return "seki-item"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["seki-item.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["seki-item.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'inset'",
+                    "resolved": "\"default\" | \"inset\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "'default'"
+                        }],
+                    "text": "Visual variant of the item"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'default'"
+            },
+            "active": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether the item is in active/selected state"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "active",
+                "defaultValue": "false"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether the item is disabled"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "interactive": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "true"
+                        }],
+                    "text": "Whether the item is interactive (clickable/focusable)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "interactive",
+                "defaultValue": "true"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "sekiSelect",
+                "name": "sekiSelect",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when item is clicked"
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+}

package/dist/collection/components/kbd/seki-kbd.css

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;

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

@@ -7,7 +7,7 @@ export class SekiKbd {
         this.size = 'md';
     }
     render() {
-        return (h("kbd", { key: '4e7d58af5cb59b9a274e48a646bfb1576bad8dde', class: `kbd kbd--${this.size}` }, h("slot", { key: '724b4d0bf5127624e7efb794cb521efce65fe50e' })));
+        return (h("kbd", { key: '4d3c67010114787137fc0a16e1813092a296acaa', class: `kbd kbd--${this.size}` }, h("slot", { key: '991cfce3db378f61a7a41e7e611980d1cf9d273b' })));
     }
     static get is() { return "seki-kbd"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/label/index.js

@@ -0,0 +1 @@
+export { SekiLabel } from './seki-label';

package/dist/collection/components/label/seki-label.css

@@ -0,0 +1,67 @@
+/* Label Component Styles with Design Tokens
+ * Uses typography system for text sizing
+ * Reference: src/styles/typography/tokens.css
+ */
+
+:host {
+  /* Typography tokens */
+  --seki-label-font-size: var(--seki-font-size-sm, 12px);
+  --seki-label-font-weight: var(--seki-font-weight-medium, 500);
+  --seki-label-font-family: var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto);
+  --seki-label-line-height: var(--seki-line-height-tight, 1.25);
+
+  /* Color tokens */
+  --seki-label-color: var(--color-text-primary, #1f2937);
+  --seki-label-muted-color: var(--color-text-secondary, #6b7280);
+  --seki-label-required-color: var(--color-destructive, #ef4444);
+
+  display: inline-block;
+}
+
+/* Dark mode support */
+:host([data-theme='dark']) {
+  --seki-label-color: var(--color-text-primary-dark, #f3f4f6);
+  --seki-label-muted-color: var(--color-text-secondary-dark, #9ca3af);
+}
+
+/* Base label styles */
+.seki-label {
+  display: inline-flex;
+  align-items: center;
+  font-family: var(--seki-label-font-family);
+  font-size: var(--seki-label-font-size);
+  font-weight: var(--seki-label-font-weight);
+  line-height: var(--seki-label-line-height);
+  color: var(--seki-label-color);
+  cursor: default;
+  user-select: none;
+}
+
+/* Disabled state */
+.seki-label--disabled {
+  color: var(--seki-label-muted-color);
+  cursor: not-allowed;
+  opacity: 0.7;
+}
+
+/* Required indicator */
+.seki-label__required {
+  color: var(--seki-label-required-color);
+  font-weight: var(--seki-font-weight-bold, 700);
+  margin-inline-start: var(--seki-spacing-0-5, 0.125rem);
+}
+
+/* Accessibility: High contrast mode support */
+@media (prefers-contrast: more) {
+  .seki-label__required {
+    font-weight: var(--seki-font-weight-bold, 700);
+    text-decoration: underline;
+  }
+}
+
+/* Reduced motion support */
+@media (prefers-reduced-motion: reduce) {
+  .seki-label {
+    transition: none;
+  }
+}

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

@@ -0,0 +1,112 @@
+import { h } from "@stencil/core";
+/**
+ * seki-label: A styled label component for form elements
+ *
+ * @component Label
+ * @example
+ * <seki-label for="email">Email Address</seki-label>
+ * <seki-label required>Username</seki-label>
+ * <seki-label disabled>Disabled Field</seki-label>
+ */
+export class SekiLabel {
+    constructor() {
+        /**
+         * When true, renders a required indicator (*) after the label text.
+         * @default false
+         */
+        this.required = false;
+        /**
+         * When true, applies disabled styling (muted color, not-allowed cursor).
+         * @default false
+         */
+        this.disabled = false;
+    }
+    render() {
+        const labelProps = this.for ? { for: this.for } : {};
+        return (h("label", Object.assign({ key: '0cee40e30af673530b862666524169a136405de0', part: "label" }, labelProps, { class: {
+                'seki-label': true,
+                'seki-label--disabled': !!this.disabled,
+            } }), h("slot", { key: '898c9b2cc21b570625b56f30105758dae80f4d38' }), this.required && h("span", { key: 'f4e19e4b02266b3bd7ea6041ba9331caf5d3c170', class: "seki-label__required" }, " *")));
+    }
+    static get is() { return "seki-label"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["seki-label.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["seki-label.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "for": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The ID of the form element this label is associated with.\nMaps to the `htmlFor` attribute on the inner `<label>` element."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "for"
+            },
+            "required": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "false"
+                        }],
+                    "text": "When true, renders a required indicator (*) after the label text."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "required",
+                "defaultValue": "false"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "false"
+                        }],
+                    "text": "When true, applies disabled styling (muted color, not-allowed cursor)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            }
+        };
+    }
+}

package/dist/collection/components/menubar/seki-menubar-checkbox.css

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;
@@ -760,6 +761,7 @@
 
 :host {
   display: contents;
+  font-family: var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
 }
 
 .menubar-checkbox {

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

@@ -42,10 +42,10 @@ export class SekiMenubarCheckbox {
         this._checked = this.checked;
     }
     render() {
-        return (h(Host, { key: '786f039e08fed20cf13cd38613d9ae0390619179' }, h("div", { key: '551056a52421cf95218501dbf82bf38c88b76082', part: "item", role: "menuitemcheckbox", class: {
+        return (h(Host, { key: '0e8701bc6e89c38f88a4f9b7de7c20e5daeff9c2' }, h("div", { key: '2f63c44662d69cc37f3cb98d812fa83ad3bfd84e', part: "item", role: "menuitemcheckbox", class: {
                 'menubar-checkbox': true,
                 'menubar-checkbox--disabled': this.disabled,
-            }, tabindex: this.disabled ? -1 : 0, "aria-checked": this._checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: '39064961c219f1fccd00bae07a0d15049ed81d20', part: "indicator", class: "menubar-checkbox__indicator" }, this._checked && (h("svg", { key: '44093b4a3d1418bf63aebfe5951cf9ffe8e78ae3', 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: '9f0513c84d923d94125bb1af56cb60cda240e243', points: "20 6 9 17 4 12" })))), h("slot", { key: 'c2840bc94e32b30d81265343ef5fb1215eb5b359' }), this.shortcut && (h("span", { key: '4a550b967e5eab634f1269855042082d142b84f6', part: "shortcut", class: "menubar-checkbox-shortcut" }, this.shortcut)))));
+            }, tabindex: this.disabled ? -1 : 0, "aria-checked": this._checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: '8106989d251091eaa46abd50ec87b549e66be847', part: "indicator", class: "menubar-checkbox__indicator" }, this._checked && (h("svg", { key: '2b5f88fa4a41172f96656b35f8a2a6f7a1973967', 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: '34040296d9fe74338fef916d4d5cfac4277cb6bb', points: "20 6 9 17 4 12" })))), h("slot", { key: '0c587e97082cebf412838ab3dd977da67ecb8d81' }), this.shortcut && (h("span", { key: '84ee8f28681fadef5ac5a78a4fd72882b80970d8', part: "shortcut", class: "menubar-checkbox-shortcut" }, this.shortcut)))));
     }
     static get is() { return "seki-menubar-checkbox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/menubar/seki-menubar-content.css

@@ -373,6 +373,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;

package/dist/collection/components/menubar/seki-menubar-group.css

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;
@@ -760,6 +761,7 @@
 
 :host {
   display: contents;
+  font-family: var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
 }
 
 .menubar-group {

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

@@ -9,7 +9,7 @@ import { h, Host } from "@stencil/core";
  */
 export class SekiMenubarGroup {
     render() {
-        return (h(Host, { key: '6b49d70727e4ba6ffcd83c865cddd835f9c0c196' }, h("div", { key: 'f7deccc69f8d14361b9e8b2f8d6731cbdca0a8b5', part: "group", role: "group", class: "menubar-group" }, this.label && (h("div", { key: '2589b5f9d9f213d2309c209625c91990f590a381', part: "label", class: "menubar-group-label" }, this.label)), h("slot", { key: '91158fadb259a26f5e396ea476fcea0c9b5d0e4b' }))));
+        return (h(Host, { key: '78725cc4e76194d531836da1c49e5e4965c4eb4f' }, h("div", { key: '0b62b1495ee06c3325908175efb16efea70c2095', part: "group", role: "group", class: "menubar-group" }, this.label && (h("div", { key: 'cbf536f245e2303f7af980596b822f60cc7960b8', part: "label", class: "menubar-group-label" }, this.label)), h("slot", { key: 'b61ec915d1c8b5fee6c8252276dfafbb22fdec76' }))));
     }
     static get is() { return "seki-menubar-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/menubar/seki-menubar-item.css

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;
@@ -760,6 +761,7 @@
 
 :host {
   display: contents;
+  font-family: var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
 }
 
 .menubar-item {

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

@@ -39,11 +39,11 @@ export class SekiMenubarItem {
         return menubar ? menubar._menubarContext : null;
     }
     render() {
-        return (h(Host, { key: 'c2ba314f5427915baf84a82557e196e3945e6c5d' }, h("div", { key: 'ea9e048b20ff272e2bc2927a659af5fc2df34390', part: "item", role: "menuitem", class: {
+        return (h(Host, { key: 'b2f9cc3ff646d9780ecdc2bc4b6bbfc82ae5b04e' }, h("div", { key: 'eca654765fefec0226cdc0ef3a2d4752777ea9ee', part: "item", role: "menuitem", class: {
                 'menubar-item': true,
                 'menubar-item--disabled': this.disabled,
                 'menubar-item--inset': this.inset,
-            }, tabindex: this.disabled ? -1 : 0, "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("slot", { key: '8c90bcca090c5e421e9042015afa46322f882fbf' }), this.shortcut && (h("span", { key: '4c89cb51b6a40820ad871c62f68c9209b97214f2', part: "shortcut", class: "menubar-item-shortcut" }, this.shortcut)))));
+            }, tabindex: this.disabled ? -1 : 0, "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("slot", { key: 'ac197d8eed843bd0b50c58907bf5251594b96415' }), this.shortcut && (h("span", { key: 'f6a1e8875c99001e59b24d06529239ec844d5d95', part: "shortcut", class: "menubar-item-shortcut" }, this.shortcut)))));
     }
     static get is() { return "seki-menubar-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;

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

@@ -26,7 +26,7 @@ export class SekiMenubarMenu {
         }
     }
     render() {
-        return (h(Host, { key: '821d60463ecab859e026ddced3f622ce58e867f6' }, h("div", { key: 'da8995267050e6dbecac381887ecd2fa793c575b', part: "menu", class: "menubar-menu" }, h("slot", { key: '4e2855b30b312806abfafe15508db1d6c93cdd27' }))));
+        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.css

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;

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: '41e641b85e8d38c41ac6765fdbcbc6107bbb993c' }, h("div", { key: '05eb1c4b0658d3a9fdc3d66eef34873a0663685e', part: "group", role: "group", class: "menubar-radio-group" }, h("slot", { key: 'd707ca76b04a52dcf7a1f7ccec797896e139ba29' }))));
+        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.css

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;
@@ -760,6 +761,7 @@
 
 :host {
   display: contents;
+  font-family: var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
 }
 
 .menubar-radio {

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

@@ -47,10 +47,10 @@ export class SekiMenubarRadio {
         }
     }
     render() {
-        return (h(Host, { key: '147db478fd7c9b702f87f3c112f953fc761d779e' }, h("div", { key: '1b198eca40757c40409414b683bee29c5b60a9bd', 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: 'bbb6f01c937726520c50ccdab626d5be6abcf77a', part: "indicator", class: "menubar-radio__indicator" }, this._isChecked && (h("svg", { key: '8ce93c6b6a280ef19d94b5a4d74f5a4005805ebe', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor" }, h("circle", { key: 'cdc0f3927d10bf9d0efca11f039fa9f318be0341', cx: "12", cy: "12", r: "4" })))), h("slot", { key: 'b0a2acd57e9a4fe0e834a81b77c439433ba1d080' }))));
+            }, 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.css

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;

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: '07e414e1a381df3188d6357987ff098686ad4e2e' }, h("div", { key: '96896a395c601d0b7dc684681a83fc33b584f5e3', 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.css

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;
@@ -760,6 +761,7 @@
 
 :host {
   display: contents;
+  font-family: var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
 }
 
 .menubar-shortcut {

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: '75770a706f8f8caa6f7acec60a8b85a67b28410c' }, h("span", { key: '462e9cb4b62f5f6409d843f610a9cdc2ec15da4c', part: "shortcut", class: "menubar-shortcut" }, h("slot", { key: '49e53e082f16fae6605a1210914dbe456edb7401' }))));
+        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-content.css

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;

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

@@ -372,6 +372,7 @@
   --seki-font-bold: 700;
 
   /* Line Heights */
+  --seki-leading-none: 1;
   --seki-leading-tight: 1.25;
   --seki-leading-normal: 1.5;
   --seki-leading-relaxed: 1.75;
@@ -760,6 +761,7 @@
 
 :host {
   display: contents;
+  font-family: var(--seki-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
 }
 
 .menubar-sub-trigger {

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

@@ -30,11 +30,11 @@ export class SekiMenubarSubTrigger {
         }
     }
     render() {
-        return (h(Host, { key: '04f65594293dd5eae7fbe93bd93f53b2dd698fdb' }, h("div", { key: '0e3da41693423938c88c4844df668b73af4987f4', 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: 'a845920d783c495f224202c3ee01715fc41c11fa' }), h("svg", { key: '1be9d42aae409cf5ab85df84eff24cf225efe944', 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: 'e639043c9e2045b12d923071a5f6c5bdaf9cdb57', 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"; }