le-kit 0.3.4 → 0.4.0

package/dist/collection/components/le-side-panel-toggle/le-side-panel-toggle.js

@@ -0,0 +1,610 @@
+import { Build, h } from "@stencil/core";
+function parseShortcut(input) {
+    if (!input) {
+        return undefined;
+    }
+    const trimmed = input.trim();
+    if (!trimmed) {
+        return undefined;
+    }
+    const parts = trimmed
+        .split('+')
+        .map(p => p.trim())
+        .filter(Boolean);
+    if (parts.length === 0) {
+        return undefined;
+    }
+    const key = parts[parts.length - 1];
+    const mods = parts.slice(0, -1).map(m => m.toLowerCase());
+    const spec = {
+        key: key.toLowerCase(),
+        alt: mods.includes('alt') || mods.includes('option'),
+        ctrl: mods.includes('ctrl') || mods.includes('control'),
+        meta: mods.includes('meta') || mods.includes('cmd') || mods.includes('command'),
+        shift: mods.includes('shift'),
+    };
+    if (mods.includes('mod')) {
+        // mac: Cmd, others: Ctrl
+        const isMac = typeof navigator !== 'undefined' && /mac/i.test(navigator.platform);
+        if (isMac) {
+            spec.meta = true;
+        }
+        else {
+            spec.ctrl = true;
+        }
+    }
+    return spec;
+}
+function isEditableTarget(target) {
+    if (!(target instanceof HTMLElement)) {
+        return false;
+    }
+    const tag = target.tagName.toLowerCase();
+    if (tag === 'input' || tag === 'textarea' || tag === 'select') {
+        return true;
+    }
+    return target.isContentEditable;
+}
+export class LeSidePanelToggle {
+    el;
+    /** Optional id used to target a specific panel. */
+    panelId;
+    /** Action to emit. Default toggles the panel. */
+    action = 'toggle';
+    /** Optional keyboard shortcut like `Mod+B` or `Alt+N`. */
+    shortcut;
+    /** Disables the toggle. */
+    disabled = false;
+    // Pass-through props for le-button
+    mode;
+    variant = 'solid';
+    color = 'primary';
+    size = 'medium';
+    selected = false;
+    fullWidth = false;
+    iconOnly;
+    iconStart;
+    iconEnd;
+    type = 'button';
+    href;
+    target;
+    align = 'center';
+    leSidePanelRequestToggle;
+    shortcutSpec;
+    expanded;
+    buttonEl;
+    forwardedNodes;
+    onShortcutChanged() {
+        this.shortcutSpec = parseShortcut(this.shortcut);
+        this.syncShortcutListener();
+    }
+    connectedCallback() {
+        this.shortcutSpec = parseShortcut(this.shortcut);
+        this.forwardedNodes = Array.from(this.el.childNodes);
+        if (Build.isBrowser) {
+            this.syncShortcutListener();
+            document.addEventListener('leSidePanelOpenChange', this.onPanelStateChange);
+            document.addEventListener('leSidePanelCollapsedChange', this.onPanelStateChange);
+        }
+    }
+    componentDidLoad() {
+        this.syncForwardedNodesIntoButton();
+        this.syncAriaExpanded();
+    }
+    componentDidRender() {
+        this.syncForwardedNodesIntoButton();
+        this.syncAriaExpanded();
+    }
+    disconnectedCallback() {
+        if (Build.isBrowser) {
+            document.removeEventListener('keydown', this.onDocumentKeyDown, true);
+            document.removeEventListener('leSidePanelOpenChange', this.onPanelStateChange);
+            document.removeEventListener('leSidePanelCollapsedChange', this.onPanelStateChange);
+        }
+    }
+    syncShortcutListener() {
+        if (!Build.isBrowser) {
+            return;
+        }
+        if (this.shortcutSpec) {
+            document.addEventListener('keydown', this.onDocumentKeyDown, true);
+        }
+        else {
+            document.removeEventListener('keydown', this.onDocumentKeyDown, true);
+        }
+    }
+    getResolvedPanelId() {
+        if (this.panelId) {
+            return this.panelId;
+        }
+        const closestPanel = this.el?.closest?.('le-side-panel');
+        if (closestPanel?.panelId) {
+            return closestPanel.panelId;
+        }
+        return undefined;
+    }
+    emitRequest() {
+        if (this.disabled) {
+            return;
+        }
+        this.leSidePanelRequestToggle.emit({
+            panelId: this.getResolvedPanelId(),
+            action: this.action,
+        });
+    }
+    onDocumentKeyDown = (ev) => {
+        if (this.disabled) {
+            return;
+        }
+        const spec = this.shortcutSpec;
+        if (!spec) {
+            return;
+        }
+        if (isEditableTarget(ev.target)) {
+            return;
+        }
+        const key = (ev.key || '').toLowerCase();
+        if (key !== spec.key) {
+            return;
+        }
+        if (!!ev.altKey !== spec.alt) {
+            return;
+        }
+        if (!!ev.ctrlKey !== spec.ctrl) {
+            return;
+        }
+        if (!!ev.metaKey !== spec.meta) {
+            return;
+        }
+        if (!!ev.shiftKey !== spec.shift) {
+            return;
+        }
+        ev.preventDefault();
+        this.emitRequest();
+    };
+    onPanelStateChange = (ev) => {
+        const detail = ev.detail || {};
+        const requestedId = this.getResolvedPanelId() || '';
+        const eventId = detail.panelId || '';
+        if (requestedId !== eventId) {
+            return;
+        }
+        if (typeof detail.open === 'boolean') {
+            this.expanded = detail.open;
+            this.syncAriaExpanded();
+        }
+        if (typeof detail.collapsed === 'boolean') {
+            this.expanded = !detail.collapsed;
+            this.syncAriaExpanded();
+        }
+    };
+    syncForwardedNodesIntoButton() {
+        const btn = this.buttonEl;
+        if (!btn || !this.forwardedNodes || this.forwardedNodes.length === 0) {
+            return;
+        }
+        for (const node of this.forwardedNodes) {
+            if (!node) {
+                continue;
+            }
+            if (node.parentNode !== btn) {
+                try {
+                    btn.appendChild(node);
+                }
+                catch {
+                    // ignore
+                }
+            }
+        }
+    }
+    syncAriaExpanded() {
+        const value = typeof this.expanded === 'boolean' ? String(this.expanded) : null;
+        const hostBtn = this.buttonEl;
+        if (!hostBtn) {
+            return;
+        }
+        // Best-effort: set on the actual internal <button>/<a> inside le-button.
+        const inner = hostBtn.shadowRoot?.querySelector?.('[part="button"]') || null;
+        const target = inner || hostBtn;
+        if (value) {
+            target.setAttribute('aria-expanded', value);
+        }
+        else {
+            target.removeAttribute('aria-expanded');
+        }
+    }
+    render() {
+        return (h("le-button", { key: '382be5b4b8c301dc1d5b8c2d8709bd83cfc08409', ref: el => (this.buttonEl = el), mode: this.mode, variant: this.variant, color: this.color, size: this.size, selected: this.selected, fullWidth: this.fullWidth, iconOnly: this.iconOnly, iconStart: this.iconStart, iconEnd: this.iconEnd, disabled: this.disabled, type: this.type, href: this.href, target: this.target, align: this.align, onClick: () => this.emitRequest() }));
+    }
+    static get is() { return "le-side-panel-toggle"; }
+    static get encapsulation() { return "shadow"; }
+    static get properties() {
+        return {
+            "panelId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Optional id used to target a specific panel."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "panel-id"
+            },
+            "action": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "LeSidePanelToggleAction",
+                    "resolved": "\"close\" | \"open\" | \"toggle\"",
+                    "references": {
+                        "LeSidePanelToggleAction": {
+                            "location": "local",
+                            "path": "/home/runner/work/le-kit/le-kit/src/components/le-side-panel-toggle/le-side-panel-toggle.tsx",
+                            "id": "src/components/le-side-panel-toggle/le-side-panel-toggle.tsx::LeSidePanelToggleAction"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Action to emit. Default toggles the panel."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "action",
+                "defaultValue": "'toggle'"
+            },
+            "shortcut": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Optional keyboard shortcut like `Mod+B` or `Alt+N`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "shortcut"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Disables the toggle."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "mode": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "'default' | 'admin'",
+                    "resolved": "\"admin\" | \"default\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "mode"
+            },
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'solid' | 'outlined' | 'clear' | 'system'",
+                    "resolved": "\"clear\" | \"outlined\" | \"solid\" | \"system\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'solid'"
+            },
+            "color": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info'",
+                    "resolved": "\"danger\" | \"info\" | \"primary\" | \"secondary\" | \"success\" | \"warning\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "color",
+                "defaultValue": "'primary'"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'small' | 'medium' | 'large'",
+                    "resolved": "\"large\" | \"medium\" | \"small\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "size",
+                "defaultValue": "'medium'"
+            },
+            "selected": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "selected",
+                "defaultValue": "false"
+            },
+            "fullWidth": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "full-width",
+                "defaultValue": "false"
+            },
+            "iconOnly": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | Node",
+                    "resolved": "Node | string",
+                    "references": {
+                        "Node": {
+                            "location": "global",
+                            "id": "global::Node"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "icon-only"
+            },
+            "iconStart": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | Node",
+                    "resolved": "Node | string",
+                    "references": {
+                        "Node": {
+                            "location": "global",
+                            "id": "global::Node"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "icon-start"
+            },
+            "iconEnd": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | Node",
+                    "resolved": "Node | string",
+                    "references": {
+                        "Node": {
+                            "location": "global",
+                            "id": "global::Node"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "icon-end"
+            },
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'button' | 'submit' | 'reset'",
+                    "resolved": "\"button\" | \"reset\" | \"submit\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "type",
+                "defaultValue": "'button'"
+            },
+            "href": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "href"
+            },
+            "target": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "target"
+            },
+            "align": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'start' | 'center' | 'space-between' | 'end'",
+                    "resolved": "\"center\" | \"end\" | \"space-between\" | \"start\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "align",
+                "defaultValue": "'center'"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "leSidePanelRequestToggle",
+                "name": "leSidePanelRequestToggle",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "LeSidePanelRequestToggleDetail",
+                    "resolved": "{ panelId?: string; action: LeSidePanelToggleAction; }",
+                    "references": {
+                        "LeSidePanelRequestToggleDetail": {
+                            "location": "local",
+                            "path": "/home/runner/work/le-kit/le-kit/src/components/le-side-panel-toggle/le-side-panel-toggle.tsx",
+                            "id": "src/components/le-side-panel-toggle/le-side-panel-toggle.tsx::LeSidePanelRequestToggleDetail"
+                        }
+                    }
+                }
+            }];
+    }
+    static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "shortcut",
+                "methodName": "onShortcutChanged"
+            }];
+    }
+}
+//# sourceMappingURL=le-side-panel-toggle.js.map

