le-kit 0.1.13 → 0.1.15

package/dist/components/le-tabs.js.map

@@ -0,0 +1 @@
+{"file":"le-tabs.js","mappings":"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","names":["LeTabs","__stencil_proxyCustomElement"],"sources":["src/components/le-tabs/le-tabs.css?tag=le-tabs&encapsulation=shadow","src/components/le-tabs/le-tabs.tsx"],"sourcesContent":["/**\n * le-tabs - Default mode styles\n */\n\n:host {\n  display: block;\n  --le-tabs-gap: var(--le-spacing-1);\n  --le-tabs-border-color: var(--le-border-color);\n  --le-tabs-padding-y: var(--le-spacing-2);\n  --le-tabs-padding-x: var(--le-spacing-4);\n  --le-tabs-enclosed-bg: var(--le-color-background-secondary);\n}\n\n.le-tabs {\n  display: flex;\n  flex-direction: column;\n}\n\n.le-tabs.orientation-vertical {\n  flex-direction: row;\n}\n\n/* ============================================\n * TABLIST\n * ============================================ */\n\n.tablist {\n  display: flex;\n  position: relative;\n  border-radius: var(--le-radius-md);\n  gap: var(--le-tabs-gap);\n}\n.tablist.wrap-tabs {\n  flex-wrap: wrap;\n}\n.tablist.overflow-auto {\n  overflow: auto;\n}\n.tablist.overflow-hidden {\n  overflow: hidden;\n}\n.tablist.overflow-visible {\n  overflow: visible;\n}\n.tablist.overflow-scroll {\n  overflow: scroll;\n}\n.tablist:focus {\n  outline: 2px solid var(--le-color-focus);\n  outline-offset: 2px;\n}\n\n.orientation-horizontal .tablist {\n  flex-direction: row;\n  border-bottom: 1px solid var(--le-tabs-border-color);\n}\n\n.orientation-vertical .tablist {\n  flex-direction: column;\n  border-right: 1px solid var(--le-tabs-border-color);\n  min-width: 150px;\n}\n\n.full-width .tablist {\n  width: 100%;\n}\n\n.full-width.orientation-horizontal .tab {\n  flex: 1;\n}\n\n/* ============================================\n * VARIANT: UNDERLINED\n * ============================================ */\n\n.variant-underlined .tablist {\n  padding-inline: 4px;\n}\n\n/* ============================================\n * VARIANT: PILLS\n * ============================================ */\n\n.variant-pills .tablist {\n  border-radius: calc(1.12rem);\n}\n\n\n/* ============================================\n * VARIANT: ENCLOSED\n * ============================================ */\n\n.variant-enclosed .tablist {\n  border: none;\n  gap: 0;\n  background-color: var(--le-tabs-enclosed-bg);\n  border-radius: calc(var(--le-radius-md) + var(--le-spacing-1));\n  padding: var(--le-spacing-1);\n}\n\n/* ============================================\n * TAB ICON\n * ============================================ */\n\n.tab-icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 1em;\n  height: 1em;\n  font-size: 1.1em;\n}\n\n.tab-icon img {\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n/* ============================================\n * PANELS\n * ============================================ */\n\n.panels {\n  flex: 1;\n  min-height: 0;\n}\n\n.panel {\n  padding: var(--le-tabs-panel-padding, var(--le-spacing-4));\n}\n\n.panel[hidden] {\n  display: none;\n}\n\n.orientation-vertical .panels {\n  padding-left: var(--le-spacing-4);\n}\n\n.position-end .panels {\n  order: 1;\n}\n.position-end .tablist {\n  order: 2;\n}\n","import {\n  Component,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  h,\n  Element,\n  Watch,\n  Listen,\n} from '@stencil/core';\nimport { LeOption, LeOptionValue, LeOptionSelectDetail } from '../../types/options';\nimport { classnames } from '../../utils/utils';\n\ninterface TabConfig {\n  label: string;\n  value: string;\n  iconStart?: string;\n  iconEnd?: string;\n  disabled: boolean;\n  panel?: HTMLElement & { setActive: (active: boolean) => Promise<void> };\n}\n\n/**\n * A flexible tabs component for organizing content into tabbed panels.\n *\n * Supports two modes:\n * 1. **Declarative**: Use `<le-tab-panel>` children to define tabs and content\n * 2. **Programmatic**: Use the `tabs` prop with named slots for content\n *\n * Full keyboard navigation and ARIA support included.\n *\n * @slot - Default slot for le-tab-panel children (declarative mode)\n * @slot panel-{value} - Named slots for panel content (programmatic mode)\n *\n * @cssprop --le-tabs-border-color - Border color for tab list\n * @cssprop --le-tabs-gap - Gap between tabs\n * @cssprop --le-tabs-indicator-color - Active tab indicator color\n * @cssprop --le-tabs-padding-x - Horizontal padding for tab buttons\n * @cssprop --le-tabs-padding-y - Vertical padding for tab buttons\n *\n * @csspart tablist - The tab button container (role=\"tablist\")\n * @csspart tab - Individual tab buttons\n * @csspart tab-active - The currently active tab\n * @csspart panels - Container for panel content\n * @csspart panel - Individual panel containers\n *\n * @cmsEditable true\n * @cmsCategory Navigation\n */\n@Component({\n  tag: 'le-tabs',\n  styleUrl: 'le-tabs.css',\n  shadow: true,\n})\nexport class LeTabs {\n  @Element() el: HTMLElement;\n\n  /**\n   * Array of tab options (programmatic mode).\n   * If le-tab-panel children exist, they take precedence.\n   */\n  @Prop() tabs: LeOption[] = [];\n\n  /**\n   * The value of the currently selected tab.\n   * If not provided, defaults to the first tab.\n   */\n  @Prop({ mutable: true }) selected?: LeOptionValue;\n\n  /**\n   * Orientation of the tabs.\n   * @allowedValues horizontal | vertical\n   */\n  @Prop() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n  /**\n   * Position of the tabs relative to the panels.\n   * @allowedValues start | end\n   */\n  @Prop() position: 'start' | 'end' = 'start';\n\n  /**\n   * Tab variant style.\n   * @allowedValues underlined | solid | pills | enclosed | icon-only\n   */\n  @Prop() variant: 'underlined' | 'solid' | 'pills' | 'enclosed' | 'icon-only' = 'underlined';\n\n  /**\n   * Whether tabs should stretch to fill available width.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * Size of the tabs.\n   * @allowedValues sm | md | lg\n   */\n  @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Wrap the tabs if they exceed container width.\n   */\n  @Prop() wrap: boolean = false;\n\n  /**\n   * Scroll behavior for overflowing tabs.\n   * @allowedValues auto | hidden | visible | scroll\n   */\n  @Prop() overflow: 'auto' | 'hidden' | 'visible' | 'scroll' = 'auto';\n\n  /**\n   * Internal tab configurations (built from children or tabs prop)\n   */\n  @State() private tabConfigs: TabConfig[] = [];\n\n  /**\n   * Internal state for focused tab index (for keyboard navigation)\n   */\n  @State() private focusedIndex: number = 0;\n\n  /**\n   * Whether we're using declarative mode (le-tab-panel children)\n   */\n  @State() private isDeclarativeMode: boolean = false;\n\n  /**\n   * Emitted when the selected tab changes.\n   */\n  @Event() leTabChange: EventEmitter<LeOptionSelectDetail>;\n\n  private mutationObserver?: MutationObserver;\n\n  @Watch('selected')\n  selectedChanged(newValue: LeOptionValue) {\n    const index = this.tabConfigs.findIndex(t => t.value === newValue);\n    if (index >= 0) {\n      this.focusedIndex = index;\n    }\n    this.updatePanelStates();\n  }\n\n  @Watch('tabs')\n  tabsChanged() {\n    if (!this.isDeclarativeMode) {\n      this.buildTabConfigs();\n    }\n  }\n\n  @Listen('slotchange')\n  handleSlotChange() {\n    this.buildTabConfigs();\n  }\n\n  componentWillLoad() {\n    this.buildTabConfigs();\n  }\n\n  connectedCallback() {\n    // Watch for dynamic changes to children\n    this.mutationObserver = new MutationObserver(() => {\n      this.buildTabConfigs();\n    });\n    this.mutationObserver.observe(this.el, {\n      attributes: true,\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    this.mutationObserver?.disconnect();\n  }\n\n  private async buildTabConfigs() {\n    // Check for le-tab-panel children\n    const panels = Array.from(this.el.querySelectorAll(':scope > le-tab-panel')) as Array<\n      HTMLElement & {\n        getTabConfig: () => Promise<TabConfig>;\n        setActive: (active: boolean) => Promise<void>;\n      }\n    >;\n\n    if (panels.length > 0) {\n      // Declarative mode - build from children\n      this.isDeclarativeMode = true;\n      const configs: TabConfig[] = [];\n\n      for (const panel of panels) {\n        const config = await panel.getTabConfig();\n        configs.push({ ...config, panel });\n      }\n\n      this.tabConfigs = configs;\n    } else if (this.tabs.length > 0) {\n      // Programmatic mode - use tabs prop\n      this.isDeclarativeMode = false;\n      this.tabConfigs = this.tabs.map(tab => ({\n        label: tab.label,\n        value: (tab.value !== undefined ? tab.value : tab.label) as string,\n        iconStart: tab.iconStart,\n        iconEnd: tab.iconEnd,\n        disabled: tab.disabled ?? false,\n      }));\n    } else {\n      this.tabConfigs = [];\n    }\n\n    // Set default selected\n    if (this.selected === undefined && this.tabConfigs.length > 0) {\n      const firstEnabled = this.tabConfigs.find(t => !t.disabled);\n      if (firstEnabled) {\n        this.selected = firstEnabled.value;\n      }\n    }\n\n    // Initialize focused index\n    if (this.selected !== undefined) {\n      const index = this.tabConfigs.findIndex(t => t.value === this.selected);\n      if (index >= 0) {\n        this.focusedIndex = index;\n      }\n    }\n\n    // Update panel active states\n    this.updatePanelStates();\n  }\n\n  private async updatePanelStates() {\n    if (!this.isDeclarativeMode) return;\n\n    for (const config of this.tabConfigs) {\n      if (config.panel) {\n        const isActive = config.value === this.selected;\n        await config.panel.setActive(isActive);\n      }\n    }\n  }\n\n  private selectTab(config: TabConfig) {\n    if (config.disabled) return;\n\n    this.selected = config.value;\n    this.leTabChange.emit({\n      value: config.value,\n      option: {\n        label: config.label,\n        value: config.value,\n        iconStart: config.iconStart,\n        iconEnd: config.iconEnd,\n        disabled: config.disabled,\n      },\n    });\n  }\n\n  private handleTabClick = (config: TabConfig) => {\n    this.selectTab(config);\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    const { tabConfigs, orientation } = this;\n    const isHorizontal = orientation === 'horizontal';\n\n    let newIndex = this.focusedIndex;\n\n    switch (event.key) {\n      case 'ArrowLeft':\n        if (isHorizontal) {\n          event.preventDefault();\n          newIndex = this.findNextEnabledTab(-1);\n        }\n        break;\n      case 'ArrowRight':\n        if (isHorizontal) {\n          event.preventDefault();\n          newIndex = this.findNextEnabledTab(1);\n        }\n        break;\n      case 'ArrowUp':\n        if (!isHorizontal) {\n          event.preventDefault();\n          newIndex = this.findNextEnabledTab(-1);\n        }\n        break;\n      case 'ArrowDown':\n        if (!isHorizontal) {\n          event.preventDefault();\n          newIndex = this.findNextEnabledTab(1);\n        }\n        break;\n      case 'Home':\n        event.preventDefault();\n        newIndex = this.findFirstEnabledTab();\n        break;\n      case 'End':\n        event.preventDefault();\n        newIndex = this.findLastEnabledTab();\n        break;\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        if (tabConfigs[this.focusedIndex]) {\n          this.selectTab(tabConfigs[this.focusedIndex]);\n        }\n        return;\n      default:\n        return;\n    }\n\n    if (newIndex !== this.focusedIndex) {\n      this.focusedIndex = newIndex;\n      this.focusTab(newIndex);\n      // Auto-select on focus (recommended for tabs)\n      if (tabConfigs[newIndex]) {\n        this.selectTab(tabConfigs[newIndex]);\n      }\n    }\n  };\n\n  private findNextEnabledTab(direction: 1 | -1): number {\n    const { tabConfigs } = this;\n    let index = this.focusedIndex;\n    const length = tabConfigs.length;\n\n    for (let i = 0; i < length; i++) {\n      index = (index + direction + length) % length;\n      if (!tabConfigs[index].disabled) {\n        return index;\n      }\n    }\n    return this.focusedIndex;\n  }\n\n  private findFirstEnabledTab(): number {\n    return this.tabConfigs.findIndex(t => !t.disabled);\n  }\n\n  private findLastEnabledTab(): number {\n    for (let i = this.tabConfigs.length - 1; i >= 0; i--) {\n      if (!this.tabConfigs[i].disabled) return i;\n    }\n    return 0;\n  }\n\n  private focusTab(index: number) {\n    const tablist = this.el.shadowRoot?.querySelector('[role=\"tablist\"]');\n    const tab = tablist?.querySelectorAll('[role=\"tab\"]')[index] as HTMLElement;\n    tab?.focus();\n  }\n\n  render() {\n    const { tabConfigs, selected, orientation, variant, fullWidth, size, isDeclarativeMode } = this;\n\n    const classes = {\n      'le-tabs': true,\n      [`orientation-${orientation}`]: true,\n      [`position-${this.position}`]: true,\n      [`variant-${variant}`]: true,\n      [`size-${size}`]: true,\n      'full-width': fullWidth,\n    };\n\n    const tabPosition =\n      this.orientation === 'vertical'\n        ? this.position\n        : this.position === 'start'\n        ? 'top'\n        : 'bottom';\n\n    return (\n      <le-component component=\"le-tabs\" hostClass={classnames(classes)}>\n        <div class={classes}>\n          <div\n            class={{\n              'tablist': true,\n              'wrap-tabs': this.wrap,\n              [`overflow-${this.overflow}`]: true,\n            }}\n            role=\"tablist\"\n            aria-orientation={orientation}\n            part=\"tablist\"\n            onKeyDown={this.handleKeyDown}\n            tabIndex={0}\n          >\n            {tabConfigs.map(config => {\n              const isSelected = config.value === selected;\n              const tabId = `tab-${config.value}`;\n              const panelId = `panel-${config.value}`;\n\n              return (\n                <le-tab\n                  key={config.value}\n                  id={tabId}\n                  class=\"tab\"\n                  mode=\"default\"\n                  variant={this.variant}\n                  selected={isSelected}\n                  disabled={config.disabled}\n                  size={this.size}\n                  position={tabPosition}\n                  align={this.orientation === 'vertical' ? 'start' : 'center'}\n                  role=\"tab\"\n                  part={isSelected ? 'tab tab-active' : 'tab'}\n                  aria-selected={isSelected ? 'true' : 'false'}\n                  aria-controls={panelId}\n                  aria-disabled={config.disabled ? 'true' : undefined}\n                  focusable={false}\n                  onClick={() => this.handleTabClick(config)}\n                  iconStart={config.iconStart}\n                  iconEnd={config.iconEnd}\n                >\n                  <span class=\"tab-label\">{config.label}</span>\n                </le-tab>\n              );\n            })}\n          </div>\n\n          <div class=\"panels\" part=\"panels\">\n            {isDeclarativeMode ? (\n              // Declarative mode - render slot for le-tab-panel children\n              <le-slot\n                name=\"\"\n                description=\"Tab panels\"\n                type=\"slot\"\n                allowedComponents=\"le-tab-panel\"\n              >\n                <slot></slot>\n              </le-slot>\n            ) : (\n              // Programmatic mode - render named slots\n              tabConfigs.map(config => {\n                const isSelected = config.value === selected;\n                const tabId = `tab-${config.value}`;\n                const panelId = `panel-${config.value}`;\n\n                return (\n                  <div\n                    key={config.value}\n                    id={panelId}\n                    class={{\n                      'panel': true,\n                      'panel-active': isSelected,\n                    }}\n                    role=\"tabpanel\"\n                    part=\"panel\"\n                    aria-labelledby={tabId}\n                    tabIndex={0}\n                    hidden={!isSelected}\n                  >\n                    <slot name={`panel-${config.value}`}></slot>\n                  </div>\n                );\n              })\n            )}\n          </div>\n        </div>\n      </le-component>\n    );\n  }\n}\n"],"version":3}

