le-kit 0.1.14 → 0.1.15

package/dist/core/types/components.d.ts

@@ -1,1752 +0,0 @@
-/* eslint-disable */
-/* tslint:disable */
-/**
- * This is an autogenerated file created by the Stencil compiler.
- * It contains typing information for all components that exist in this project.
- */
-import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { PopupPosition, PopupResult, PopupType } from "./components/le-popup/le-popup";
-export { PopupPosition, PopupResult, PopupType } from "./components/le-popup/le-popup";
-export namespace Components {
-    /**
-     * A flexible box component for use as a flex item within le-stack.
-     * `le-box` wraps content and provides flex item properties like grow, shrink,
-     * basis, and self-alignment. It can also control its internal content alignment.
-     * @cssprop --le-box-bg - Background color
-     * @cssprop --le-box-padding - Padding inside the box
-     * @cssprop --le-box-border-radius - Border radius
-     * @csspart box - The main box container
-     * @csspart content - The inner content wrapper
-     * @cmsEditable true
-     * @cmsCategory Layout
-     */
-    interface LeBox {
-        /**
-          * Internal horizontal alignment of content
-          * @allowedValues start | center | end | stretch
-          * @default 'stretch'
-         */
-        "alignContent": 'start' | 'center' | 'end' | 'stretch';
-        /**
-          * Self-alignment override for this item on the cross axis
-          * @allowedValues auto | start | center | end | stretch | baseline
-          * @default 'auto'
-         */
-        "alignSelf": 'auto' | 'start' | 'center' | 'end' | 'stretch' | 'baseline';
-        /**
-          * Background color or CSS value (e.g., '#f0f0f0', 'var(--le-color-primary-light)')
-         */
-        "background"?: string;
-        /**
-          * Flex basis - initial size before growing/shrinking (e.g., '200px', '25%', 'auto')
-          * @default 'auto'
-         */
-        "basis": string;
-        /**
-          * Border style (e.g., '1px solid #ccc', '2px dashed var(--le-color-border)')
-         */
-        "border"?: string;
-        /**
-          * Border radius (e.g., '8px', 'var(--le-radius-md)')
-         */
-        "borderRadius"?: string;
-        /**
-          * Whether to display box content as flex (for internal alignment)
-          * @default false
-         */
-        "displayFlex": boolean;
-        /**
-          * Flex grow factor - how much the item should grow relative to siblings
-          * @min 0
-          * @default 0
-         */
-        "grow": number;
-        /**
-          * Height of the box (CSS value)
-         */
-        "height"?: string;
-        /**
-          * Direction of internal flex layout when displayFlex is true
-          * @allowedValues horizontal | vertical
-          * @default 'vertical'
-         */
-        "innerDirection": 'horizontal' | 'vertical';
-        /**
-          * Gap between internal flex items when displayFlex is true
-         */
-        "innerGap"?: string;
-        /**
-          * Internal vertical alignment of content
-          * @allowedValues start | center | end | stretch
-          * @default 'start'
-         */
-        "justifyContent": 'start' | 'center' | 'end' | 'stretch';
-        /**
-          * Maximum height constraint
-         */
-        "maxHeight"?: string;
-        /**
-          * Maximum width constraint
-         */
-        "maxWidth"?: string;
-        /**
-          * Minimum height constraint
-         */
-        "minHeight"?: string;
-        /**
-          * Minimum width constraint
-         */
-        "minWidth"?: string;
-        /**
-          * Order in the flex container (lower values come first)
-         */
-        "order"?: number;
-        /**
-          * Padding inside the box (CSS value like '8px', '1rem')
-         */
-        "padding"?: string;
-        /**
-          * Flex shrink factor - how much the item should shrink relative to siblings
-          * @min 0
-          * @default 1
-         */
-        "shrink": number;
-        /**
-          * Width of the box (CSS value like '100px', '50%', 'auto')
-         */
-        "width"?: string;
-    }
-    /**
-     * A flexible button component with multiple variants and states.
-     * @cssprop --le-button-bg - Button background color
-     * @cssprop --le-button-color - Button text color
-     * @cssprop --le-button-border-radius - Button border radius
-     * @cssprop --le-button-padding-x - Button horizontal padding
-     * @cssprop --le-button-padding-y - Button vertical padding
-     * @csspart button - The native button element
-     * @csspart content - The button content wrapper
-     * @cmsEditable true
-     * @cmsCategory Actions
-     */
-    interface LeButton {
-        /**
-          * Button color theme (uses theme semantic colors)
-          * @allowedValues primary | secondary | success | warning | danger | info
-          * @default 'primary'
-         */
-        "color": 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info';
-        /**
-          * Whether the button is disabled
-          * @default false
-         */
-        "disabled": boolean;
-        /**
-          * Whether the button takes full width of its container
-          * @default false
-         */
-        "fullWidth": boolean;
-        /**
-          * Optional href to make the button act as a link
-         */
-        "href"?: string;
-        /**
-          * Whether the button displays only an icon (square aspect ratio)
-          * @default false
-         */
-        "iconOnly": boolean;
-        /**
-          * Mode of the popover should be 'default' for internal use
-         */
-        "mode": 'default' | 'admin';
-        /**
-          * Whether the button is in a selected/active state
-          * @default false
-         */
-        "selected": boolean;
-        /**
-          * Button size
-          * @allowedValues small | medium | large
-          * @default 'medium'
-         */
-        "size": 'small' | 'medium' | 'large';
-        /**
-          * Link target when href is set
-         */
-        "target"?: string;
-        /**
-          * The button type attribute
-          * @allowedValues button | submit | reset
-          * @default 'button'
-         */
-        "type": 'button' | 'submit' | 'reset';
-        /**
-          * Button variant style
-          * @allowedValues solid | outlined | clear
-          * @default 'solid'
-         */
-        "variant": 'solid' | 'outlined' | 'clear' | 'system';
-    }
-    /**
-     * A flexible card component with header, content, and footer slots.
-     * The card uses le-slot wrappers for each slot area. In admin mode,
-     * le-slot shows placeholders for CMS editing. In default mode,
-     * le-slot acts as a transparent passthrough.
-     * @cssprop --le-card-bg - Card background color
-     * @cssprop --le-card-border-radius - Card border radius
-     * @cssprop --le-card-shadow - Card box shadow
-     * @cssprop --le-card-padding - Card content padding
-     * @csspart card - The main card container
-     * @csspart header - The card header section
-     * @csspart content - The card content section
-     * @csspart footer - The card footer section
-     * @cmsEditable true
-     * @cmsCategory Layout
-     */
-    interface LeCard {
-        /**
-          * Whether the card is interactive (clickable)
-          * @default false
-         */
-        "interactive": boolean;
-        /**
-          * Card variant style
-          * @allowedValues default | outlined | elevated
-          * @default 'default'
-         */
-        "variant": 'default' | 'outlined' | 'elevated';
-    }
-    /**
-     * A checkbox component with support for labels, descriptions, and external IDs.
-     * @cssprop --le-checkbox-size - Size of the checkbox input
-     * @cssprop --le-checkbox-color - Color of the checkbox when checked
-     * @cssprop --le-checkbox-label-color - Color of the label text
-     * @cssprop --le-checkbox-desc-color - Color of the description text
-     */
-    interface LeCheckbox {
-        /**
-          * Whether the checkbox is checked
-          * @default false
-         */
-        "checked": boolean;
-        /**
-          * Whether the checkbox is disabled
-          * @default false
-         */
-        "disabled": boolean;
-        /**
-          * External ID for linking with external systems (e.g. database ID, PDF form field ID)
-         */
-        "externalId": string;
-        /**
-          * The name of the checkbox input
-         */
-        "name": string;
-        /**
-          * The value of the checkbox input
-         */
-        "value": string;
-    }
-    /**
-     * A number input component with validation, keyboard controls, and custom spinners.
-     * @cssprop --le-input-bg - Input background color
-     * @cssprop --le-input-color - Input text color
-     * @cssprop --le-input-border - Input border style
-     * @cssprop --le-input-border-focus - Input border style when focused
-     * @cssprop --le-input-border-error - Input border style when invalid
-     * @cssprop --le-input-radius - Input border radius
-     * @cssprop --le-input-padding - Input padding
-     */
-    interface LeNumberInput {
-        /**
-          * Whether the input is disabled
-          * @default false
-         */
-        "disabled": boolean;
-        /**
-          * External ID for linking with external systems
-         */
-        "externalId": string;
-        /**
-          * Icon for the start icon
-         */
-        "iconStart"?: string;
-        /**
-          * Label for the input
-         */
-        "label": string;
-        /**
-          * Maximum allowed value
-         */
-        "max"?: number;
-        /**
-          * Minimum allowed value
-         */
-        "min"?: number;
-        /**
-          * The name of the input
-         */
-        "name": string;
-        /**
-          * Placeholder text
-         */
-        "placeholder": string;
-        /**
-          * Whether the input is read-only
-          * @default false
-         */
-        "readonly": boolean;
-        /**
-          * Whether the input is required
-          * @default false
-         */
-        "required": boolean;
-        /**
-          * Whether to show the spinner controls
-          * @default true
-         */
-        "showSpinners": boolean;
-        /**
-          * Step value for increment/decrement
-          * @default 1
-         */
-        "step": number;
-        /**
-          * The value of the input
-         */
-        "value": number;
-    }
-    /**
-     * A popover component for displaying floating content.
-     * Uses the native HTML Popover API for proper layering with dialogs
-     * and other top-layer elements. Falls back gracefully in older browsers.
-     * @cmsInternal true
-     * @cmsCategory System
-     */
-    interface LePopover {
-        /**
-          * Alignment of the popover
-          * @default 'start'
-         */
-        "align": 'start' | 'center' | 'end';
-        /**
-          * Whether clicking outside closes the popover
-          * @default true
-         */
-        "closeOnClickOutside": boolean;
-        /**
-          * Whether pressing Escape closes the popover
-          * @default true
-         */
-        "closeOnEscape": boolean;
-        /**
-          * Closes the popover
-         */
-        "hide": () => Promise<void>;
-        /**
-          * Maximum width for the popover (e.g., '400px', '25rem')
-         */
-        "maxWidth"?: string;
-        /**
-          * Minimum width for the popover (e.g., '200px', '15rem')
-          * @default '200px'
-         */
-        "minWidth"?: string;
-        /**
-          * Mode of the popover should be 'default' for internal use
-         */
-        "mode": 'default' | 'admin';
-        /**
-          * Offset from the trigger element (in pixels)
-          * @default 8
-         */
-        "offset": number;
-        /**
-          * Whether the popover is currently open
-          * @default false
-         */
-        "open": boolean;
-        /**
-          * Optional title for the popover header
-         */
-        "popoverTitle"?: string;
-        /**
-          * Position of the popover relative to its trigger
-          * @default 'bottom'
-         */
-        "position": 'top' | 'bottom' | 'left' | 'right' | 'auto';
-        /**
-          * Opens the popover
-         */
-        "show": () => Promise<void>;
-        /**
-          * Whether to show a close button in the header
-          * @default true
-         */
-        "showClose": boolean;
-        /**
-          * Toggles the popover
-         */
-        "toggle": () => Promise<void>;
-        /**
-          * Fixed width for the popover (e.g., '300px', '20rem')
-         */
-        "width"?: string;
-    }
-    /**
-     * A flexible popup/dialog component for alerts, confirms, prompts, and custom content.
-     * Uses the native HTML <dialog> element for proper modal behavior, accessibility,
-     * and focus management. Can be used declaratively in HTML or programmatically 
-     * via leAlert(), leConfirm(), lePrompt().
-     * @cmsInternal true
-     * @cmsCategory System
-     */
-    interface LePopup {
-        /**
-          * Text for the cancel button
-          * @default 'Cancel'
-         */
-        "cancelText": string;
-        /**
-          * Whether clicking the backdrop closes the popup (modal only)
-          * @default true
-         */
-        "closeOnBackdrop": boolean;
-        /**
-          * Text for the confirm/OK button
-          * @default 'OK'
-         */
-        "confirmText": string;
-        /**
-          * Default value for prompt input
-          * @default ''
-         */
-        "defaultValue": string;
-        /**
-          * Closes the popup with a result
-         */
-        "hide": (confirmed?: boolean) => Promise<void>;
-        /**
-          * Message text to display (for alert/confirm/prompt types)
-         */
-        "message"?: string;
-        /**
-          * Whether the popup is modal (blocks interaction with page behind)
-          * @default true
-         */
-        "modal": boolean;
-        /**
-          * Whether the popup is currently visible
-          * @default false
-         */
-        "open": boolean;
-        /**
-          * Placeholder text for prompt input
-          * @default ''
-         */
-        "placeholder": string;
-        /**
-          * Optional title for the popup header
-         */
-        "popupTitle"?: string;
-        /**
-          * Position of the popup on screen
-          * @default 'center'
-         */
-        "position": PopupPosition;
-        /**
-          * Opens the popup and returns a promise that resolves when closed
-         */
-        "show": () => Promise<PopupResult>;
-        /**
-          * Type of popup: alert (OK only), confirm (OK/Cancel), prompt (input + OK/Cancel), custom
-          * @default 'alert'
-         */
-        "type": PopupType;
-    }
-    interface LeRoundProgress {
-        /**
-          * @default 0
-         */
-        "padding": number;
-        "paths": string;
-        /**
-          * @default 0
-         */
-        "value": number;
-    }
-    /**
-     * A flexible stack layout component using CSS flexbox.
-     * `le-stack` arranges its children in a row (horizontal) or column (vertical)
-     * with configurable spacing, alignment, and wrapping behavior. Perfect for
-     * creating responsive layouts.
-     * @cssprop --le-stack-gap - Gap between items (defaults to var(--le-space-md))
-     * @csspart stack - The main stack container
-     * @cmsEditable true
-     * @cmsCategory Layout
-     */
-    interface LeStack {
-        /**
-          * Alignment of items on the cross axis
-          * @allowedValues start | center | end | stretch | baseline
-          * @default 'stretch'
-         */
-        "align": 'start' | 'center' | 'end' | 'stretch' | 'baseline';
-        /**
-          * Alignment of wrapped lines (only applies when wrap is true)
-          * @allowedValues start | center | end | stretch | space-between | space-around
-          * @default 'stretch'
-         */
-        "alignContent": 'start' | 'center' | 'end' | 'stretch' | 'space-between' | 'space-around';
-        /**
-          * Direction of the stack layout
-          * @allowedValues horizontal | vertical
-          * @default 'horizontal'
-         */
-        "direction": 'horizontal' | 'vertical';
-        /**
-          * Whether the stack should take full height of its container
-          * @default false
-         */
-        "fullHeight": boolean;
-        /**
-          * Whether the stack should take full width of its container
-          * @default false
-         */
-        "fullWidth": boolean;
-        /**
-          * Gap between items (CSS value like '8px', '1rem', 'var(--le-space-md)')
-         */
-        "gap"?: string;
-        /**
-          * Distribution of items on the main axis
-          * @allowedValues start | center | end | space-between | space-around | space-evenly
-          * @default 'start'
-         */
-        "justify": 'start' | 'center' | 'end' | 'space-between' | 'space-around' | 'space-evenly';
-        /**
-          * Maximum number of items allowed in the stack (for CMS validation)
-          * @min 1
-         */
-        "maxItems"?: number;
-        /**
-          * Padding inside the stack container (CSS value)
-         */
-        "padding"?: string;
-        /**
-          * Whether to reverse the order of items
-          * @default false
-         */
-        "reverse": boolean;
-        /**
-          * Whether items should wrap to multiple lines
-          * @default false
-         */
-        "wrap": boolean;
-    }
-    /**
-     * A text input component with support for labels, descriptions, icons, and external IDs.
-     * @cssprop --le-input-bg - Input background color
-     * @cssprop --le-input-color - Input text color
-     * @cssprop --le-input-border - Input border style
-     * @cssprop --le-input-border-focus - Input border style when focused
-     * @cssprop --le-input-radius - Input border radius
-     * @cssprop --le-input-padding - Input padding
-     */
-    interface LeStringInput {
-        /**
-          * Whether the input is disabled
-          * @default false
-         */
-        "disabled": boolean;
-        /**
-          * External ID for linking with external systems
-         */
-        "externalId": string;
-        /**
-          * Icon for the end icon
-         */
-        "iconEnd": string;
-        /**
-          * Icon for the start icon
-         */
-        "iconStart": string;
-        /**
-          * Label for the input
-         */
-        "label": string;
-        /**
-          * Mode of the popover should be 'default' for internal use
-         */
-        "mode": 'default' | 'admin';
-        /**
-          * The name of the input
-         */
-        "name": string;
-        /**
-          * Placeholder text
-         */
-        "placeholder": string;
-        /**
-          * Whether the input is read-only
-          * @default false
-         */
-        "readonly": boolean;
-        /**
-          * The type of the input (text, email, password, etc.)
-          * @default 'text'
-         */
-        "type": 'text' | 'email' | 'password' | 'tel' | 'url';
-        /**
-          * The value of the input
-         */
-        "value": string;
-    }
-    /**
-     * A text component with rich text editing capabilities in admin mode.
-     * `le-text` renders semantic text elements (headings, paragraphs, code, quotes)
-     * and provides a Notion-like rich text editor in admin mode with formatting
-     * toolbar for bold, italic, links, and paragraph type selection.
-     * @cssprop --le-text-color - Text color
-     * @cssprop --le-text-font-size - Font size
-     * @cssprop --le-text-line-height - Line height
-     * @cssprop --le-text-font-weight - Font weight
-     * @csspart text - The text container element
-     * @cmsEditable true
-     * @cmsCategory Content
-     */
-    interface LeText {
-        /**
-          * Text alignment
-          * @allowedValues left | center | right | justify
-          * @default 'left'
-         */
-        "align": 'left' | 'center' | 'right' | 'justify';
-        /**
-          * Text color (CSS value or theme token)
-         */
-        "color"?: string;
-        /**
-          * Maximum number of lines before truncating (requires truncate=true)
-         */
-        "maxLines"?: number;
-        /**
-          * Whether the text should truncate with ellipsis
-          * @default false
-         */
-        "truncate": boolean;
-        /**
-          * The semantic variant/type of text element
-          * @allowedValues p | h1 | h2 | h3 | h4 | h5 | h6 | code | quote | label | small
-          * @default 'p'
-         */
-        "variant": 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'code' | 'quote' | 'label' | 'small';
-    }
-    interface LeTurntable {
-        /**
-          * @default 'center'
-         */
-        "center": string;
-        /**
-          * @default 0
-         */
-        "value": number;
-    }
-}
-export interface LeButtonCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLLeButtonElement;
-}
-export interface LeCheckboxCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLLeCheckboxElement;
-}
-export interface LeNumberInputCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLLeNumberInputElement;
-}
-export interface LePopoverCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLLePopoverElement;
-}
-export interface LePopupCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLLePopupElement;
-}
-export interface LeStringInputCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLLeStringInputElement;
-}
-declare global {
-    /**
-     * A flexible box component for use as a flex item within le-stack.
-     * `le-box` wraps content and provides flex item properties like grow, shrink,
-     * basis, and self-alignment. It can also control its internal content alignment.
-     * @cssprop --le-box-bg - Background color
-     * @cssprop --le-box-padding - Padding inside the box
-     * @cssprop --le-box-border-radius - Border radius
-     * @csspart box - The main box container
-     * @csspart content - The inner content wrapper
-     * @cmsEditable true
-     * @cmsCategory Layout
-     */
-    interface HTMLLeBoxElement extends Components.LeBox, HTMLStencilElement {
-    }
-    var HTMLLeBoxElement: {
-        prototype: HTMLLeBoxElement;
-        new (): HTMLLeBoxElement;
-    };
-    interface HTMLLeButtonElementEventMap {
-        "click": PointerEvent;
-    }
-    /**
-     * A flexible button component with multiple variants and states.
-     * @cssprop --le-button-bg - Button background color
-     * @cssprop --le-button-color - Button text color
-     * @cssprop --le-button-border-radius - Button border radius
-     * @cssprop --le-button-padding-x - Button horizontal padding
-     * @cssprop --le-button-padding-y - Button vertical padding
-     * @csspart button - The native button element
-     * @csspart content - The button content wrapper
-     * @cmsEditable true
-     * @cmsCategory Actions
-     */
-    interface HTMLLeButtonElement extends Components.LeButton, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLLeButtonElementEventMap>(type: K, listener: (this: HTMLLeButtonElement, ev: LeButtonCustomEvent<HTMLLeButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLLeButtonElementEventMap>(type: K, listener: (this: HTMLLeButtonElement, ev: LeButtonCustomEvent<HTMLLeButtonElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
-    }
-    var HTMLLeButtonElement: {
-        prototype: HTMLLeButtonElement;
-        new (): HTMLLeButtonElement;
-    };
-    /**
-     * A flexible card component with header, content, and footer slots.
-     * The card uses le-slot wrappers for each slot area. In admin mode,
-     * le-slot shows placeholders for CMS editing. In default mode,
-     * le-slot acts as a transparent passthrough.
-     * @cssprop --le-card-bg - Card background color
-     * @cssprop --le-card-border-radius - Card border radius
-     * @cssprop --le-card-shadow - Card box shadow
-     * @cssprop --le-card-padding - Card content padding
-     * @csspart card - The main card container
-     * @csspart header - The card header section
-     * @csspart content - The card content section
-     * @csspart footer - The card footer section
-     * @cmsEditable true
-     * @cmsCategory Layout
-     */
-    interface HTMLLeCardElement extends Components.LeCard, HTMLStencilElement {
-    }
-    var HTMLLeCardElement: {
-        prototype: HTMLLeCardElement;
-        new (): HTMLLeCardElement;
-    };
-    interface HTMLLeCheckboxElementEventMap {
-        "change": { checked: boolean; value: string; name: string; externalId: string };
-    }
-    /**
-     * A checkbox component with support for labels, descriptions, and external IDs.
-     * @cssprop --le-checkbox-size - Size of the checkbox input
-     * @cssprop --le-checkbox-color - Color of the checkbox when checked
-     * @cssprop --le-checkbox-label-color - Color of the label text
-     * @cssprop --le-checkbox-desc-color - Color of the description text
-     */
-    interface HTMLLeCheckboxElement extends Components.LeCheckbox, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLLeCheckboxElementEventMap>(type: K, listener: (this: HTMLLeCheckboxElement, ev: LeCheckboxCustomEvent<HTMLLeCheckboxElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLLeCheckboxElementEventMap>(type: K, listener: (this: HTMLLeCheckboxElement, ev: LeCheckboxCustomEvent<HTMLLeCheckboxElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
-    }
-    var HTMLLeCheckboxElement: {
-        prototype: HTMLLeCheckboxElement;
-        new (): HTMLLeCheckboxElement;
-    };
-    interface HTMLLeNumberInputElementEventMap {
-        "leChange": { value: number; name: string; externalId: string; isValid: boolean };
-        "leInput": { value: number; name: string; externalId: string; isValid: boolean };
-    }
-    /**
-     * A number input component with validation, keyboard controls, and custom spinners.
-     * @cssprop --le-input-bg - Input background color
-     * @cssprop --le-input-color - Input text color
-     * @cssprop --le-input-border - Input border style
-     * @cssprop --le-input-border-focus - Input border style when focused
-     * @cssprop --le-input-border-error - Input border style when invalid
-     * @cssprop --le-input-radius - Input border radius
-     * @cssprop --le-input-padding - Input padding
-     */
-    interface HTMLLeNumberInputElement extends Components.LeNumberInput, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLLeNumberInputElementEventMap>(type: K, listener: (this: HTMLLeNumberInputElement, ev: LeNumberInputCustomEvent<HTMLLeNumberInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLLeNumberInputElementEventMap>(type: K, listener: (this: HTMLLeNumberInputElement, ev: LeNumberInputCustomEvent<HTMLLeNumberInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
-    }
-    var HTMLLeNumberInputElement: {
-        prototype: HTMLLeNumberInputElement;
-        new (): HTMLLeNumberInputElement;
-    };
-    interface HTMLLePopoverElementEventMap {
-        "lePopoverOpen": void;
-        "lePopoverClose": void;
-    }
-    /**
-     * A popover component for displaying floating content.
-     * Uses the native HTML Popover API for proper layering with dialogs
-     * and other top-layer elements. Falls back gracefully in older browsers.
-     * @cmsInternal true
-     * @cmsCategory System
-     */
-    interface HTMLLePopoverElement extends Components.LePopover, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLLePopoverElementEventMap>(type: K, listener: (this: HTMLLePopoverElement, ev: LePopoverCustomEvent<HTMLLePopoverElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLLePopoverElementEventMap>(type: K, listener: (this: HTMLLePopoverElement, ev: LePopoverCustomEvent<HTMLLePopoverElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
-    }
-    var HTMLLePopoverElement: {
-        prototype: HTMLLePopoverElement;
-        new (): HTMLLePopoverElement;
-    };
-    interface HTMLLePopupElementEventMap {
-        "leConfirm": PopupResult;
-        "leCancel": PopupResult;
-        "leOpen": void;
-        "leClose": PopupResult;
-    }
-    /**
-     * A flexible popup/dialog component for alerts, confirms, prompts, and custom content.
-     * Uses the native HTML <dialog> element for proper modal behavior, accessibility,
-     * and focus management. Can be used declaratively in HTML or programmatically 
-     * via leAlert(), leConfirm(), lePrompt().
-     * @cmsInternal true
-     * @cmsCategory System
-     */
-    interface HTMLLePopupElement extends Components.LePopup, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLLePopupElementEventMap>(type: K, listener: (this: HTMLLePopupElement, ev: LePopupCustomEvent<HTMLLePopupElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLLePopupElementEventMap>(type: K, listener: (this: HTMLLePopupElement, ev: LePopupCustomEvent<HTMLLePopupElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
-    }
-    var HTMLLePopupElement: {
-        prototype: HTMLLePopupElement;
-        new (): HTMLLePopupElement;
-    };
-    interface HTMLLeRoundProgressElement extends Components.LeRoundProgress, HTMLStencilElement {
-    }
-    var HTMLLeRoundProgressElement: {
-        prototype: HTMLLeRoundProgressElement;
-        new (): HTMLLeRoundProgressElement;
-    };
-    /**
-     * A flexible stack layout component using CSS flexbox.
-     * `le-stack` arranges its children in a row (horizontal) or column (vertical)
-     * with configurable spacing, alignment, and wrapping behavior. Perfect for
-     * creating responsive layouts.
-     * @cssprop --le-stack-gap - Gap between items (defaults to var(--le-space-md))
-     * @csspart stack - The main stack container
-     * @cmsEditable true
-     * @cmsCategory Layout
-     */
-    interface HTMLLeStackElement extends Components.LeStack, HTMLStencilElement {
-    }
-    var HTMLLeStackElement: {
-        prototype: HTMLLeStackElement;
-        new (): HTMLLeStackElement;
-    };
-    interface HTMLLeStringInputElementEventMap {
-        "change": { value: string; name: string; externalId: string };
-        "input": { value: string; name: string; externalId: string };
-    }
-    /**
-     * A text input component with support for labels, descriptions, icons, and external IDs.
-     * @cssprop --le-input-bg - Input background color
-     * @cssprop --le-input-color - Input text color
-     * @cssprop --le-input-border - Input border style
-     * @cssprop --le-input-border-focus - Input border style when focused
-     * @cssprop --le-input-radius - Input border radius
-     * @cssprop --le-input-padding - Input padding
-     */
-    interface HTMLLeStringInputElement extends Components.LeStringInput, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLLeStringInputElementEventMap>(type: K, listener: (this: HTMLLeStringInputElement, ev: LeStringInputCustomEvent<HTMLLeStringInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLLeStringInputElementEventMap>(type: K, listener: (this: HTMLLeStringInputElement, ev: LeStringInputCustomEvent<HTMLLeStringInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
-    }
-    var HTMLLeStringInputElement: {
-        prototype: HTMLLeStringInputElement;
-        new (): HTMLLeStringInputElement;
-    };
-    /**
-     * A text component with rich text editing capabilities in admin mode.
-     * `le-text` renders semantic text elements (headings, paragraphs, code, quotes)
-     * and provides a Notion-like rich text editor in admin mode with formatting
-     * toolbar for bold, italic, links, and paragraph type selection.
-     * @cssprop --le-text-color - Text color
-     * @cssprop --le-text-font-size - Font size
-     * @cssprop --le-text-line-height - Line height
-     * @cssprop --le-text-font-weight - Font weight
-     * @csspart text - The text container element
-     * @cmsEditable true
-     * @cmsCategory Content
-     */
-    interface HTMLLeTextElement extends Components.LeText, HTMLStencilElement {
-    }
-    var HTMLLeTextElement: {
-        prototype: HTMLLeTextElement;
-        new (): HTMLLeTextElement;
-    };
-    interface HTMLLeTurntableElement extends Components.LeTurntable, HTMLStencilElement {
-    }
-    var HTMLLeTurntableElement: {
-        prototype: HTMLLeTurntableElement;
-        new (): HTMLLeTurntableElement;
-    };
-    interface HTMLElementTagNameMap {
-        "le-box": HTMLLeBoxElement;
-        "le-button": HTMLLeButtonElement;
-        "le-card": HTMLLeCardElement;
-        "le-checkbox": HTMLLeCheckboxElement;
-        "le-number-input": HTMLLeNumberInputElement;
-        "le-popover": HTMLLePopoverElement;
-        "le-popup": HTMLLePopupElement;
-        "le-round-progress": HTMLLeRoundProgressElement;
-        "le-stack": HTMLLeStackElement;
-        "le-string-input": HTMLLeStringInputElement;
-        "le-text": HTMLLeTextElement;
-        "le-turntable": HTMLLeTurntableElement;
-    }
-}
-declare namespace LocalJSX {
-    /**
-     * A flexible box component for use as a flex item within le-stack.
-     * `le-box` wraps content and provides flex item properties like grow, shrink,
-     * basis, and self-alignment. It can also control its internal content alignment.
-     * @cssprop --le-box-bg - Background color
-     * @cssprop --le-box-padding - Padding inside the box
-     * @cssprop --le-box-border-radius - Border radius
-     * @csspart box - The main box container
-     * @csspart content - The inner content wrapper
-     * @cmsEditable true
-     * @cmsCategory Layout
-     */
-    interface LeBox {
-        /**
-          * Internal horizontal alignment of content
-          * @allowedValues start | center | end | stretch
-          * @default 'stretch'
-         */
-        "alignContent"?: 'start' | 'center' | 'end' | 'stretch';
-        /**
-          * Self-alignment override for this item on the cross axis
-          * @allowedValues auto | start | center | end | stretch | baseline
-          * @default 'auto'
-         */
-        "alignSelf"?: 'auto' | 'start' | 'center' | 'end' | 'stretch' | 'baseline';
-        /**
-          * Background color or CSS value (e.g., '#f0f0f0', 'var(--le-color-primary-light)')
-         */
-        "background"?: string;
-        /**
-          * Flex basis - initial size before growing/shrinking (e.g., '200px', '25%', 'auto')
-          * @default 'auto'
-         */
-        "basis"?: string;
-        /**
-          * Border style (e.g., '1px solid #ccc', '2px dashed var(--le-color-border)')
-         */
-        "border"?: string;
-        /**
-          * Border radius (e.g., '8px', 'var(--le-radius-md)')
-         */
-        "borderRadius"?: string;
-        /**
-          * Whether to display box content as flex (for internal alignment)
-          * @default false
-         */
-        "displayFlex"?: boolean;
-        /**
-          * Flex grow factor - how much the item should grow relative to siblings
-          * @min 0
-          * @default 0
-         */
-        "grow"?: number;
-        /**
-          * Height of the box (CSS value)
-         */
-        "height"?: string;
-        /**
-          * Direction of internal flex layout when displayFlex is true
-          * @allowedValues horizontal | vertical
-          * @default 'vertical'
-         */
-        "innerDirection"?: 'horizontal' | 'vertical';
-        /**
-          * Gap between internal flex items when displayFlex is true
-         */
-        "innerGap"?: string;
-        /**
-          * Internal vertical alignment of content
-          * @allowedValues start | center | end | stretch
-          * @default 'start'
-         */
-        "justifyContent"?: 'start' | 'center' | 'end' | 'stretch';
-        /**
-          * Maximum height constraint
-         */
-        "maxHeight"?: string;
-        /**
-          * Maximum width constraint
-         */
-        "maxWidth"?: string;
-        /**
-          * Minimum height constraint
-         */
-        "minHeight"?: string;
-        /**
-          * Minimum width constraint
-         */
-        "minWidth"?: string;
-        /**
-          * Order in the flex container (lower values come first)
-         */
-        "order"?: number;
-        /**
-          * Padding inside the box (CSS value like '8px', '1rem')
-         */
-        "padding"?: string;
-        /**
-          * Flex shrink factor - how much the item should shrink relative to siblings
-          * @min 0
-          * @default 1
-         */
-        "shrink"?: number;
-        /**
-          * Width of the box (CSS value like '100px', '50%', 'auto')
-         */
-        "width"?: string;
-    }
-    /**
-     * A flexible button component with multiple variants and states.
-     * @cssprop --le-button-bg - Button background color
-     * @cssprop --le-button-color - Button text color
-     * @cssprop --le-button-border-radius - Button border radius
-     * @cssprop --le-button-padding-x - Button horizontal padding
-     * @cssprop --le-button-padding-y - Button vertical padding
-     * @csspart button - The native button element
-     * @csspart content - The button content wrapper
-     * @cmsEditable true
-     * @cmsCategory Actions
-     */
-    interface LeButton {
-        /**
-          * Button color theme (uses theme semantic colors)
-          * @allowedValues primary | secondary | success | warning | danger | info
-          * @default 'primary'
-         */
-        "color"?: 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info';
-        /**
-          * Whether the button is disabled
-          * @default false
-         */
-        "disabled"?: boolean;
-        /**
-          * Whether the button takes full width of its container
-          * @default false
-         */
-        "fullWidth"?: boolean;
-        /**
-          * Optional href to make the button act as a link
-         */
-        "href"?: string;
-        /**
-          * Whether the button displays only an icon (square aspect ratio)
-          * @default false
-         */
-        "iconOnly"?: boolean;
-        /**
-          * Mode of the popover should be 'default' for internal use
-         */
-        "mode"?: 'default' | 'admin';
-        /**
-          * Emitted when the button is clicked. This is a custom event that wraps the native click but ensures the target is the le-button.
-         */
-        "onClick"?: (event: LeButtonCustomEvent<PointerEvent>) => void;
-        /**
-          * Whether the button is in a selected/active state
-          * @default false
-         */
-        "selected"?: boolean;
-        /**
-          * Button size
-          * @allowedValues small | medium | large
-          * @default 'medium'
-         */
-        "size"?: 'small' | 'medium' | 'large';
-        /**
-          * Link target when href is set
-         */
-        "target"?: string;
-        /**
-          * The button type attribute
-          * @allowedValues button | submit | reset
-          * @default 'button'
-         */
-        "type"?: 'button' | 'submit' | 'reset';
-        /**
-          * Button variant style
-          * @allowedValues solid | outlined | clear
-          * @default 'solid'
-         */
-        "variant"?: 'solid' | 'outlined' | 'clear' | 'system';
-    }
-    /**
-     * A flexible card component with header, content, and footer slots.
-     * The card uses le-slot wrappers for each slot area. In admin mode,
-     * le-slot shows placeholders for CMS editing. In default mode,
-     * le-slot acts as a transparent passthrough.
-     * @cssprop --le-card-bg - Card background color
-     * @cssprop --le-card-border-radius - Card border radius
-     * @cssprop --le-card-shadow - Card box shadow
-     * @cssprop --le-card-padding - Card content padding
-     * @csspart card - The main card container
-     * @csspart header - The card header section
-     * @csspart content - The card content section
-     * @csspart footer - The card footer section
-     * @cmsEditable true
-     * @cmsCategory Layout
-     */
-    interface LeCard {
-        /**
-          * Whether the card is interactive (clickable)
-          * @default false
-         */
-        "interactive"?: boolean;
-        /**
-          * Card variant style
-          * @allowedValues default | outlined | elevated
-          * @default 'default'
-         */
-        "variant"?: 'default' | 'outlined' | 'elevated';
-    }
-    /**
-     * A checkbox component with support for labels, descriptions, and external IDs.
-     * @cssprop --le-checkbox-size - Size of the checkbox input
-     * @cssprop --le-checkbox-color - Color of the checkbox when checked
-     * @cssprop --le-checkbox-label-color - Color of the label text
-     * @cssprop --le-checkbox-desc-color - Color of the description text
-     */
-    interface LeCheckbox {
-        /**
-          * Whether the checkbox is checked
-          * @default false
-         */
-        "checked"?: boolean;
-        /**
-          * Whether the checkbox is disabled
-          * @default false
-         */
-        "disabled"?: boolean;
-        /**
-          * External ID for linking with external systems (e.g. database ID, PDF form field ID)
-         */
-        "externalId"?: string;
-        /**
-          * The name of the checkbox input
-         */
-        "name"?: string;
-        /**
-          * Emitted when the checked state changes
-         */
-        "onChange"?: (event: LeCheckboxCustomEvent<{ checked: boolean; value: string; name: string; externalId: string }>) => void;
-        /**
-          * The value of the checkbox input
-         */
-        "value"?: string;
-    }
-    /**
-     * A number input component with validation, keyboard controls, and custom spinners.
-     * @cssprop --le-input-bg - Input background color
-     * @cssprop --le-input-color - Input text color
-     * @cssprop --le-input-border - Input border style
-     * @cssprop --le-input-border-focus - Input border style when focused
-     * @cssprop --le-input-border-error - Input border style when invalid
-     * @cssprop --le-input-radius - Input border radius
-     * @cssprop --le-input-padding - Input padding
-     */
-    interface LeNumberInput {
-        /**
-          * Whether the input is disabled
-          * @default false
-         */
-        "disabled"?: boolean;
-        /**
-          * External ID for linking with external systems
-         */
-        "externalId"?: string;
-        /**
-          * Icon for the start icon
-         */
-        "iconStart"?: string;
-        /**
-          * Label for the input
-         */
-        "label"?: string;
-        /**
-          * Maximum allowed value
-         */
-        "max"?: number;
-        /**
-          * Minimum allowed value
-         */
-        "min"?: number;
-        /**
-          * The name of the input
-         */
-        "name"?: string;
-        /**
-          * Emitted when the value changes (on blur or Enter)
-         */
-        "onLeChange"?: (event: LeNumberInputCustomEvent<{ value: number; name: string; externalId: string; isValid: boolean }>) => void;
-        /**
-          * Emitted when the input value changes (on keystroke/spin)
-         */
-        "onLeInput"?: (event: LeNumberInputCustomEvent<{ value: number; name: string; externalId: string; isValid: boolean }>) => void;
-        /**
-          * Placeholder text
-         */
-        "placeholder"?: string;
-        /**
-          * Whether the input is read-only
-          * @default false
-         */
-        "readonly"?: boolean;
-        /**
-          * Whether the input is required
-          * @default false
-         */
-        "required"?: boolean;
-        /**
-          * Whether to show the spinner controls
-          * @default true
-         */
-        "showSpinners"?: boolean;
-        /**
-          * Step value for increment/decrement
-          * @default 1
-         */
-        "step"?: number;
-        /**
-          * The value of the input
-         */
-        "value"?: number;
-    }
-    /**
-     * A popover component for displaying floating content.
-     * Uses the native HTML Popover API for proper layering with dialogs
-     * and other top-layer elements. Falls back gracefully in older browsers.
-     * @cmsInternal true
-     * @cmsCategory System
-     */
-    interface LePopover {
-        /**
-          * Alignment of the popover
-          * @default 'start'
-         */
-        "align"?: 'start' | 'center' | 'end';
-        /**
-          * Whether clicking outside closes the popover
-          * @default true
-         */
-        "closeOnClickOutside"?: boolean;
-        /**
-          * Whether pressing Escape closes the popover
-          * @default true
-         */
-        "closeOnEscape"?: boolean;
-        /**
-          * Maximum width for the popover (e.g., '400px', '25rem')
-         */
-        "maxWidth"?: string;
-        /**
-          * Minimum width for the popover (e.g., '200px', '15rem')
-          * @default '200px'
-         */
-        "minWidth"?: string;
-        /**
-          * Mode of the popover should be 'default' for internal use
-         */
-        "mode"?: 'default' | 'admin';
-        /**
-          * Offset from the trigger element (in pixels)
-          * @default 8
-         */
-        "offset"?: number;
-        /**
-          * Emitted when the popover closes
-         */
-        "onLePopoverClose"?: (event: LePopoverCustomEvent<void>) => void;
-        /**
-          * Emitted when the popover opens
-         */
-        "onLePopoverOpen"?: (event: LePopoverCustomEvent<void>) => void;
-        /**
-          * Whether the popover is currently open
-          * @default false
-         */
-        "open"?: boolean;
-        /**
-          * Optional title for the popover header
-         */
-        "popoverTitle"?: string;
-        /**
-          * Position of the popover relative to its trigger
-          * @default 'bottom'
-         */
-        "position"?: 'top' | 'bottom' | 'left' | 'right' | 'auto';
-        /**
-          * Whether to show a close button in the header
-          * @default true
-         */
-        "showClose"?: boolean;
-        /**
-          * Fixed width for the popover (e.g., '300px', '20rem')
-         */
-        "width"?: string;
-    }
-    /**
-     * A flexible popup/dialog component for alerts, confirms, prompts, and custom content.
-     * Uses the native HTML <dialog> element for proper modal behavior, accessibility,
-     * and focus management. Can be used declaratively in HTML or programmatically 
-     * via leAlert(), leConfirm(), lePrompt().
-     * @cmsInternal true
-     * @cmsCategory System
-     */
-    interface LePopup {
-        /**
-          * Text for the cancel button
-          * @default 'Cancel'
-         */
-        "cancelText"?: string;
-        /**
-          * Whether clicking the backdrop closes the popup (modal only)
-          * @default true
-         */
-        "closeOnBackdrop"?: boolean;
-        /**
-          * Text for the confirm/OK button
-          * @default 'OK'
-         */
-        "confirmText"?: string;
-        /**
-          * Default value for prompt input
-          * @default ''
-         */
-        "defaultValue"?: string;
-        /**
-          * Message text to display (for alert/confirm/prompt types)
-         */
-        "message"?: string;
-        /**
-          * Whether the popup is modal (blocks interaction with page behind)
-          * @default true
-         */
-        "modal"?: boolean;
-        /**
-          * Emitted when the popup is cancelled (Cancel clicked or dismissed)
-         */
-        "onLeCancel"?: (event: LePopupCustomEvent<PopupResult>) => void;
-        /**
-          * Emitted when the popup closes
-         */
-        "onLeClose"?: (event: LePopupCustomEvent<PopupResult>) => void;
-        /**
-          * Emitted when the popup is confirmed (OK clicked)
-         */
-        "onLeConfirm"?: (event: LePopupCustomEvent<PopupResult>) => void;
-        /**
-          * Emitted when the popup opens
-         */
-        "onLeOpen"?: (event: LePopupCustomEvent<void>) => void;
-        /**
-          * Whether the popup is currently visible
-          * @default false
-         */
-        "open"?: boolean;
-        /**
-          * Placeholder text for prompt input
-          * @default ''
-         */
-        "placeholder"?: string;
-        /**
-          * Optional title for the popup header
-         */
-        "popupTitle"?: string;
-        /**
-          * Position of the popup on screen
-          * @default 'center'
-         */
-        "position"?: PopupPosition;
-        /**
-          * Type of popup: alert (OK only), confirm (OK/Cancel), prompt (input + OK/Cancel), custom
-          * @default 'alert'
-         */
-        "type"?: PopupType;
-    }
-    interface LeRoundProgress {
-        /**
-          * @default 0
-         */
-        "padding"?: number;
-        "paths"?: string;
-        /**
-          * @default 0
-         */
-        "value"?: number;
-    }
-    /**
-     * A flexible stack layout component using CSS flexbox.
-     * `le-stack` arranges its children in a row (horizontal) or column (vertical)
-     * with configurable spacing, alignment, and wrapping behavior. Perfect for
-     * creating responsive layouts.
-     * @cssprop --le-stack-gap - Gap between items (defaults to var(--le-space-md))
-     * @csspart stack - The main stack container
-     * @cmsEditable true
-     * @cmsCategory Layout
-     */
-    interface LeStack {
-        /**
-          * Alignment of items on the cross axis
-          * @allowedValues start | center | end | stretch | baseline
-          * @default 'stretch'
-         */
-        "align"?: 'start' | 'center' | 'end' | 'stretch' | 'baseline';
-        /**
-          * Alignment of wrapped lines (only applies when wrap is true)
-          * @allowedValues start | center | end | stretch | space-between | space-around
-          * @default 'stretch'
-         */
-        "alignContent"?: 'start' | 'center' | 'end' | 'stretch' | 'space-between' | 'space-around';
-        /**
-          * Direction of the stack layout
-          * @allowedValues horizontal | vertical
-          * @default 'horizontal'
-         */
-        "direction"?: 'horizontal' | 'vertical';
-        /**
-          * Whether the stack should take full height of its container
-          * @default false
-         */
-        "fullHeight"?: boolean;
-        /**
-          * Whether the stack should take full width of its container
-          * @default false
-         */
-        "fullWidth"?: boolean;
-        /**
-          * Gap between items (CSS value like '8px', '1rem', 'var(--le-space-md)')
-         */
-        "gap"?: string;
-        /**
-          * Distribution of items on the main axis
-          * @allowedValues start | center | end | space-between | space-around | space-evenly
-          * @default 'start'
-         */
-        "justify"?: 'start' | 'center' | 'end' | 'space-between' | 'space-around' | 'space-evenly';
-        /**
-          * Maximum number of items allowed in the stack (for CMS validation)
-          * @min 1
-         */
-        "maxItems"?: number;
-        /**
-          * Padding inside the stack container (CSS value)
-         */
-        "padding"?: string;
-        /**
-          * Whether to reverse the order of items
-          * @default false
-         */
-        "reverse"?: boolean;
-        /**
-          * Whether items should wrap to multiple lines
-          * @default false
-         */
-        "wrap"?: boolean;
-    }
-    /**
-     * A text input component with support for labels, descriptions, icons, and external IDs.
-     * @cssprop --le-input-bg - Input background color
-     * @cssprop --le-input-color - Input text color
-     * @cssprop --le-input-border - Input border style
-     * @cssprop --le-input-border-focus - Input border style when focused
-     * @cssprop --le-input-radius - Input border radius
-     * @cssprop --le-input-padding - Input padding
-     */
-    interface LeStringInput {
-        /**
-          * Whether the input is disabled
-          * @default false
-         */
-        "disabled"?: boolean;
-        /**
-          * External ID for linking with external systems
-         */
-        "externalId"?: string;
-        /**
-          * Icon for the end icon
-         */
-        "iconEnd"?: string;
-        /**
-          * Icon for the start icon
-         */
-        "iconStart"?: string;
-        /**
-          * Label for the input
-         */
-        "label"?: string;
-        /**
-          * Mode of the popover should be 'default' for internal use
-         */
-        "mode"?: 'default' | 'admin';
-        /**
-          * The name of the input
-         */
-        "name"?: string;
-        /**
-          * Emitted when the value changes (on blur or Enter)
-         */
-        "onChange"?: (event: LeStringInputCustomEvent<{ value: string; name: string; externalId: string }>) => void;
-        /**
-          * Emitted when the input value changes (on keystroke)
-         */
-        "onInput"?: (event: LeStringInputCustomEvent<{ value: string; name: string; externalId: string }>) => void;
-        /**
-          * Placeholder text
-         */
-        "placeholder"?: string;
-        /**
-          * Whether the input is read-only
-          * @default false
-         */
-        "readonly"?: boolean;
-        /**
-          * The type of the input (text, email, password, etc.)
-          * @default 'text'
-         */
-        "type"?: 'text' | 'email' | 'password' | 'tel' | 'url';
-        /**
-          * The value of the input
-         */
-        "value"?: string;
-    }
-    /**
-     * A text component with rich text editing capabilities in admin mode.
-     * `le-text` renders semantic text elements (headings, paragraphs, code, quotes)
-     * and provides a Notion-like rich text editor in admin mode with formatting
-     * toolbar for bold, italic, links, and paragraph type selection.
-     * @cssprop --le-text-color - Text color
-     * @cssprop --le-text-font-size - Font size
-     * @cssprop --le-text-line-height - Line height
-     * @cssprop --le-text-font-weight - Font weight
-     * @csspart text - The text container element
-     * @cmsEditable true
-     * @cmsCategory Content
-     */
-    interface LeText {
-        /**
-          * Text alignment
-          * @allowedValues left | center | right | justify
-          * @default 'left'
-         */
-        "align"?: 'left' | 'center' | 'right' | 'justify';
-        /**
-          * Text color (CSS value or theme token)
-         */
-        "color"?: string;
-        /**
-          * Maximum number of lines before truncating (requires truncate=true)
-         */
-        "maxLines"?: number;
-        /**
-          * Whether the text should truncate with ellipsis
-          * @default false
-         */
-        "truncate"?: boolean;
-        /**
-          * The semantic variant/type of text element
-          * @allowedValues p | h1 | h2 | h3 | h4 | h5 | h6 | code | quote | label | small
-          * @default 'p'
-         */
-        "variant"?: 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'code' | 'quote' | 'label' | 'small';
-    }
-    interface LeTurntable {
-        /**
-          * @default 'center'
-         */
-        "center"?: string;
-        /**
-          * @default 0
-         */
-        "value"?: number;
-    }
-    interface IntrinsicElements {
-        "le-box": LeBox;
-        "le-button": LeButton;
-        "le-card": LeCard;
-        "le-checkbox": LeCheckbox;
-        "le-number-input": LeNumberInput;
-        "le-popover": LePopover;
-        "le-popup": LePopup;
-        "le-round-progress": LeRoundProgress;
-        "le-stack": LeStack;
-        "le-string-input": LeStringInput;
-        "le-text": LeText;
-        "le-turntable": LeTurntable;
-    }
-}
-export { LocalJSX as JSX };
-declare module "@stencil/core" {
-    export namespace JSX {
-        interface IntrinsicElements {
-            /**
-             * A flexible box component for use as a flex item within le-stack.
-             * `le-box` wraps content and provides flex item properties like grow, shrink,
-             * basis, and self-alignment. It can also control its internal content alignment.
-             * @cssprop --le-box-bg - Background color
-             * @cssprop --le-box-padding - Padding inside the box
-             * @cssprop --le-box-border-radius - Border radius
-             * @csspart box - The main box container
-             * @csspart content - The inner content wrapper
-             * @cmsEditable true
-             * @cmsCategory Layout
-             */
-            "le-box": LocalJSX.LeBox & JSXBase.HTMLAttributes<HTMLLeBoxElement>;
-            /**
-             * A flexible button component with multiple variants and states.
-             * @cssprop --le-button-bg - Button background color
-             * @cssprop --le-button-color - Button text color
-             * @cssprop --le-button-border-radius - Button border radius
-             * @cssprop --le-button-padding-x - Button horizontal padding
-             * @cssprop --le-button-padding-y - Button vertical padding
-             * @csspart button - The native button element
-             * @csspart content - The button content wrapper
-             * @cmsEditable true
-             * @cmsCategory Actions
-             */
-            "le-button": LocalJSX.LeButton & JSXBase.HTMLAttributes<HTMLLeButtonElement>;
-            /**
-             * A flexible card component with header, content, and footer slots.
-             * The card uses le-slot wrappers for each slot area. In admin mode,
-             * le-slot shows placeholders for CMS editing. In default mode,
-             * le-slot acts as a transparent passthrough.
-             * @cssprop --le-card-bg - Card background color
-             * @cssprop --le-card-border-radius - Card border radius
-             * @cssprop --le-card-shadow - Card box shadow
-             * @cssprop --le-card-padding - Card content padding
-             * @csspart card - The main card container
-             * @csspart header - The card header section
-             * @csspart content - The card content section
-             * @csspart footer - The card footer section
-             * @cmsEditable true
-             * @cmsCategory Layout
-             */
-            "le-card": LocalJSX.LeCard & JSXBase.HTMLAttributes<HTMLLeCardElement>;
-            /**
-             * A checkbox component with support for labels, descriptions, and external IDs.
-             * @cssprop --le-checkbox-size - Size of the checkbox input
-             * @cssprop --le-checkbox-color - Color of the checkbox when checked
-             * @cssprop --le-checkbox-label-color - Color of the label text
-             * @cssprop --le-checkbox-desc-color - Color of the description text
-             */
-            "le-checkbox": LocalJSX.LeCheckbox & JSXBase.HTMLAttributes<HTMLLeCheckboxElement>;
-            /**
-             * A number input component with validation, keyboard controls, and custom spinners.
-             * @cssprop --le-input-bg - Input background color
-             * @cssprop --le-input-color - Input text color
-             * @cssprop --le-input-border - Input border style
-             * @cssprop --le-input-border-focus - Input border style when focused
-             * @cssprop --le-input-border-error - Input border style when invalid
-             * @cssprop --le-input-radius - Input border radius
-             * @cssprop --le-input-padding - Input padding
-             */
-            "le-number-input": LocalJSX.LeNumberInput & JSXBase.HTMLAttributes<HTMLLeNumberInputElement>;
-            /**
-             * A popover component for displaying floating content.
-             * Uses the native HTML Popover API for proper layering with dialogs
-             * and other top-layer elements. Falls back gracefully in older browsers.
-             * @cmsInternal true
-             * @cmsCategory System
-             */
-            "le-popover": LocalJSX.LePopover & JSXBase.HTMLAttributes<HTMLLePopoverElement>;
-            /**
-             * A flexible popup/dialog component for alerts, confirms, prompts, and custom content.
-             * Uses the native HTML <dialog> element for proper modal behavior, accessibility,
-             * and focus management. Can be used declaratively in HTML or programmatically 
-             * via leAlert(), leConfirm(), lePrompt().
-             * @cmsInternal true
-             * @cmsCategory System
-             */
-            "le-popup": LocalJSX.LePopup & JSXBase.HTMLAttributes<HTMLLePopupElement>;
-            "le-round-progress": LocalJSX.LeRoundProgress & JSXBase.HTMLAttributes<HTMLLeRoundProgressElement>;
-            /**
-             * A flexible stack layout component using CSS flexbox.
-             * `le-stack` arranges its children in a row (horizontal) or column (vertical)
-             * with configurable spacing, alignment, and wrapping behavior. Perfect for
-             * creating responsive layouts.
-             * @cssprop --le-stack-gap - Gap between items (defaults to var(--le-space-md))
-             * @csspart stack - The main stack container
-             * @cmsEditable true
-             * @cmsCategory Layout
-             */
-            "le-stack": LocalJSX.LeStack & JSXBase.HTMLAttributes<HTMLLeStackElement>;
-            /**
-             * A text input component with support for labels, descriptions, icons, and external IDs.
-             * @cssprop --le-input-bg - Input background color
-             * @cssprop --le-input-color - Input text color
-             * @cssprop --le-input-border - Input border style
-             * @cssprop --le-input-border-focus - Input border style when focused
-             * @cssprop --le-input-radius - Input border radius
-             * @cssprop --le-input-padding - Input padding
-             */
-            "le-string-input": LocalJSX.LeStringInput & JSXBase.HTMLAttributes<HTMLLeStringInputElement>;
-            /**
-             * A text component with rich text editing capabilities in admin mode.
-             * `le-text` renders semantic text elements (headings, paragraphs, code, quotes)
-             * and provides a Notion-like rich text editor in admin mode with formatting
-             * toolbar for bold, italic, links, and paragraph type selection.
-             * @cssprop --le-text-color - Text color
-             * @cssprop --le-text-font-size - Font size
-             * @cssprop --le-text-line-height - Line height
-             * @cssprop --le-text-font-weight - Font weight
-             * @csspart text - The text container element
-             * @cmsEditable true
-             * @cmsCategory Content
-             */
-            "le-text": LocalJSX.LeText & JSXBase.HTMLAttributes<HTMLLeTextElement>;
-            "le-turntable": LocalJSX.LeTurntable & JSXBase.HTMLAttributes<HTMLLeTurntableElement>;
-        }
-    }
-}