package/dist/collection/components/le-side-panel-toggle/le-side-panel-toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"le-side-panel-toggle.js","sourceRoot":"","sources":["../../../src/components/le-side-panel-toggle/le-side-panel-toggle.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Build, Component, Element, Event, EventEmitter, Prop, Watch, h } from '@stencil/core';\n\nexport type LeSidePanelToggleAction = 'toggle' | 'open' | 'close';\n\nexport type LeSidePanelRequestToggleDetail = {\n  panelId?: string;\n  action: LeSidePanelToggleAction;\n};\n\ntype ShortcutSpec = {\n  key: string;\n  alt: boolean;\n  ctrl: boolean;\n  meta: boolean;\n  shift: boolean;\n};\n\nfunction parseShortcut(input?: string): ShortcutSpec | undefined {\n  if (!input) {\n    return undefined;\n  }\n  const trimmed = input.trim();\n  if (!trimmed) {\n    return undefined;\n  }\n\n  const parts = trimmed\n    .split('+')\n    .map(p => p.trim())\n    .filter(Boolean);\n  if (parts.length === 0) {\n    return undefined;\n  }\n\n  const key = parts[parts.length - 1];\n  const mods = parts.slice(0, -1).map(m => m.toLowerCase());\n\n  const spec: ShortcutSpec = {\n    key: key.toLowerCase(),\n    alt: mods.includes('alt') || mods.includes('option'),\n    ctrl: mods.includes('ctrl') || mods.includes('control'),\n    meta: mods.includes('meta') || mods.includes('cmd') || mods.includes('command'),\n    shift: mods.includes('shift'),\n  };\n\n  if (mods.includes('mod')) {\n    // mac: Cmd, others: Ctrl\n    const isMac = typeof navigator !== 'undefined' && /mac/i.test(navigator.platform);\n    if (isMac) {\n      spec.meta = true;\n    } else {\n      spec.ctrl = true;\n    }\n  }\n\n  return spec;\n}\n\nfunction isEditableTarget(target: EventTarget | null): boolean {\n  if (!(target instanceof HTMLElement)) {\n    return false;\n  }\n  const tag = target.tagName.toLowerCase();\n  if (tag === 'input' || tag === 'textarea' || tag === 'select') {\n    return true;\n  }\n  return target.isContentEditable;\n}\n\n@Component({\n  tag: 'le-side-panel-toggle',\n  shadow: true,\n})\nexport class LeSidePanelToggle {\n  @Element() el: HTMLElement;\n\n  /** Optional id used to target a specific panel. */\n  @Prop() panelId?: string;\n\n  /** Action to emit. Default toggles the panel. */\n  @Prop() action: LeSidePanelToggleAction = 'toggle';\n\n  /** Optional keyboard shortcut like `Mod+B` or `Alt+N`. */\n  @Prop() shortcut?: string;\n\n  /** Disables the toggle. */\n  @Prop() disabled: boolean = false;\n\n  // Pass-through props for le-button\n  @Prop({ mutable: true, reflect: true }) mode: 'default' | 'admin';\n  @Prop() variant: 'solid' | 'outlined' | 'clear' | 'system' = 'solid';\n  @Prop() color: 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' = 'primary';\n  @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n  @Prop() selected: boolean = false;\n  @Prop({ reflect: true }) fullWidth: boolean = false;\n  @Prop() iconOnly?: string | Node;\n  @Prop() iconStart?: string | Node;\n  @Prop() iconEnd?: string | Node;\n  @Prop() type: 'button' | 'submit' | 'reset' = 'button';\n  @Prop() href?: string;\n  @Prop() target?: string;\n  @Prop() align: 'start' | 'center' | 'space-between' | 'end' = 'center';\n\n  @Event({\n    eventName: 'leSidePanelRequestToggle',\n    bubbles: true,\n    composed: true,\n  })\n  leSidePanelRequestToggle: EventEmitter<LeSidePanelRequestToggleDetail>;\n\n  private shortcutSpec?: ShortcutSpec;\n  private expanded: boolean | undefined;\n\n  private buttonEl?: HTMLElement;\n  private forwardedNodes?: ChildNode[];\n\n  @Watch('shortcut')\n  protected onShortcutChanged() {\n    this.shortcutSpec = parseShortcut(this.shortcut);\n    this.syncShortcutListener();\n  }\n\n  connectedCallback() {\n    this.shortcutSpec = parseShortcut(this.shortcut);\n    this.forwardedNodes = Array.from(this.el.childNodes);\n\n    if (Build.isBrowser) {\n      this.syncShortcutListener();\n      document.addEventListener('leSidePanelOpenChange', this.onPanelStateChange as any);\n      document.addEventListener('leSidePanelCollapsedChange', this.onPanelStateChange as any);\n    }\n  }\n\n  componentDidLoad() {\n    this.syncForwardedNodesIntoButton();\n    this.syncAriaExpanded();\n  }\n\n  componentDidRender() {\n    this.syncForwardedNodesIntoButton();\n    this.syncAriaExpanded();\n  }\n\n  disconnectedCallback() {\n    if (Build.isBrowser) {\n      document.removeEventListener('keydown', this.onDocumentKeyDown, true);\n      document.removeEventListener('leSidePanelOpenChange', this.onPanelStateChange as any);\n      document.removeEventListener('leSidePanelCollapsedChange', this.onPanelStateChange as any);\n    }\n  }\n\n  private syncShortcutListener() {\n    if (!Build.isBrowser) {\n      return;\n    }\n    if (this.shortcutSpec) {\n      document.addEventListener('keydown', this.onDocumentKeyDown, true);\n    } else {\n      document.removeEventListener('keydown', this.onDocumentKeyDown, true);\n    }\n  }\n\n  private getResolvedPanelId(): string | undefined {\n    if (this.panelId) {\n      return this.panelId;\n    }\n    const closestPanel = this.el?.closest?.('le-side-panel') as any;\n    if (closestPanel?.panelId) {\n      return closestPanel.panelId;\n    }\n    return undefined;\n  }\n\n  private emitRequest() {\n    if (this.disabled) {\n      return;\n    }\n\n    this.leSidePanelRequestToggle.emit({\n      panelId: this.getResolvedPanelId(),\n      action: this.action,\n    });\n  }\n\n  private onDocumentKeyDown = (ev: KeyboardEvent) => {\n    if (this.disabled) {\n      return;\n    }\n    const spec = this.shortcutSpec;\n    if (!spec) {\n      return;\n    }\n\n    if (isEditableTarget(ev.target)) {\n      return;\n    }\n\n    const key = (ev.key || '').toLowerCase();\n    if (key !== spec.key) {\n      return;\n    }\n\n    if (!!ev.altKey !== spec.alt) {\n      return;\n    }\n    if (!!ev.ctrlKey !== spec.ctrl) {\n      return;\n    }\n    if (!!ev.metaKey !== spec.meta) {\n      return;\n    }\n    if (!!ev.shiftKey !== spec.shift) {\n      return;\n    }\n\n    ev.preventDefault();\n    this.emitRequest();\n  };\n\n  private onPanelStateChange = (ev: CustomEvent<any>) => {\n    const detail = ev.detail || {};\n    const requestedId = this.getResolvedPanelId() || '';\n    const eventId = detail.panelId || '';\n\n    if (requestedId !== eventId) {\n      return;\n    }\n\n    if (typeof detail.open === 'boolean') {\n      this.expanded = detail.open;\n      this.syncAriaExpanded();\n    }\n    if (typeof detail.collapsed === 'boolean') {\n      this.expanded = !detail.collapsed;\n      this.syncAriaExpanded();\n    }\n  };\n\n  private syncForwardedNodesIntoButton() {\n    const btn = this.buttonEl as any;\n    if (!btn || !this.forwardedNodes || this.forwardedNodes.length === 0) {\n      return;\n    }\n\n    for (const node of this.forwardedNodes) {\n      if (!node) {\n        continue;\n      }\n      if (node.parentNode !== btn) {\n        try {\n          btn.appendChild(node);\n        } catch {\n          // ignore\n        }\n      }\n    }\n  }\n\n  private syncAriaExpanded() {\n    const value = typeof this.expanded === 'boolean' ? String(this.expanded) : null;\n    const hostBtn = this.buttonEl as any;\n    if (!hostBtn) {\n      return;\n    }\n\n    // Best-effort: set on the actual internal <button>/<a> inside le-button.\n    const inner = (hostBtn.shadowRoot?.querySelector?.('[part=\"button\"]') as HTMLElement) || null;\n    const target = inner || hostBtn;\n    if (value) {\n      target.setAttribute('aria-expanded', value);\n    } else {\n      target.removeAttribute('aria-expanded');\n    }\n  }\n\n  render() {\n    return (\n      <le-button\n        ref={el => (this.buttonEl = el as HTMLElement)}\n        mode={this.mode}\n        variant={this.variant}\n        color={this.color}\n        size={this.size}\n        selected={this.selected}\n        fullWidth={this.fullWidth}\n        iconOnly={this.iconOnly as any}\n        iconStart={this.iconStart as any}\n        iconEnd={this.iconEnd as any}\n        disabled={this.disabled}\n        type={this.type}\n        href={this.href}\n        target={this.target}\n        align={this.align}\n        onClick={() => this.emitRequest()}\n      />\n    );\n  }\n}\n"]}