package/dist/components/le-tag.d.ts

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

package/dist/components/le-tag.js

@@ -0,0 +1,9 @@
+import { L as LeTag$1, d as defineCustomElement$1 } from './le-tag2.js';
+
+const LeTag = LeTag$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LeTag, defineCustomElement };
+//# sourceMappingURL=le-tag.js.map
+
+//# sourceMappingURL=le-tag.js.map

package/dist/components/le-tag.js.map

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

package/dist/components/le-tag2.js

@@ -0,0 +1,130 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$1, a as defineCustomElement$2, b as defineCustomElement$3, c as defineCustomElement$5, e as defineCustomElement$6, f as defineCustomElement$7 } from './le-button2.js';
+import { d as defineCustomElement$4 } from './le-popover2.js';
+
+const leTagCss = ":host{display:inline-flex;--le-tag-font-size:var(--le-font-size-sm);--le-tag-font-weight:var(--le-font-weight-medium);--le-tag-color:var(--le-color-text);--le-tag-bg:var(--le-color-surface-alt);--le-tag-dismiss-size:1.75em}:host([disabled]){opacity:0.5;pointer-events:none}.tag{display:inline-flex;align-items:center;gap:var(--le-tag-gap, 0.375rem);padding:var(--le-tag-padding-y, 0.25rem) var(--le-tag-padding-x, 0.625rem);font-size:var(--le-tag-font-size);font-weight:var(--le-tag-font-weight);line-height:1.4;color:var(--le-tag-color, var(--le-color-text, #1f2937));background:var(--le-tag-bg, var(--le-color-surface-alt, #f3f4f6));border:1px solid var(--le-tag-border-color, transparent);border-radius:var(--le-tag-border-radius, 9999px);white-space:nowrap;user-select:none}:host([size='small']) .tag{--le-tag-font-size:0.75rem;--le-tag-padding-x:0.5rem;--le-tag-padding-y:0.125rem;--le-tag-gap:0.25rem;--le-tag-dismiss-size:1.25em}:host([size='large']) .tag{--le-tag-font-size:1rem;--le-tag-padding-x:0.875rem;--le-tag-padding-y:0.375rem;--le-tag-gap:0.5rem;--le-tag-dismiss-size:2em}:host([variant='primary']) .tag{--le-tag-bg:var(--le-color-primary, #dbeafe);--le-tag-color:var(--le-color-primary-contrast, #1e40af)}:host([variant='success']) .tag{--le-tag-bg:var(--le-color-success, #dcfce7);--le-tag-color:var(--le-color-success-contrast, #166534)}:host([variant='warning']) .tag{--le-tag-bg:var(--le-color-warning-light, #fef3c7);--le-tag-color:var(--le-color-warning-contrast, #92400e)}:host([variant='danger']) .tag{--le-tag-bg:var(--le-color-danger, #fee2e2);--le-tag-color:var(--le-color-danger-contrast, #991b1b)}.tag-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.tag-icon img{width:1em;height:1em;object-fit:contain}.tag-label{display:inline-block}.tag-dismiss{display:inline-flex;align-items:center;justify-content:center;width:var(--le-tag-dismiss-size);height:var(--le-tag-dismiss-size);padding:0;margin-block:calc(var(--le-tag-dismiss-size) * -1);margin-right:calc(var(--le-tag-dismiss-size) / 3 * -1);border:none;background:transparent;color:currentColor;opacity:0.6;cursor:pointer;border-radius:50%;transition:opacity 0.15s ease, background-color 0.15s ease}.tag-dismiss:hover{opacity:1;background:rgba(0, 0, 0, 0.1)}.tag-dismiss:focus-visible{outline:2px solid var(--le-color-primary, #3b82f6);outline-offset:1px}.tag-dismiss svg{width:0.75em;height:0.75em}.tag-dismiss:disabled{cursor:not-allowed}";
+
+const LeTag = /*@__PURE__*/ proxyCustomElement(class LeTag extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.leDismiss = createEvent(this, "leDismiss", 7);
+    }
+    /**
+     * The text label to display in the tag.
+     */
+    label;
+    /**
+     * Mode of the popover should be 'default' for internal use
+     */
+    mode;
+    /**
+     * Icon to display before the label.
+     * Can be an emoji, URL, or icon name.
+     */
+    icon;
+    /**
+     * Whether the tag can be dismissed (shows close button).
+     */
+    dismissible = false;
+    /**
+     * Whether the tag is disabled.
+     */
+    disabled = false;
+    /**
+     * The size of the tag.
+     */
+    size = 'medium';
+    /**
+     * The visual variant of the tag.
+     */
+    variant = 'default';
+    /**
+     * Emitted when the dismiss button is clicked.
+     */
+    leDismiss;
+    handleDismiss = (e) => {
+        e.stopPropagation();
+        if (!this.disabled) {
+            this.leDismiss.emit();
+        }
+    };
+    renderIcon() {
+        if (!this.icon)
+            return null;
+        // Check if it's a URL (starts with http, https, or /)
+        if (this.icon.startsWith('http') || this.icon.startsWith('/')) {
+            return h("img", { class: "tag-icon", src: this.icon, alt: "" });
+        }
+        // Otherwise render as text (emoji or icon font)
+        return h("span", { class: "tag-icon" }, this.icon);
+    }
+    render() {
+        return (h("le-component", { key: 'a9af40ce7f93cf0fd866847b534ec7b387e46630', component: "le-tag" }, h("span", { key: '714d50b01509122992a7687b1df57fed42c7b74d', class: "tag" }, this.renderIcon(), h("span", { key: '0ca3f1427e7900f6a756881467d076df0b85a181', class: "tag-label" }, h("le-slot", { key: 'd2cf2b614a82b63db7fffd82aa4b27dfc4b306b0', name: "", tag: "span", type: "text" }, h("slot", { key: 'bf96f35dfea1258e2b351ac9c527a2ad2da0a28b' }, this.label))), this.dismissible && (h("button", { key: '841019b44d6a403123176840befc0d1111e26412', type: "button", class: "tag-dismiss", onClick: this.handleDismiss, disabled: this.disabled, "aria-label": "Remove" }, h("svg", { key: '3085736bd99aec5f65f6b595e0ada1afe72df81d', viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: 'd4b27569785c37154153294fe00f9d20661741dc', d: "M4 4l8 8M12 4l-8 8" })))))));
+    }
+    static get style() { return leTagCss; }
+}, [769, "le-tag", {
+        "label": [1],
+        "mode": [1537],
+        "icon": [1],
+        "dismissible": [4],
+        "disabled": [516],
+        "size": [513],
+        "variant": [513]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["le-tag", "le-button", "le-checkbox", "le-component", "le-popover", "le-popup", "le-slot", "le-string-input"];
+    components.forEach(tagName => { switch (tagName) {
+        case "le-tag":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, LeTag);
+            }
+            break;
+        case "le-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "le-checkbox":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "le-component":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "le-popover":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "le-popup":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "le-slot":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "le-string-input":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { LeTag as L, defineCustomElement as d };
+//# sourceMappingURL=le-tag2.js.map
+
+//# sourceMappingURL=le-tag2.js.map

package/dist/components/le-tag2.js.map

@@ -0,0 +1 @@
+{"file":"le-tag2.js","mappings":";;;;AAAA,MAAM,QAAQ,GAAG,25EAA25E;;MC8C/5E,KAAK,iBAAAA,kBAAA,CAAA,MAAA,KAAA,SAAA,WAAA,CAAA;;;;;;;;;AAChB;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AACqC,IAAA,IAAI;AAE5C;;;AAGG;AACK,IAAA,IAAI;AAEZ;;AAEG;IACK,WAAW,GAAY,KAAK;AAEpC;;AAEG;IACsB,QAAQ,GAAY,KAAK;AAElD;;AAEG;IACsB,IAAI,GAAiC,QAAQ;AAEtE;;AAEG;IACsB,OAAO,GAA6D,SAAS;AAEtG;;AAEG;AACM,IAAA,SAAS;AAEV,IAAA,aAAa,GAAG,CAAC,CAAa,KAAI;QACxC,CAAC,CAAC,eAAe,EAAE;AACnB,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAClB,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE;;AAEzB,KAAC;IAEO,UAAU,GAAA;QAChB,IAAI,CAAC,IAAI,CAAC,IAAI;AAAE,YAAA,OAAO,IAAI;;AAG3B,QAAA,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE;YAC7D,OAAO,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,UAAU,EAAC,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAC,EAAE,GAAG;;;AAIxD,QAAA,OAAO,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,UAAU,IAAE,IAAI,CAAC,IAAI,CAAQ;;IAGlD,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,SAAS,EAAC,QAAQ,EAAA,EAC9B,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,KAAK,EAAA,EACd,IAAI,CAAC,UAAU,EAAE,EAClB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,WAAW,EAAA,EACrB,CAAS,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,EAAA,EACrC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAO,IAAI,CAAC,KAAK,CAAQ,CACjB,CACL,EACN,IAAI,CAAC,WAAW,KACf,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,aAAa,EAAC,OAAO,EAAE,IAAI,CAAC,aAAa,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,YAAA,EAAa,QAAQ,EAAA,EACjH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAA,cAAA,EAAc,GAAG,EAAA,EACzE,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAC,EAAC,oBAAoB,EAAG,CAAA,CAC3B,CACC,CACV,CACI,CACM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement"],"sources":["src/components/le-tag/le-tag.css?tag=le-tag&encapsulation=shadow","src/components/le-tag/le-tag.tsx"],"sourcesContent":["/**\n * le-tag component styles\n *\n * CSS Custom Properties:\n * --le-tag-font-size\n * --le-tag-font-weight\n * --le-tag-padding-x\n * --le-tag-padding-y\n * --le-tag-border-radius\n * --le-tag-gap\n * --le-tag-bg\n * --le-tag-color\n * --le-tag-border-color\n */\n\n:host {\n  display: inline-flex;\n  --le-tag-font-size: var(--le-font-size-sm);\n  --le-tag-font-weight: var(--le-font-weight-medium);\n  --le-tag-color: var(--le-color-text);\n  --le-tag-bg: var(--le-color-surface-alt);\n  --le-tag-dismiss-size: 1.75em;\n}\n\n:host([disabled]) {\n  opacity: 0.5;\n  pointer-events: none;\n}\n\n.tag {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--le-tag-gap, 0.375rem);\n  padding: var(--le-tag-padding-y, 0.25rem) var(--le-tag-padding-x, 0.625rem);\n  font-size: var(--le-tag-font-size);\n  font-weight: var(--le-tag-font-weight);\n  line-height: 1.4;\n  color: var(--le-tag-color, var(--le-color-text, #1f2937));\n  background: var(--le-tag-bg, var(--le-color-surface-alt, #f3f4f6));\n  border: 1px solid var(--le-tag-border-color, transparent);\n  border-radius: var(--le-tag-border-radius, 9999px);\n  white-space: nowrap;\n  user-select: none;\n}\n\n/* Sizes */\n:host([size='small']) .tag {\n  --le-tag-font-size: 0.75rem;\n  --le-tag-padding-x: 0.5rem;\n  --le-tag-padding-y: 0.125rem;\n  --le-tag-gap: 0.25rem;\n  --le-tag-dismiss-size: 1.25em;\n}\n\n:host([size='large']) .tag {\n  --le-tag-font-size: 1rem;\n  --le-tag-padding-x: 0.875rem;\n  --le-tag-padding-y: 0.375rem;\n  --le-tag-gap: 0.5rem;\n  --le-tag-dismiss-size: 2em;\n}\n\n/* Variants */\n:host([variant='primary']) .tag {\n  --le-tag-bg: var(--le-color-primary, #dbeafe);\n  --le-tag-color: var(--le-color-primary-contrast, #1e40af);\n}\n\n:host([variant='success']) .tag {\n  --le-tag-bg: var(--le-color-success, #dcfce7);\n  --le-tag-color: var(--le-color-success-contrast, #166534);\n}\n\n:host([variant='warning']) .tag {\n  --le-tag-bg: var(--le-color-warning-light, #fef3c7);\n  --le-tag-color: var(--le-color-warning-contrast, #92400e);\n}\n\n:host([variant='danger']) .tag {\n  --le-tag-bg: var(--le-color-danger, #fee2e2);\n  --le-tag-color: var(--le-color-danger-contrast, #991b1b);\n}\n\n/* Icon */\n.tag-icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.tag-icon img {\n  width: 1em;\n  height: 1em;\n  object-fit: contain;\n}\n\n/* Label */\n.tag-label {\n  display: inline-block;\n}\n\n/* Dismiss button */\n.tag-dismiss {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--le-tag-dismiss-size);\n  height: var(--le-tag-dismiss-size);\n  padding: 0;\n  margin-block: calc(var(--le-tag-dismiss-size) * -1);\n  margin-right: calc(var(--le-tag-dismiss-size) / 3 * -1);\n  border: none;\n  background: transparent;\n  color: currentColor;\n  opacity: 0.6;\n  cursor: pointer;\n  border-radius: 50%;\n  transition: opacity 0.15s ease, background-color 0.15s ease;\n}\n\n.tag-dismiss:hover {\n  opacity: 1;\n  background: rgba(0, 0, 0, 0.1);\n}\n\n.tag-dismiss:focus-visible {\n  outline: 2px solid var(--le-color-primary, #3b82f6);\n  outline-offset: 1px;\n}\n\n.tag-dismiss svg {\n  width: 0.75em;\n  height: 0.75em;\n}\n\n.tag-dismiss:disabled {\n  cursor: not-allowed;\n}\n","import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\n\n/**\n * A tag/chip component for displaying labels with optional dismiss functionality.\n *\n * @cmsEditable false\n * @cmsCategory Form\n *\n * @slot - Default slot for custom content (overrides label prop)\n *\n * @example Basic tag\n * ```html\n * <le-tag label=\"JavaScript\"></le-tag>\n * ```\n *\n * @example Dismissible tag\n * ```html\n * <le-tag label=\"Remove me\" dismissible></le-tag>\n * ```\n *\n * @example With icon\n * ```html\n * <le-tag label=\"Settings\" icon=\"⚙️\"></le-tag>\n * ```\n *\n * @example Different sizes\n * ```html\n * <le-tag label=\"Small\" size=\"small\"></le-tag>\n * <le-tag label=\"Medium\" size=\"medium\"></le-tag>\n * <le-tag label=\"Large\" size=\"large\"></le-tag>\n * ```\n *\n * @example Different variants\n * ```html\n * <le-tag label=\"Default\" variant=\"default\"></le-tag>\n * <le-tag label=\"Primary\" variant=\"primary\"></le-tag>\n * <le-tag label=\"Success\" variant=\"success\"></le-tag>\n * <le-tag label=\"Warning\" variant=\"warning\"></le-tag>\n * <le-tag label=\"Danger\" variant=\"danger\"></le-tag>\n * ```\n */\n@Component({\n  tag: 'le-tag',\n  styleUrl: 'le-tag.css',\n  shadow: true,\n})\nexport class LeTag {\n  /**\n   * The text label to display in the tag.\n   */\n  @Prop() label: string;\n\n  /**\n   * Mode of the popover should be 'default' for internal use\n   */\n  @Prop({ mutable: true, reflect: true }) mode: 'default' | 'admin';\n\n  /**\n   * Icon to display before the label.\n   * Can be an emoji, URL, or icon name.\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Whether the tag can be dismissed (shows close button).\n   */\n  @Prop() dismissible: boolean = false;\n\n  /**\n   * Whether the tag is disabled.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * The size of the tag.\n   */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * The visual variant of the tag.\n   */\n  @Prop({ reflect: true }) variant: 'default' | 'primary' | 'success' | 'warning' | 'danger' = 'default';\n\n  /**\n   * Emitted when the dismiss button is clicked.\n   */\n  @Event() leDismiss: EventEmitter<void>;\n\n  private handleDismiss = (e: MouseEvent) => {\n    e.stopPropagation();\n    if (!this.disabled) {\n      this.leDismiss.emit();\n    }\n  };\n\n  private renderIcon() {\n    if (!this.icon) return null;\n\n    // Check if it's a URL (starts with http, https, or /)\n    if (this.icon.startsWith('http') || this.icon.startsWith('/')) {\n      return <img class=\"tag-icon\" src={this.icon} alt=\"\" />;\n    }\n\n    // Otherwise render as text (emoji or icon font)\n    return <span class=\"tag-icon\">{this.icon}</span>;\n  }\n\n  render() {\n    return (\n      <le-component component=\"le-tag\">\n        <span class=\"tag\">\n          {this.renderIcon()}\n          <span class=\"tag-label\">\n            <le-slot name=\"\" tag=\"span\" type=\"text\">\n              <slot>{this.label}</slot>\n            </le-slot>\n          </span>\n          {this.dismissible && (\n            <button type=\"button\" class=\"tag-dismiss\" onClick={this.handleDismiss} disabled={this.disabled} aria-label=\"Remove\">\n              <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                <path d=\"M4 4l8 8M12 4l-8 8\" />\n              </svg>\n            </button>\n          )}\n        </span>\n      </le-component>\n    );\n  }\n}\n"],"version":3}

package/dist/components/le-text.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { o as observeModeChanges } from './utils.js';
-import { d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$5, c as defineCustomElement$6, e as defineCustomElement$7 } from './le-button2.js';
-import { d as defineCustomElement$4 } from './le-popover2.js';
+import { d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$4, c as defineCustomElement$6, e as defineCustomElement$7, f as defineCustomElement$8 } from './le-button2.js';
+import { d as defineCustomElement$5 } from './le-popover2.js';
 
 const leTextDefaultCss = ":host{display:block}:host([hidden]){display:none}.le-text{margin:0;color:var(--le-text-color, var(--le-color-text));font-family:var(--le-font-family);line-height:var(--le-text-line-height, 1.5)}.variant-p{font-size:var(--le-font-size-base, 1rem);font-weight:var(--le-font-weight-normal, 400);color:var(--le-color-text)}.variant-h1{font-size:var(--le-font-size-4xl, 2.5rem);font-weight:var(--le-font-weight-bold, 700);line-height:1.2;color:var(--le-color-text);letter-spacing:-0.02em}.variant-h2{font-size:var(--le-font-size-3xl, 2rem);font-weight:var(--le-font-weight-bold, 700);line-height:1.25;color:var(--le-color-text);letter-spacing:-0.01em}.variant-h3{font-size:var(--le-font-size-2xl, 1.5rem);font-weight:var(--le-font-weight-semibold, 600);line-height:1.3;color:var(--le-color-text)}.variant-h4{font-size:var(--le-font-size-xl, 1.25rem);font-weight:var(--le-font-weight-semibold, 600);line-height:1.35;color:var(--le-color-text)}.variant-h5{font-size:var(--le-font-size-lg, 1.125rem);font-weight:var(--le-font-weight-medium, 500);line-height:1.4;color:var(--le-color-text)}.variant-h6{font-size:var(--le-font-size-base, 1rem);font-weight:var(--le-font-weight-medium, 500);line-height:1.45;color:var(--le-color-text);text-transform:uppercase;letter-spacing:0.05em}.variant-code{font-family:var(--le-font-family-mono, 'SF Mono', 'Fira Code', 'Consolas', monospace);font-size:var(--le-font-size-sm, 0.875rem);background:var(--le-color-surface-alt, #f5f5f5);padding:var(--le-space-md);border-radius:var(--le-radius-md);overflow-x:auto;white-space:pre-wrap;color:var(--le-color-text)}.variant-quote{font-size:var(--le-font-size-lg, 1.125rem);font-style:italic;color:var(--le-color-text-secondary);border-left:4px solid var(--le-color-primary);padding-left:var(--le-space-lg);margin-left:0;margin-right:0}.variant-label{font-size:var(--le-font-size-sm, 0.875rem);font-weight:var(--le-font-weight-medium, 500);color:var(--le-color-text-secondary);text-transform:uppercase;letter-spacing:0.05em}.variant-small{font-size:var(--le-font-size-sm, 0.875rem);color:var(--le-color-text-secondary)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.truncate.max-lines-2,.truncate.max-lines-3,.truncate.max-lines-4,.truncate.max-lines-5{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical}.truncate.max-lines-2{-webkit-line-clamp:2;line-clamp:2}.truncate.max-lines-3{-webkit-line-clamp:3;line-clamp:3}.truncate.max-lines-4{-webkit-line-clamp:4;line-clamp:4}.truncate.max-lines-5{-webkit-line-clamp:5;line-clamp:5}:host([align=\"center\"]) .le-text{text-align:center}:host([align=\"right\"]) .le-text{text-align:right}:host([align=\"justify\"]) .le-text{text-align:justify}.le-text a{color:var(--le-color-primary);text-decoration:underline}.le-text a:hover{color:var(--le-color-primary-dark)}.le-text strong,.le-text b{font-weight:var(--le-font-weight-bold, 700)}.le-text em,.le-text i{font-style:italic}.le-text u{text-decoration:underline}.le-text s,.le-text strike{text-decoration:line-through}";
 
@@ -350,7 +350,7 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["le-text", "le-button", "le-checkbox", "le-component", "le-popover", "le-slot", "le-string-input"];
+    const components = ["le-text", "le-button", "le-checkbox", "le-component", "le-popover", "le-popup", "le-slot", "le-string-input"];
     components.forEach(tagName => { switch (tagName) {
         case "le-text":
             if (!customElements.get(tagName)) {
@@ -359,20 +359,25 @@ function defineCustomElement$1() {
             break;
         case "le-button":
             if (!customElements.get(tagName)) {
-                defineCustomElement$7();
+                defineCustomElement$8();
             }
             break;
         case "le-checkbox":
             if (!customElements.get(tagName)) {
-                defineCustomElement$6();
+                defineCustomElement$7();
             }
             break;
         case "le-component":
             if (!customElements.get(tagName)) {
-                defineCustomElement$5();
+                defineCustomElement$6();
             }
             break;
         case "le-popover":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "le-popup":
             if (!customElements.get(tagName)) {
                 defineCustomElement$4();
             }

package/dist/components/le-text.js.map

@@ -1 +1 @@
-{"file":"le-text.js","mappings":"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","names":["LeText","__stencil_proxyCustomElement"],"sources":["src/components/le-text/le-text.default.css?tag=le-text&encapsulation=shadow","src/components/le-text/le-text.tsx"],"sourcesContent":["/**\n * le-text default styles\n *\n * Semantic text element with variant-based styling\n */\n\n:host {\n  display: block;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n/* Base text styles */\n.le-text {\n  margin: 0;\n  color: var(--le-text-color, var(--le-color-text));\n  font-family: var(--le-font-family);\n  line-height: var(--le-text-line-height, 1.5);\n}\n\n/* Paragraph */\n.variant-p {\n  font-size: var(--le-font-size-base, 1rem);\n  font-weight: var(--le-font-weight-normal, 400);\n  color: var(--le-color-text);\n}\n\n/* Headings */\n.variant-h1 {\n  font-size: var(--le-font-size-4xl, 2.5rem);\n  font-weight: var(--le-font-weight-bold, 700);\n  line-height: 1.2;\n  color: var(--le-color-text);\n  letter-spacing: -0.02em;\n}\n\n.variant-h2 {\n  font-size: var(--le-font-size-3xl, 2rem);\n  font-weight: var(--le-font-weight-bold, 700);\n  line-height: 1.25;\n  color: var(--le-color-text);\n  letter-spacing: -0.01em;\n}\n\n.variant-h3 {\n  font-size: var(--le-font-size-2xl, 1.5rem);\n  font-weight: var(--le-font-weight-semibold, 600);\n  line-height: 1.3;\n  color: var(--le-color-text);\n}\n\n.variant-h4 {\n  font-size: var(--le-font-size-xl, 1.25rem);\n  font-weight: var(--le-font-weight-semibold, 600);\n  line-height: 1.35;\n  color: var(--le-color-text);\n}\n\n.variant-h5 {\n  font-size: var(--le-font-size-lg, 1.125rem);\n  font-weight: var(--le-font-weight-medium, 500);\n  line-height: 1.4;\n  color: var(--le-color-text);\n}\n\n.variant-h6 {\n  font-size: var(--le-font-size-base, 1rem);\n  font-weight: var(--le-font-weight-medium, 500);\n  line-height: 1.45;\n  color: var(--le-color-text);\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n/* Code */\n.variant-code {\n  font-family: var(--le-font-family-mono, 'SF Mono', 'Fira Code', 'Consolas', monospace);\n  font-size: var(--le-font-size-sm, 0.875rem);\n  background: var(--le-color-surface-alt, #f5f5f5);\n  padding: var(--le-space-md);\n  border-radius: var(--le-radius-md);\n  overflow-x: auto;\n  white-space: pre-wrap;\n  color: var(--le-color-text);\n}\n\n/* Quote */\n.variant-quote {\n  font-size: var(--le-font-size-lg, 1.125rem);\n  font-style: italic;\n  color: var(--le-color-text-secondary);\n  border-left: 4px solid var(--le-color-primary);\n  padding-left: var(--le-space-lg);\n  margin-left: 0;\n  margin-right: 0;\n}\n\n/* Label */\n.variant-label {\n  font-size: var(--le-font-size-sm, 0.875rem);\n  font-weight: var(--le-font-weight-medium, 500);\n  color: var(--le-color-text-secondary);\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n/* Small */\n.variant-small {\n  font-size: var(--le-font-size-sm, 0.875rem);\n  color: var(--le-color-text-secondary);\n}\n\n/* Truncation */\n.truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.truncate.max-lines-2,\n.truncate.max-lines-3,\n.truncate.max-lines-4,\n.truncate.max-lines-5 {\n  white-space: normal;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n}\n\n.truncate.max-lines-2 { -webkit-line-clamp: 2; line-clamp: 2; }\n.truncate.max-lines-3 { -webkit-line-clamp: 3; line-clamp: 3; }\n.truncate.max-lines-4 { -webkit-line-clamp: 4; line-clamp: 4; }\n.truncate.max-lines-5 { -webkit-line-clamp: 5; line-clamp: 5; }\n\n/* Alignment */\n:host([align=\"center\"]) .le-text { text-align: center; }\n:host([align=\"right\"]) .le-text { text-align: right; }\n:host([align=\"justify\"]) .le-text { text-align: justify; }\n\n/* Links inside text */\n.le-text a {\n  color: var(--le-color-primary);\n  text-decoration: underline;\n}\n\n.le-text a:hover {\n  color: var(--le-color-primary-dark);\n}\n\n/* Bold, italic, etc. */\n.le-text strong,\n.le-text b {\n  font-weight: var(--le-font-weight-bold, 700);\n}\n\n.le-text em,\n.le-text i {\n  font-style: italic;\n}\n\n.le-text u {\n  text-decoration: underline;\n}\n\n.le-text s,\n.le-text strike {\n  text-decoration: line-through;\n}\n","import { Component, Prop, State, h, Host, Element, Watch } from '@stencil/core';\nimport { observeModeChanges } from '../../utils/utils';\n\n/**\n * A text component with rich text editing capabilities in admin mode.\n *\n * `le-text` renders semantic text elements (headings, paragraphs, code, quotes)\n * and provides a Notion-like rich text editor in admin mode with formatting\n * toolbar for bold, italic, links, and paragraph type selection.\n *\n * @slot - Default slot for text content\n *\n * @cssprop --le-text-color - Text color\n * @cssprop --le-text-font-size - Font size\n * @cssprop --le-text-line-height - Line height\n * @cssprop --le-text-font-weight - Font weight\n *\n * @csspart text - The text container element\n *\n * @cmsEditable true\n * @cmsCategory Content\n */\n@Component({\n  tag: 'le-text',\n  styleUrl: 'le-text.default.css',\n  shadow: true,\n})\nexport class LeText {\n  @Element() el: HTMLElement;\n\n  /**\n   * The semantic variant/type of text element\n   * @allowedValues p | h1 | h2 | h3 | h4 | h5 | h6 | code | quote | label | small\n   */\n  @Prop({ mutable: true, reflect: true }) variant: 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'code' | 'quote' | 'label' | 'small' = 'p';\n\n  /**\n   * Text alignment\n   * @allowedValues left | center | right | justify\n   */\n  @Prop({ reflect: true }) align: 'left' | 'center' | 'right' | 'justify' = 'left';\n\n  /**\n   * Text color (CSS value or theme token)\n   */\n  @Prop() color?: string;\n\n  /**\n   * Whether the text should truncate with ellipsis\n   */\n  @Prop() truncate: boolean = false;\n\n  /**\n   * Maximum number of lines before truncating (requires truncate=true)\n   */\n  @Prop() maxLines?: number;\n\n  /**\n   * Internal state to track admin mode\n   */\n  @State() private adminMode: boolean = false;\n\n  /**\n   * The HTML content being edited\n   */\n  @State() private content: string = '';\n\n  /**\n   * Whether the editor is focused (shows toolbar)\n   */\n  @State() private isFocused: boolean = false;\n\n  /**\n   * Current selection state for toolbar button highlighting\n   */\n  @State() private selectionState: SelectionState = {\n    isBold: false,\n    isItalic: false,\n    isUnderline: false,\n    isStrikethrough: false,\n    isLink: false,\n    blockType: 'p',\n  };\n\n  /**\n   * Reference to the contenteditable element\n   */\n  private editorRef?: HTMLDivElement;\n\n  /**\n   * Reference to the slot element\n   */\n  private slotRef?: HTMLSlotElement;\n\n  private disconnectModeObserver?: () => void;\n\n  connectedCallback() {\n    this.disconnectModeObserver = observeModeChanges(this.el, (mode) => {\n      const wasAdmin = this.adminMode;\n      this.adminMode = mode === 'admin';\n      \n      if (this.adminMode && !wasAdmin) {\n        // Entering admin mode - read content from slot\n        requestAnimationFrame(() => this.readSlottedContent());\n      } else if (!this.adminMode && wasAdmin) {\n        // Leaving admin mode - sync content back to slot\n        this.syncContentToSlot();\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    this.disconnectModeObserver?.();\n  }\n\n  @Watch('variant')\n  onVariantChange() {\n    // When variant changes in admin mode, update the content wrapper\n    if (this.adminMode && this.editorRef) {\n      this.syncContentToSlot();\n    }\n  }\n\n  /**\n   * Read content from slotted elements\n   */\n  private readSlottedContent() {\n    if (!this.slotRef) return;\n    \n    const assignedNodes = this.slotRef.assignedNodes({ flatten: true });\n    \n    // Collect all content from assigned nodes\n    let html = '';\n    assignedNodes.forEach(node => {\n      if (node.nodeType === Node.TEXT_NODE) {\n        html += node.textContent;\n      } else if (node.nodeType === Node.ELEMENT_NODE) {\n        html += (node as Element).innerHTML || node.textContent;\n      }\n    });\n    \n    this.content = html.trim();\n  }\n\n  /**\n   * Sync edited content back to the slot\n   */\n  private syncContentToSlot() {\n    if (!this.editorRef) return;\n    \n    const newContent = this.editorRef.innerHTML;\n    \n    // Update the light DOM content\n    // We need to update the actual slotted content\n    const slot = this.slotRef;\n    if (slot) {\n      const assignedNodes = slot.assignedNodes({ flatten: true });\n      if (assignedNodes.length > 0) {\n        const firstNode = assignedNodes[0];\n        if (firstNode.nodeType === Node.ELEMENT_NODE) {\n          (firstNode as Element).innerHTML = newContent;\n        } else if (firstNode.nodeType === Node.TEXT_NODE) {\n          // Replace text node with the new content\n          const parent = firstNode.parentNode;\n          if (parent) {\n            // Create a temporary element to parse HTML\n            const temp = document.createElement('span');\n            temp.innerHTML = newContent;\n            // Replace the text node\n            parent.replaceChild(temp, firstNode);\n            // Unwrap the span if it only contains text\n            if (temp.childNodes.length === 1 && temp.firstChild?.nodeType === Node.TEXT_NODE) {\n              parent.replaceChild(temp.firstChild, temp);\n            }\n          }\n        }\n      } else {\n        // No assigned nodes, set innerHTML on the host's light DOM\n        this.el.innerHTML = newContent;\n      }\n    }\n  }\n\n  /**\n   * Handle input in the contenteditable\n   */\n  private handleInput = () => {\n    if (this.editorRef) {\n      this.content = this.editorRef.innerHTML;\n      this.updateSelectionState();\n    }\n  };\n\n  /**\n   * Handle focus on the editor\n   */\n  private handleFocus = () => {\n    this.isFocused = true;\n    this.updateSelectionState();\n  };\n\n  /**\n   * Handle blur on the editor\n   */\n  private handleBlur = (e: FocusEvent) => {\n    // Check if focus moved to toolbar\n    const relatedTarget = e.relatedTarget as HTMLElement;\n    const toolbar = this.el.shadowRoot?.querySelector('.le-text-toolbar');\n    \n    if (toolbar?.contains(relatedTarget)) {\n      // Focus moved to toolbar, keep it open\n      return;\n    }\n    \n    // Small delay to allow toolbar clicks to register\n    setTimeout(() => {\n      if (!this.el.shadowRoot?.activeElement) {\n        this.isFocused = false;\n        this.syncContentToSlot();\n      }\n    }, 150);\n  };\n\n  /**\n   * Handle selection change to update toolbar state\n   */\n  private handleSelectionChange = () => {\n    this.updateSelectionState();\n  };\n\n  /**\n   * Update the selection state for toolbar highlighting\n   */\n  private updateSelectionState() {\n    const selection = window.getSelection();\n    if (!selection || selection.rangeCount === 0) return;\n\n    this.selectionState = {\n      isBold: document.queryCommandState('bold'),\n      isItalic: document.queryCommandState('italic'),\n      isUnderline: document.queryCommandState('underline'),\n      isStrikethrough: document.queryCommandState('strikeThrough'),\n      isLink: this.isSelectionInLink(selection),\n      blockType: this.variant,\n    };\n  }\n\n  /**\n   * Check if current selection is within a link\n   */\n  private isSelectionInLink(selection: Selection): boolean {\n    if (!selection.anchorNode) return false;\n    \n    let node: Node | null = selection.anchorNode;\n    while (node && node !== this.editorRef) {\n      if (node.nodeName === 'A') return true;\n      node = node.parentNode;\n    }\n    return false;\n  }\n\n  /**\n   * Execute a formatting command\n   */\n  private execCommand(command: string, value?: string) {\n    // Focus the editor first\n    this.editorRef?.focus();\n    \n    // Execute the command\n    document.execCommand(command, false, value);\n    \n    // Update state\n    this.handleInput();\n    this.updateSelectionState();\n  }\n\n  /**\n   * Toggle bold formatting\n   */\n  private toggleBold = (e: Event) => {\n    e.preventDefault();\n    this.execCommand('bold');\n  };\n\n  /**\n   * Toggle italic formatting\n   */\n  private toggleItalic = (e: Event) => {\n    e.preventDefault();\n    this.execCommand('italic');\n  };\n\n  /**\n   * Toggle underline formatting\n   */\n  private toggleUnderline = (e: Event) => {\n    e.preventDefault();\n    this.execCommand('underline');\n  };\n\n  /**\n   * Toggle strikethrough formatting\n   */\n  private toggleStrikethrough = (e: Event) => {\n    e.preventDefault();\n    this.execCommand('strikeThrough');\n  };\n\n  /**\n   * Add or edit a link\n   */\n  private toggleLink = (e: Event) => {\n    e.preventDefault();\n    \n    if (this.selectionState.isLink) {\n      // Remove link\n      this.execCommand('unlink');\n    } else {\n      // Add link\n      const url = prompt('Enter URL:', 'https://');\n      if (url) {\n        this.execCommand('createLink', url);\n      }\n    }\n  };\n\n  /**\n   * Change the block type/variant\n   */\n  private changeVariant = (e: Event) => {\n    const select = e.target as HTMLSelectElement;\n    this.variant = select.value as typeof this.variant;\n  };\n\n  /**\n   * Render the formatting toolbar\n   */\n  private renderToolbar() {\n    return (\n      <div class=\"le-text-toolbar\">\n        <select \n          class=\"le-text-toolbar-select\"\n          onChange={this.changeVariant}\n          onMouseDown={(e) => e.preventDefault()}\n        >\n          <option value=\"p\" selected={this.variant === 'p'}>Paragraph</option>\n          <option value=\"h1\" selected={this.variant === 'h1'}>Heading 1</option>\n          <option value=\"h2\" selected={this.variant === 'h2'}>Heading 2</option>\n          <option value=\"h3\" selected={this.variant === 'h3'}>Heading 3</option>\n          <option value=\"h4\" selected={this.variant === 'h4'}>Heading 4</option>\n          <option value=\"h5\" selected={this.variant === 'h5'}>Heading 5</option>\n          <option value=\"h6\" selected={this.variant === 'h6'}>Heading 6</option>\n          <option value=\"quote\" selected={this.variant === 'quote'}>Quote</option>\n          <option value=\"code\" selected={this.variant === 'code'}>Code</option>\n          <option value=\"label\" selected={this.variant === 'label'}>Label</option>\n          <option value=\"small\" selected={this.variant === 'small'}>Small</option>\n        </select>\n        \n        <div class=\"le-text-toolbar-divider\"></div>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isBold }}\n          onMouseDown={this.toggleBold}\n          title=\"Bold (Ctrl+B)\"\n        >\n          <strong>B</strong>\n        </button>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isItalic }}\n          onMouseDown={this.toggleItalic}\n          title=\"Italic (Ctrl+I)\"\n        >\n          <em>I</em>\n        </button>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isUnderline }}\n          onMouseDown={this.toggleUnderline}\n          title=\"Underline (Ctrl+U)\"\n        >\n          <span style={{ textDecoration: 'underline' }}>U</span>\n        </button>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isStrikethrough }}\n          onMouseDown={this.toggleStrikethrough}\n          title=\"Strikethrough\"\n        >\n          <span style={{ textDecoration: 'line-through' }}>S</span>\n        </button>\n        \n        <div class=\"le-text-toolbar-divider\"></div>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isLink }}\n          onMouseDown={this.toggleLink}\n          title={this.selectionState.isLink ? 'Remove link' : 'Add link'}\n        >\n          🔗\n        </button>\n      </div>\n    );\n  }\n\n  /**\n   * Get the semantic tag for the current variant\n   */\n  private getTag(): string {\n    switch (this.variant) {\n      case 'quote':\n        return 'blockquote';\n      case 'code':\n        return 'pre';\n      case 'label':\n        return 'label';\n      case 'small':\n        return 'small';\n      default:\n        return this.variant; // h1-h6, p\n    }\n  }\n\n  render() {\n    const Tag = this.getTag();\n    \n    const textStyle: { [key: string]: string } = {};\n    if (this.color) {\n      textStyle.color = this.color;\n    }\n    if (this.align) {\n      textStyle.textAlign = this.align;\n    }\n\n    const textClass = {\n      'le-text': true,\n      [`variant-${this.variant}`]: true,\n      'truncate': this.truncate,\n      [`max-lines-${this.maxLines}`]: this.truncate && this.maxLines,\n    };\n\n    // Admin mode - show rich text editor\n    if (this.adminMode) {\n      return (\n        <Host class=\"admin-mode\">\n          <le-component component=\"le-text\">\n            <div class=\"le-text-editor-wrapper\">\n              {this.isFocused && this.renderToolbar()}\n              <Tag \n                class={textClass}\n                part=\"text\"\n                style={textStyle}\n              >\n                <div\n                  ref={(el) => this.editorRef = el}\n                  class=\"le-text-editor\"\n                  contentEditable={true}\n                  onInput={this.handleInput}\n                  onFocus={this.handleFocus}\n                  onBlur={this.handleBlur}\n                  onKeyUp={this.handleSelectionChange}\n                  onMouseUp={this.handleSelectionChange}\n                  innerHTML={this.content}\n                ></div>\n              </Tag>\n              {/* Hidden slot to receive light DOM content */}\n              <div class=\"hidden-slot\">\n                <slot \n                  ref={(el) => this.slotRef = el as HTMLSlotElement}\n                  onSlotchange={() => this.readSlottedContent()}\n                ></slot>\n              </div>\n            </div>\n          </le-component>\n        </Host>\n      );\n    }\n\n    // Default mode - render semantic element with slotted content\n    return (\n      <Host>\n        <Tag \n          class={textClass}\n          part=\"text\"\n          style={textStyle}\n        >\n          <slot ref={(el) => this.slotRef = el as HTMLSlotElement}></slot>\n        </Tag>\n      </Host>\n    );\n  }\n}\n\n/**\n * Selection state for toolbar\n */\ninterface SelectionState {\n  isBold: boolean;\n  isItalic: boolean;\n  isUnderline: boolean;\n  isStrikethrough: boolean;\n  isLink: boolean;\n  blockType: string;\n}\n"],"version":3}
+{"file":"le-text.js","mappings":"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","names":["LeText","__stencil_proxyCustomElement"],"sources":["src/components/le-text/le-text.default.css?tag=le-text&encapsulation=shadow","src/components/le-text/le-text.tsx"],"sourcesContent":["/**\n * le-text default styles\n *\n * Semantic text element with variant-based styling\n */\n\n:host {\n  display: block;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n/* Base text styles */\n.le-text {\n  margin: 0;\n  color: var(--le-text-color, var(--le-color-text));\n  font-family: var(--le-font-family);\n  line-height: var(--le-text-line-height, 1.5);\n}\n\n/* Paragraph */\n.variant-p {\n  font-size: var(--le-font-size-base, 1rem);\n  font-weight: var(--le-font-weight-normal, 400);\n  color: var(--le-color-text);\n}\n\n/* Headings */\n.variant-h1 {\n  font-size: var(--le-font-size-4xl, 2.5rem);\n  font-weight: var(--le-font-weight-bold, 700);\n  line-height: 1.2;\n  color: var(--le-color-text);\n  letter-spacing: -0.02em;\n}\n\n.variant-h2 {\n  font-size: var(--le-font-size-3xl, 2rem);\n  font-weight: var(--le-font-weight-bold, 700);\n  line-height: 1.25;\n  color: var(--le-color-text);\n  letter-spacing: -0.01em;\n}\n\n.variant-h3 {\n  font-size: var(--le-font-size-2xl, 1.5rem);\n  font-weight: var(--le-font-weight-semibold, 600);\n  line-height: 1.3;\n  color: var(--le-color-text);\n}\n\n.variant-h4 {\n  font-size: var(--le-font-size-xl, 1.25rem);\n  font-weight: var(--le-font-weight-semibold, 600);\n  line-height: 1.35;\n  color: var(--le-color-text);\n}\n\n.variant-h5 {\n  font-size: var(--le-font-size-lg, 1.125rem);\n  font-weight: var(--le-font-weight-medium, 500);\n  line-height: 1.4;\n  color: var(--le-color-text);\n}\n\n.variant-h6 {\n  font-size: var(--le-font-size-base, 1rem);\n  font-weight: var(--le-font-weight-medium, 500);\n  line-height: 1.45;\n  color: var(--le-color-text);\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n/* Code */\n.variant-code {\n  font-family: var(--le-font-family-mono, 'SF Mono', 'Fira Code', 'Consolas', monospace);\n  font-size: var(--le-font-size-sm, 0.875rem);\n  background: var(--le-color-surface-alt, #f5f5f5);\n  padding: var(--le-space-md);\n  border-radius: var(--le-radius-md);\n  overflow-x: auto;\n  white-space: pre-wrap;\n  color: var(--le-color-text);\n}\n\n/* Quote */\n.variant-quote {\n  font-size: var(--le-font-size-lg, 1.125rem);\n  font-style: italic;\n  color: var(--le-color-text-secondary);\n  border-left: 4px solid var(--le-color-primary);\n  padding-left: var(--le-space-lg);\n  margin-left: 0;\n  margin-right: 0;\n}\n\n/* Label */\n.variant-label {\n  font-size: var(--le-font-size-sm, 0.875rem);\n  font-weight: var(--le-font-weight-medium, 500);\n  color: var(--le-color-text-secondary);\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n/* Small */\n.variant-small {\n  font-size: var(--le-font-size-sm, 0.875rem);\n  color: var(--le-color-text-secondary);\n}\n\n/* Truncation */\n.truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.truncate.max-lines-2,\n.truncate.max-lines-3,\n.truncate.max-lines-4,\n.truncate.max-lines-5 {\n  white-space: normal;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n}\n\n.truncate.max-lines-2 { -webkit-line-clamp: 2; line-clamp: 2; }\n.truncate.max-lines-3 { -webkit-line-clamp: 3; line-clamp: 3; }\n.truncate.max-lines-4 { -webkit-line-clamp: 4; line-clamp: 4; }\n.truncate.max-lines-5 { -webkit-line-clamp: 5; line-clamp: 5; }\n\n/* Alignment */\n:host([align=\"center\"]) .le-text { text-align: center; }\n:host([align=\"right\"]) .le-text { text-align: right; }\n:host([align=\"justify\"]) .le-text { text-align: justify; }\n\n/* Links inside text */\n.le-text a {\n  color: var(--le-color-primary);\n  text-decoration: underline;\n}\n\n.le-text a:hover {\n  color: var(--le-color-primary-dark);\n}\n\n/* Bold, italic, etc. */\n.le-text strong,\n.le-text b {\n  font-weight: var(--le-font-weight-bold, 700);\n}\n\n.le-text em,\n.le-text i {\n  font-style: italic;\n}\n\n.le-text u {\n  text-decoration: underline;\n}\n\n.le-text s,\n.le-text strike {\n  text-decoration: line-through;\n}\n","import { Component, Prop, State, h, Host, Element, Watch } from '@stencil/core';\nimport { observeModeChanges } from '../../utils/utils';\n\n/**\n * A text component with rich text editing capabilities in admin mode.\n *\n * `le-text` renders semantic text elements (headings, paragraphs, code, quotes)\n * and provides a Notion-like rich text editor in admin mode with formatting\n * toolbar for bold, italic, links, and paragraph type selection.\n *\n * @slot - Default slot for text content\n *\n * @cssprop --le-text-color - Text color\n * @cssprop --le-text-font-size - Font size\n * @cssprop --le-text-line-height - Line height\n * @cssprop --le-text-font-weight - Font weight\n *\n * @csspart text - The text container element\n *\n * @cmsEditable true\n * @cmsCategory Content\n */\n@Component({\n  tag: 'le-text',\n  styleUrl: 'le-text.default.css',\n  shadow: true,\n})\nexport class LeText {\n  @Element() el: HTMLElement;\n\n  /**\n   * The semantic variant/type of text element\n   * @allowedValues p | h1 | h2 | h3 | h4 | h5 | h6 | code | quote | label | small\n   */\n  @Prop({ mutable: true, reflect: true }) variant: 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'code' | 'quote' | 'label' | 'small' = 'p';\n\n  /**\n   * Text alignment\n   * @allowedValues left | center | right | justify\n   */\n  @Prop({ reflect: true }) align: 'left' | 'center' | 'right' | 'justify' = 'left';\n\n  /**\n   * Text color (CSS value or theme token)\n   */\n  @Prop() color?: string;\n\n  /**\n   * Whether the text should truncate with ellipsis\n   */\n  @Prop() truncate: boolean = false;\n\n  /**\n   * Maximum number of lines before truncating (requires truncate=true)\n   */\n  @Prop() maxLines?: number;\n\n  /**\n   * Internal state to track admin mode\n   */\n  @State() private adminMode: boolean = false;\n\n  /**\n   * The HTML content being edited\n   */\n  @State() private content: string = '';\n\n  /**\n   * Whether the editor is focused (shows toolbar)\n   */\n  @State() private isFocused: boolean = false;\n\n  /**\n   * Current selection state for toolbar button highlighting\n   */\n  @State() private selectionState: SelectionState = {\n    isBold: false,\n    isItalic: false,\n    isUnderline: false,\n    isStrikethrough: false,\n    isLink: false,\n    blockType: 'p',\n  };\n\n  /**\n   * Reference to the contenteditable element\n   */\n  private editorRef?: HTMLDivElement;\n\n  /**\n   * Reference to the slot element\n   */\n  private slotRef?: HTMLSlotElement;\n\n  private disconnectModeObserver?: () => void;\n\n  connectedCallback() {\n    this.disconnectModeObserver = observeModeChanges(this.el, (mode) => {\n      const wasAdmin = this.adminMode;\n      this.adminMode = mode === 'admin';\n      \n      if (this.adminMode && !wasAdmin) {\n        // Entering admin mode - read content from slot\n        requestAnimationFrame(() => this.readSlottedContent());\n      } else if (!this.adminMode && wasAdmin) {\n        // Leaving admin mode - sync content back to slot\n        this.syncContentToSlot();\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    this.disconnectModeObserver?.();\n  }\n\n  @Watch('variant')\n  onVariantChange() {\n    // When variant changes in admin mode, update the content wrapper\n    if (this.adminMode && this.editorRef) {\n      this.syncContentToSlot();\n    }\n  }\n\n  /**\n   * Read content from slotted elements\n   */\n  private readSlottedContent() {\n    if (!this.slotRef) return;\n    \n    const assignedNodes = this.slotRef.assignedNodes({ flatten: true });\n    \n    // Collect all content from assigned nodes\n    let html = '';\n    assignedNodes.forEach(node => {\n      if (node.nodeType === Node.TEXT_NODE) {\n        html += node.textContent;\n      } else if (node.nodeType === Node.ELEMENT_NODE) {\n        html += (node as Element).innerHTML || node.textContent;\n      }\n    });\n    \n    this.content = html.trim();\n  }\n\n  /**\n   * Sync edited content back to the slot\n   */\n  private syncContentToSlot() {\n    if (!this.editorRef) return;\n    \n    const newContent = this.editorRef.innerHTML;\n    \n    // Update the light DOM content\n    // We need to update the actual slotted content\n    const slot = this.slotRef;\n    if (slot) {\n      const assignedNodes = slot.assignedNodes({ flatten: true });\n      if (assignedNodes.length > 0) {\n        const firstNode = assignedNodes[0];\n        if (firstNode.nodeType === Node.ELEMENT_NODE) {\n          (firstNode as Element).innerHTML = newContent;\n        } else if (firstNode.nodeType === Node.TEXT_NODE) {\n          // Replace text node with the new content\n          const parent = firstNode.parentNode;\n          if (parent) {\n            // Create a temporary element to parse HTML\n            const temp = document.createElement('span');\n            temp.innerHTML = newContent;\n            // Replace the text node\n            parent.replaceChild(temp, firstNode);\n            // Unwrap the span if it only contains text\n            if (temp.childNodes.length === 1 && temp.firstChild?.nodeType === Node.TEXT_NODE) {\n              parent.replaceChild(temp.firstChild, temp);\n            }\n          }\n        }\n      } else {\n        // No assigned nodes, set innerHTML on the host's light DOM\n        this.el.innerHTML = newContent;\n      }\n    }\n  }\n\n  /**\n   * Handle input in the contenteditable\n   */\n  private handleInput = () => {\n    if (this.editorRef) {\n      this.content = this.editorRef.innerHTML;\n      this.updateSelectionState();\n    }\n  };\n\n  /**\n   * Handle focus on the editor\n   */\n  private handleFocus = () => {\n    this.isFocused = true;\n    this.updateSelectionState();\n  };\n\n  /**\n   * Handle blur on the editor\n   */\n  private handleBlur = (e: FocusEvent) => {\n    // Check if focus moved to toolbar\n    const relatedTarget = e.relatedTarget as HTMLElement;\n    const toolbar = this.el.shadowRoot?.querySelector('.le-text-toolbar');\n    \n    if (toolbar?.contains(relatedTarget)) {\n      // Focus moved to toolbar, keep it open\n      return;\n    }\n    \n    // Small delay to allow toolbar clicks to register\n    setTimeout(() => {\n      if (!this.el.shadowRoot?.activeElement) {\n        this.isFocused = false;\n        this.syncContentToSlot();\n      }\n    }, 150);\n  };\n\n  /**\n   * Handle selection change to update toolbar state\n   */\n  private handleSelectionChange = () => {\n    this.updateSelectionState();\n  };\n\n  /**\n   * Update the selection state for toolbar highlighting\n   */\n  private updateSelectionState() {\n    const selection = window.getSelection();\n    if (!selection || selection.rangeCount === 0) return;\n\n    this.selectionState = {\n      isBold: document.queryCommandState('bold'),\n      isItalic: document.queryCommandState('italic'),\n      isUnderline: document.queryCommandState('underline'),\n      isStrikethrough: document.queryCommandState('strikeThrough'),\n      isLink: this.isSelectionInLink(selection),\n      blockType: this.variant,\n    };\n  }\n\n  /**\n   * Check if current selection is within a link\n   */\n  private isSelectionInLink(selection: Selection): boolean {\n    if (!selection.anchorNode) return false;\n    \n    let node: Node | null = selection.anchorNode;\n    while (node && node !== this.editorRef) {\n      if (node.nodeName === 'A') return true;\n      node = node.parentNode;\n    }\n    return false;\n  }\n\n  /**\n   * Execute a formatting command\n   */\n  private execCommand(command: string, value?: string) {\n    // Focus the editor first\n    this.editorRef?.focus();\n    \n    // Execute the command\n    document.execCommand(command, false, value);\n    \n    // Update state\n    this.handleInput();\n    this.updateSelectionState();\n  }\n\n  /**\n   * Toggle bold formatting\n   */\n  private toggleBold = (e: Event) => {\n    e.preventDefault();\n    this.execCommand('bold');\n  };\n\n  /**\n   * Toggle italic formatting\n   */\n  private toggleItalic = (e: Event) => {\n    e.preventDefault();\n    this.execCommand('italic');\n  };\n\n  /**\n   * Toggle underline formatting\n   */\n  private toggleUnderline = (e: Event) => {\n    e.preventDefault();\n    this.execCommand('underline');\n  };\n\n  /**\n   * Toggle strikethrough formatting\n   */\n  private toggleStrikethrough = (e: Event) => {\n    e.preventDefault();\n    this.execCommand('strikeThrough');\n  };\n\n  /**\n   * Add or edit a link\n   */\n  private toggleLink = (e: Event) => {\n    e.preventDefault();\n    \n    if (this.selectionState.isLink) {\n      // Remove link\n      this.execCommand('unlink');\n    } else {\n      // Add link\n      const url = prompt('Enter URL:', 'https://');\n      if (url) {\n        this.execCommand('createLink', url);\n      }\n    }\n  };\n\n  /**\n   * Change the block type/variant\n   */\n  private changeVariant = (e: Event) => {\n    const select = e.target as HTMLSelectElement;\n    this.variant = select.value as typeof this.variant;\n  };\n\n  /**\n   * Render the formatting toolbar\n   */\n  private renderToolbar() {\n    return (\n      <div class=\"le-text-toolbar\">\n        <select \n          class=\"le-text-toolbar-select\"\n          onChange={this.changeVariant}\n          onMouseDown={(e) => e.preventDefault()}\n        >\n          <option value=\"p\" selected={this.variant === 'p'}>Paragraph</option>\n          <option value=\"h1\" selected={this.variant === 'h1'}>Heading 1</option>\n          <option value=\"h2\" selected={this.variant === 'h2'}>Heading 2</option>\n          <option value=\"h3\" selected={this.variant === 'h3'}>Heading 3</option>\n          <option value=\"h4\" selected={this.variant === 'h4'}>Heading 4</option>\n          <option value=\"h5\" selected={this.variant === 'h5'}>Heading 5</option>\n          <option value=\"h6\" selected={this.variant === 'h6'}>Heading 6</option>\n          <option value=\"quote\" selected={this.variant === 'quote'}>Quote</option>\n          <option value=\"code\" selected={this.variant === 'code'}>Code</option>\n          <option value=\"label\" selected={this.variant === 'label'}>Label</option>\n          <option value=\"small\" selected={this.variant === 'small'}>Small</option>\n        </select>\n        \n        <div class=\"le-text-toolbar-divider\"></div>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isBold }}\n          onMouseDown={this.toggleBold}\n          title=\"Bold (Ctrl+B)\"\n        >\n          <strong>B</strong>\n        </button>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isItalic }}\n          onMouseDown={this.toggleItalic}\n          title=\"Italic (Ctrl+I)\"\n        >\n          <em>I</em>\n        </button>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isUnderline }}\n          onMouseDown={this.toggleUnderline}\n          title=\"Underline (Ctrl+U)\"\n        >\n          <span style={{ textDecoration: 'underline' }}>U</span>\n        </button>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isStrikethrough }}\n          onMouseDown={this.toggleStrikethrough}\n          title=\"Strikethrough\"\n        >\n          <span style={{ textDecoration: 'line-through' }}>S</span>\n        </button>\n        \n        <div class=\"le-text-toolbar-divider\"></div>\n        \n        <button\n          type=\"button\"\n          class={{ 'le-text-toolbar-btn': true, 'active': this.selectionState.isLink }}\n          onMouseDown={this.toggleLink}\n          title={this.selectionState.isLink ? 'Remove link' : 'Add link'}\n        >\n          🔗\n        </button>\n      </div>\n    );\n  }\n\n  /**\n   * Get the semantic tag for the current variant\n   */\n  private getTag(): string {\n    switch (this.variant) {\n      case 'quote':\n        return 'blockquote';\n      case 'code':\n        return 'pre';\n      case 'label':\n        return 'label';\n      case 'small':\n        return 'small';\n      default:\n        return this.variant; // h1-h6, p\n    }\n  }\n\n  render() {\n    const Tag = this.getTag();\n    \n    const textStyle: { [key: string]: string } = {};\n    if (this.color) {\n      textStyle.color = this.color;\n    }\n    if (this.align) {\n      textStyle.textAlign = this.align;\n    }\n\n    const textClass = {\n      'le-text': true,\n      [`variant-${this.variant}`]: true,\n      'truncate': this.truncate,\n      [`max-lines-${this.maxLines}`]: this.truncate && this.maxLines,\n    };\n\n    // Admin mode - show rich text editor\n    if (this.adminMode) {\n      return (\n        <Host class=\"admin-mode\">\n          <le-component component=\"le-text\">\n            <div class=\"le-text-editor-wrapper\">\n              {this.isFocused && this.renderToolbar()}\n              <Tag \n                class={textClass}\n                part=\"text\"\n                style={textStyle}\n              >\n                <div\n                  ref={(el) => this.editorRef = el}\n                  class=\"le-text-editor\"\n                  contentEditable={true}\n                  onInput={this.handleInput}\n                  onFocus={this.handleFocus}\n                  onBlur={this.handleBlur}\n                  onKeyUp={this.handleSelectionChange}\n                  onMouseUp={this.handleSelectionChange}\n                  innerHTML={this.content}\n                ></div>\n              </Tag>\n              {/* Hidden slot to receive light DOM content */}\n              <div class=\"hidden-slot\">\n                <slot \n                  ref={(el) => this.slotRef = el as HTMLSlotElement}\n                  onSlotchange={() => this.readSlottedContent()}\n                ></slot>\n              </div>\n            </div>\n          </le-component>\n        </Host>\n      );\n    }\n\n    // Default mode - render semantic element with slotted content\n    return (\n      <Host>\n        <Tag \n          class={textClass}\n          part=\"text\"\n          style={textStyle}\n        >\n          <slot ref={(el) => this.slotRef = el as HTMLSlotElement}></slot>\n        </Tag>\n      </Host>\n    );\n  }\n}\n\n/**\n * Selection state for toolbar\n */\ninterface SelectionState {\n  isBold: boolean;\n  isItalic: boolean;\n  isUnderline: boolean;\n  isStrikethrough: boolean;\n  isLink: boolean;\n  blockType: string;\n}\n"],"version":3}

package/dist/components/le-turntable.js

@@ -129,7 +129,7 @@ const LeTurntable$1 = /*@__PURE__*/ proxyCustomElement(class LeTurntable extends
         this.el.style.transform = `rotate(${angle}deg)`;
     }
     render() {
-        return (h("div", { key: 'ec9a506a360881ab3c3df97027c8a25d663f6819', class: "turntable", onMouseDown: this.handleMouseDown.bind(this) }, h("slot", { key: '926a84fa75952bdc3e44f1b2146848401e8ab10f' })));
+        return (h("div", { key: '9c762d15b467b7c5fa6170b49581d31104f6e76d', class: "turntable", onMouseDown: this.handleMouseDown.bind(this) }, h("slot", { key: '8d30d85ebf8002771ff05f758b4b4bc6c12b72c2' })));
     }
     static get watchers() { return {
         "value": ["updateValue"]

package/dist/{le-kit/dist/collection → components}/themes/base.css

@@ -18,6 +18,7 @@
    * SPACING SCALE
    * ============================================ */
   --le-spacing-0: 0;
+  --le-spacing-0-5: 0.125rem;  /* 2px */
   --le-spacing-1: 0.25rem;    /* 4px */
   --le-spacing-2: 0.5rem;     /* 8px */
   --le-spacing-3: 0.75rem;    /* 12px */
@@ -86,4 +87,47 @@
   --le-z-modal: 1050;
   --le-z-popover: 1060;
   --le-z-tooltip: 1070;
+
+  /* ============================================
+   * RICH TEXT EDITOR
+   * ============================================ */
+  
+  /* Editor Container */
+  --le-editor-padding: var(--le-spacing-4);
+  --le-editor-min-height: 200px;
+  
+  /* Blocks */
+  --le-editor-block-spacing: var(--le-spacing-1);
+  --le-editor-block-padding-x: var(--le-spacing-3);
+  --le-editor-block-padding-y: var(--le-spacing-2);
+  
+  /* Block Controls */
+  --le-editor-controls-size: 24px;
+  --le-editor-controls-gap: var(--le-spacing-1);
+  
+  /* Typography */
+  --le-editor-font-size: var(--le-font-size-md);
+  --le-editor-line-height: var(--le-line-height-relaxed);
+  
+  /* Headings */
+  --le-editor-h1-size: var(--le-font-size-3xl);
+  --le-editor-h2-size: var(--le-font-size-2xl);
+  --le-editor-h3-size: var(--le-font-size-xl);
+  --le-editor-heading-weight: var(--le-font-weight-bold);
+  
+  /* Quote */
+  --le-editor-quote-border-width: 3px;
+  
+  /* Code */
+  --le-editor-code-padding: var(--le-spacing-3);
+  --le-editor-inline-code-padding: 0.125em 0.375em;
+  
+  /* Divider */
+  --le-editor-divider-margin: var(--le-spacing-4);
+  
+  /* Lists */
+  --le-editor-list-indent: var(--le-spacing-6);
+  
+  /* Toolbar */
+  --le-editor-toolbar-button-size: 32px;
 }

package/dist/{collection → components}/themes/dark.css

@@ -62,6 +62,7 @@
   /* Surface colors */
   --le-color-surface: #1e1e1e;
   --le-color-surface-elevated: #2d2d2d;
+  --le-color-surface-alt: #334155;
   
   /* Text colors */
   --le-color-text-primary: #ffffff;
@@ -71,6 +72,7 @@
   
   /* Border colors */
   --le-color-border: #333333;
+  --le-color-border-hover: #205e9b;
   --le-color-border-light: #2d2d2d;
   --le-color-border-dark: #444444;
 
@@ -79,7 +81,7 @@
   --le-color-border-input: #515c6b;
 
   /* Focus ring */
-  --le-color-focus: rgba(77, 166, 255, 0.5);
+  --le-color-focus: rgba(77, 166, 255, 0.15);
   
   /* Border radius - same as default */
   --le-radius-none: 0;
@@ -91,6 +93,7 @@
   --le-radius-full: 9999px;
   
   /* Shadows - darker for dark mode */
+  --le-color-shadow: color-mix(in srgb, var(--le-color-primary) 90%, transparent);
   --le-shadow-none: none;
   --le-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
   --le-shadow-md: 0 1px 3px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.3);

package/dist/{core/collection → components}/themes/default.css

@@ -70,6 +70,7 @@
   /* Surface colors (cards, modals, etc.) */
   --le-color-surface: #ffffff;
   --le-color-surface-elevated: #ffffff;
+  --le-color-surface-alt: #e9ebed;
   
   /* Text colors */
   --le-color-text-primary: #212121;
@@ -79,6 +80,7 @@
   
   /* Border colors */
   --le-color-border: #e0e0e0;
+  --le-color-border-hover: #9dd1ff;
   --le-color-border-light: #eeeeee;
   --le-color-border-dark: #bdbdbd;
 
@@ -87,7 +89,7 @@
   --le-color-border-input: #c4d6e6;
   
   /* Focus ring */
-  --le-color-focus: rgba(0, 136, 255, 0.5);
+  --le-color-focus: rgba(0, 136, 255, 0.15);
   
   /* Border radius */
   --le-radius-none: 0;
@@ -99,6 +101,7 @@
   --le-radius-full: 9999px;
   
   /* Shadows */
+  --le-color-shadow: color-mix(in srgb, var(--le-color-primary) 80%, transparent);
   --le-shadow-none: none;
   --le-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
   --le-shadow-md: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);

package/dist/{core/collection → components}/themes/gradient.css

@@ -62,6 +62,7 @@
   /* Surface colors */
   --le-color-surface: rgba(255, 255, 255, 0.95);
   --le-color-surface-elevated: #ffffff;
+  --le-color-surface-alt: #e5def5;
   
   /* Text colors */
   --le-color-text-primary: #1f2937;
@@ -71,6 +72,7 @@
   
   /* Border colors */
   --le-color-border: rgba(139, 92, 246, 0.3);
+  --le-color-border-hover: rgba(172, 140, 246, 0.4);
   --le-color-border-light: rgba(139, 92, 246, 0.1);
   --le-color-border-dark: rgba(139, 92, 246, 0.5);
 
@@ -79,7 +81,7 @@
   --le-color-border-input: #eccddd;
   
   /* Focus ring */
-  --le-color-focus: rgba(139, 92, 246, 0.5);
+  --le-color-focus: rgba(139, 92, 246, 0.15);
   
   /* Border radius - more rounded */
   --le-radius-none: 0;
@@ -91,6 +93,7 @@
   --le-radius-full: 9999px;
   
   /* Shadows - purple tinted */
+  --le-color-shadow: color-mix(in srgb, var(--le-color-primary) 80%, transparent);
   --le-shadow-none: none;
   --le-shadow-sm: 0 1px 2px rgba(139, 92, 246, 0.1);
   --le-shadow-md: 0 4px 6px rgba(139, 92, 246, 0.15), 0 2px 4px rgba(139, 92, 246, 0.1);

package/dist/{le-kit/dist/collection → components}/themes/index.css

@@ -35,6 +35,7 @@
   --le-font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
   --le-font-family-mono: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, monospace;
   
+  --le-font-size-2xs: 0.625rem;
   --le-font-size-xs: 0.75rem;
   --le-font-size-sm: 0.875rem;
   --le-font-size-md: 1rem;
@@ -134,6 +135,7 @@
   --le-radius-full: 9999px;
 
   /* Shadows */
+  --le-color-shadow: color-mix(in srgb, var(--le-color-primary) 80%, transparent);
   --le-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
   --le-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
   --le-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);