le-kit 0.3.4 → 0.4.0

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

@@ -0,0 +1,9 @@
+import { L as LeSidePanelToggle$1, d as defineCustomElement$1 } from './le-side-panel-toggle2.js';
+
+const LeSidePanelToggle = LeSidePanelToggle$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LeSidePanelToggle, defineCustomElement };
+//# sourceMappingURL=le-side-panel-toggle.js.map
+
+//# sourceMappingURL=le-side-panel-toggle.js.map

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

@@ -0,0 +1 @@
+{"file":"le-side-panel-toggle.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/le-side-panel-toggle2.js

@@ -0,0 +1,311 @@
+import { proxyCustomElement, HTMLElement, createEvent, Build, h, transformTag } from '@stencil/core/internal/client';
+import { d as defineCustomElement$1, a as defineCustomElement$2, b as defineCustomElement$3, c as defineCustomElement$4, e as defineCustomElement$6, f as defineCustomElement$7, g as defineCustomElement$8 } from './le-button2.js';
+import { d as defineCustomElement$5 } from './le-popover2.js';
+
+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;
+}
+const LeSidePanelToggle = /*@__PURE__*/ proxyCustomElement(class LeSidePanelToggle extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.leSidePanelRequestToggle = createEvent(this, "leSidePanelRequestToggle", 7);
+    }
+    get el() { return this; }
+    /** 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 watchers() { return {
+        "shortcut": ["onShortcutChanged"]
+    }; }
+}, [769, "le-side-panel-toggle", {
+        "panelId": [1, "panel-id"],
+        "action": [1],
+        "shortcut": [1],
+        "disabled": [4],
+        "mode": [1537],
+        "variant": [1],
+        "color": [1],
+        "size": [1],
+        "selected": [4],
+        "fullWidth": [516, "full-width"],
+        "iconOnly": [1, "icon-only"],
+        "iconStart": [1, "icon-start"],
+        "iconEnd": [1, "icon-end"],
+        "type": [1],
+        "href": [1],
+        "target": [1],
+        "align": [1]
+    }, undefined, {
+        "shortcut": ["onShortcutChanged"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["le-side-panel-toggle", "le-button", "le-checkbox", "le-component", "le-popover", "le-popup", "le-select", "le-slot", "le-string-input"];
+    components.forEach(tagName => { switch (tagName) {
+        case "le-side-panel-toggle":
+            if (!customElements.get(transformTag(tagName))) {
+                customElements.define(transformTag(tagName), LeSidePanelToggle);
+            }
+            break;
+        case "le-button":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$8();
+            }
+            break;
+        case "le-checkbox":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$7();
+            }
+            break;
+        case "le-component":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$6();
+            }
+            break;
+        case "le-popover":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$5();
+            }
+            break;
+        case "le-popup":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$4();
+            }
+            break;
+        case "le-select":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$3();
+            }
+            break;
+        case "le-slot":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$2();
+            }
+            break;
+        case "le-string-input":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { LeSidePanelToggle as L, defineCustomElement as d };
+//# sourceMappingURL=le-side-panel-toggle2.js.map
+
+//# sourceMappingURL=le-side-panel-toggle2.js.map

package/dist/components/le-side-panel-toggle2.js.map

@@ -0,0 +1 @@
+{"file":"le-side-panel-toggle2.js","mappings":"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","names":["__stencil_proxyCustomElement"],"sources":["src/components/le-side-panel-toggle/le-side-panel-toggle.tsx"],"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"],"version":3}

package/dist/components/le-side-panel.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface LeSidePanel extends Components.LeSidePanel, HTMLElement {}
+export const LeSidePanel: {
+    prototype: LeSidePanel;
+    new (): LeSidePanel;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;