package/dist/collection/components/le-slot/le-slot.js

@@ -343,7 +343,7 @@ export class LeSlot {
     render() {
         const displayLabel = this.label || this.name;
         // Always render the same structure, CSS handles visibility via .admin-mode class
-        return (h(Host, { key: '02bfcbc32ff96bcbdcb531430283b67a257a8333', class: {
+        return (h(Host, { key: '836c599ceb5767304c414364288a89f302d70fe2', class: {
                 'admin-mode': this.adminMode,
                 'invalid-html': !this.isValidHtml,
             }, role: this.adminMode ? 'region' : undefined, "aria-label": this.adminMode ? `Slot: ${displayLabel}` : undefined, "data-slot-name": this.name, "data-slot-type": this.type, "data-allowed": this.allowedComponents, "data-multiple": this.multiple, "data-required": this.required }, this.adminMode ? (h("div", { class: "le-slot-container" }, h("div", { class: classnames('le-slot-header', {

package/dist/collection/components/le-stack/le-stack.js

@@ -134,7 +134,7 @@ export class LeStack {
         });
         // Slot style for admin mode - make items display in the same direction
         const slotStyle = `display: flex; flex-direction: ${this.getFlexDirection()}; gap: ${this.gap || 'var(--le-space-md)'}; flex-wrap: ${this.wrap ? 'wrap' : 'nowrap'}; justify-content: ${this.getJustifyContent()}; align-items: ${this.getAlignItems()};`;
-        return (h("le-component", { key: 'b9fa5837421caadf0bf79a9303a2b279f9efa92c', component: "le-stack", hostClass: hostClass }, h("div", { key: 'a7d39ec296b741f608832d619639e340c42bc652', class: "stack", part: "stack", style: style }, h("le-slot", { key: 'd0a4643dcb137eefc57629ac78579e51e3530fd1', name: "", description: `Items arranged ${this.direction}ly${this.maxItems ? ` (max ${this.maxItems})` : ''}`, type: "slot", "allowed-components": "le-text,le-box,le-card,le-button,le-stack", slotStyle: slotStyle }, h("slot", { key: '70a847ebeebc868a204b9121f922ad70f34186a4' })))));
+        return (h("le-component", { key: 'b9b70eea315cf0f3bfb21e4895ee55d8ea29e699', component: "le-stack", hostClass: hostClass }, h("div", { key: 'b4f44316ffffb7237743d208fdce5ac0b8641229', class: "stack", part: "stack", style: style }, h("le-slot", { key: 'c7ea0239e08d93f109a4e5a22c0424bd85fec678', name: "", description: `Items arranged ${this.direction}ly${this.maxItems ? ` (max ${this.maxItems})` : ''}`, type: "slot", "allowed-components": "le-text,le-box,le-card,le-button,le-stack", slotStyle: slotStyle }, h("slot", { key: '2dfcdc5bd6219c681245ab0293faa78b51aec0db' })))));
     }
     static get is() { return "le-stack"; }
     static get encapsulation() { return "shadow"; }