le-kit 0.5.3 → 0.6.0

package/dist/components/le-dropdown-base2.js

@@ -1,366 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host, transformTag } from '@stencil/core/internal/client';
-import { g as generateId } from './utils.js';
-import { d as defineCustomElement$1 } from './le-popover2.js';
-
-const leDropdownBaseCss = () => `:host{display:block;--le-dropdown-list-padding:var(--le-spacing-1);--le-dropdown-empty-padding:var(--le-spacing-4);--le-dropdown-option-radius:var(--le-radius-md);--le-dropdown-font-size:var(--le-font-size-sm);--le-dropdown-option-padding:var(--le-spacing-1) var(--le-spacing-2);--le-dropdown-group-padding:var(--le-spacing-2) var(--le-spacing-2) var(--le-spacing-1);--le-dropdown-group-font-size:var(--le-font-size-xs)}:host([disabled]){pointer-events:none;opacity:0.5}le-popover::part(content){overflow-y:auto;overflow-x:hidden;padding:var(--le-dropdown-list-padding, 0.25rem)}.dropdown-empty{padding:var(--le-dropdown-empty-padding);text-align:center;color:var(--le-color-text-secondary, #9ca3af);font-size:var(--le-dropdown-font-size)}.dropdown-group-header{padding:var(--le-dropdown-group-padding);font-size:var(--le-dropdown-group-font-size);font-weight:700;color:var(--le-color-text-secondary, #9ca3af);letter-spacing:0.05em}.dropdown-list{text-align:initial}.dropdown-separator{height:1px;margin:var(--le-dropdown-separator-margin, 0.25rem 0);background:var(--le-color-border, #e5e7eb)}.dropdown-option{display:flex;align-items:center;gap:var(--le-dropdown-option-gap, 0.5rem);padding:var(--le-dropdown-option-padding);font-size:var(--le-dropdown-font-size, 0.875rem);line-height:1.4;color:var(--le-color-text, #1f2937);border:1px solid transparent;border-radius:var(--le-dropdown-option-radius, 0.25rem);cursor:pointer;user-select:none;transition:background-color 0.1s ease}.dropdown-option:hover,.dropdown-option.is-focused{border-color:var(--le-color-border-hover, #d1d5db)}.dropdown-option.is-disabled{opacity:0.5;cursor:not-allowed}.dropdown-option.is-disabled:hover{background:transparent}.option-checkbox{display:flex;align-items:center;justify-content:center;width:1rem;height:1rem;border:2px solid var(--le-color-border, #d1d5db);border-radius:0.25rem;background:var(--le-color-surface, #fff);flex-shrink:0}.is-selected .option-checkbox{background:var(--le-color-primary, #3b82f6);border-color:var(--le-color-primary, #3b82f6);color:white}.option-checkbox svg{width:0.75rem;height:0.75rem}.option-icon-start,.option-icon-end{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.25rem;height:1.25rem}.option-icon-start img,.option-icon-end img{width:100%;height:100%;object-fit:contain}.option-content{flex:1;min-width:0;display:flex;flex-direction:column}.option-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.option-description{font-size:0.75rem;color:var(--le-color-text-muted, #6b7280);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.option-check{display:flex;align-items:center;justify-content:center;width:1rem;height:1rem;color:var(--le-color-primary, #3b82f6);flex-shrink:0}.option-check svg{width:1rem;height:1rem}`;
-
-const LeDropdownBase = /*@__PURE__*/ proxyCustomElement(class LeDropdownBase extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.leOptionSelect = createEvent(this, "leOptionSelect", 7);
-        this.leDropdownOpen = createEvent(this, "leDropdownOpen", 7);
-        this.leDropdownClose = createEvent(this, "leDropdownClose", 7);
-        /**
-         * The options to display in the dropdown.
-         */
-        this.options = [];
-        /**
-         * Whether multiple selection is allowed.
-         */
-        this.multiple = false;
-        /**
-         * Whether the dropdown is open.
-         */
-        this.open = false;
-        /**
-         * Whether the dropdown is disabled.
-         */
-        this.disabled = false;
-        /**
-         * Current filter query string.
-         */
-        this.filterQuery = '';
-        /**
-         * Placeholder text when no options match filter.
-         */
-        this.emptyText = 'No options';
-        /**
-         * Whether to show checkboxes for multiselect mode.
-         */
-        this.showCheckboxes = true;
-        /**
-         * Maximum height of the dropdown list.
-         */
-        this.maxHeight = '300px';
-        /**
-         * Sets the dropdown to full width of the trigger.
-         */
-        this.fullWidth = false;
-        /**
-         * Whether to close the dropdown when clicking outside.
-         * (used to support combobox with input focus)
-         */
-        this.closeOnClickOutside = true;
-        this.focusedIndex = -1;
-        this.filteredOptions = [];
-        this.triggerWidth = 0;
-        this.handleKeyDown = (e) => {
-            if (!this.open)
-                return;
-            const optionCount = this.filteredOptions.length;
-            switch (e.key) {
-                case 'ArrowDown':
-                    e.preventDefault();
-                    // check for the next non-disabled option and focus
-                    let nextIndex = this.focusedIndex < optionCount - 1 ? this.focusedIndex + 1 : 0;
-                    while (this.filteredOptions[nextIndex].disabled) {
-                        nextIndex = ++nextIndex < optionCount ? nextIndex : 0;
-                    }
-                    this.focusedIndex = nextIndex;
-                    this.scrollToFocused();
-                    break;
-                case 'ArrowUp':
-                    e.preventDefault();
-                    // check for the previous non-disabled option and focus
-                    let prevIndex = this.focusedIndex > 0 ? this.focusedIndex - 1 : optionCount - 1;
-                    while (this.filteredOptions[prevIndex].disabled) {
-                        prevIndex = --prevIndex >= 0 ? prevIndex : optionCount - 1;
-                    }
-                    this.focusedIndex = prevIndex;
-                    this.scrollToFocused();
-                    break;
-                case 'Home':
-                    e.preventDefault();
-                    // check for the first non-disabled option and focus
-                    let firstIndex = 0;
-                    while (this.filteredOptions[firstIndex].disabled) {
-                        firstIndex++;
-                        if (firstIndex >= optionCount) {
-                            firstIndex = -1;
-                            break;
-                        }
-                    }
-                    this.focusedIndex = firstIndex;
-                    this.scrollToFocused();
-                    break;
-                case 'End':
-                    e.preventDefault();
-                    // check for the last non-disabled option and focus
-                    let lastIndex = optionCount - 1;
-                    while (this.filteredOptions[lastIndex].disabled) {
-                        lastIndex--;
-                        if (lastIndex < 0) {
-                            lastIndex = -1;
-                            break;
-                        }
-                    }
-                    this.focusedIndex = lastIndex;
-                    this.scrollToFocused();
-                    break;
-                case 'Enter':
-                case ' ':
-                    e.preventDefault();
-                    if (this.focusedIndex >= 0 && this.focusedIndex < optionCount) {
-                        const option = this.filteredOptions[this.focusedIndex];
-                        if (!option || option.disabled)
-                            return;
-                        this.leOptionSelect.emit({
-                            value: option.value ?? option.label,
-                            option,
-                        });
-                        if (!this.multiple) {
-                            this.hide();
-                        }
-                    }
-                    break;
-                case 'Escape':
-                    e.preventDefault();
-                    this.hide();
-                    break;
-                case 'Tab':
-                    this.hide();
-                    break;
-            }
-        };
-        this.handlePopoverOpen = () => {
-            this.open = true;
-            this.focusedIndex = this.getInitialFocusIndex();
-            this.leDropdownOpen.emit();
-            // Add keyboard listener
-            document.addEventListener('keydown', this.handleKeyDown);
-        };
-        this.handlePopoverClose = () => {
-            this.open = false;
-            this.focusedIndex = -1;
-            this.leDropdownClose.emit();
-            // Remove keyboard listener
-            document.removeEventListener('keydown', this.handleKeyDown);
-        };
-    }
-    handleOptionsChange() {
-        this.updateFilteredOptions();
-    }
-    componentWillLoad() {
-        this.updateFilteredOptions();
-    }
-    updateFilteredOptions() {
-        // Remember previously focused option
-        const focusedOption = this.filteredOptions[this.focusedIndex];
-        if (!this.filterQuery || !this.filterFn) {
-            this.filteredOptions = this.options;
-        }
-        else {
-            this.filteredOptions = this.options.filter(opt => this.filterFn(opt, this.filterQuery));
-        }
-        // try to maintain focus on same option if still present
-        if (focusedOption) {
-            const newIndex = this.filteredOptions.indexOf(focusedOption);
-            this.focusedIndex = newIndex >= 0 ? newIndex : this.getInitialFocusIndex();
-        }
-        else {
-            this.focusedIndex = -1;
-        }
-    }
-    getSelectableOptions() {
-        return this.filteredOptions.filter(opt => !opt.disabled);
-    }
-    isSelected(option) {
-        const optValue = option.value ?? option.label;
-        if (this.multiple && Array.isArray(this.value)) {
-            setTimeout(() => {
-                this.popoverEl?.updatePosition();
-            }, 50);
-            return this.value.includes(optValue);
-        }
-        return this.value === optValue;
-    }
-    handleOptionClick(option, e) {
-        e.preventDefault();
-        e.stopPropagation();
-        if (option.disabled)
-            return;
-        this.leOptionSelect.emit({
-            value: option.value ?? option.label,
-            option,
-        });
-        // Close dropdown for single select
-        if (!this.multiple) {
-            this.hide();
-        }
-    }
-    scrollToFocused() {
-        if (!this.listEl || this.focusedIndex < 0)
-            return;
-        const focusedEl = this.listEl.querySelector(`[data-index="${this.focusedIndex}"]`);
-        if (focusedEl) {
-            focusedEl.scrollIntoView({ block: 'nearest' });
-        }
-    }
-    getInitialFocusIndex() {
-        // Focus on first selected option, or first option
-        const selectableOptions = this.getSelectableOptions();
-        const selectedIndex = selectableOptions.findIndex(opt => this.isSelected(opt));
-        return selectedIndex >= 0 ? selectedIndex : 0;
-    }
-    /**
-     * Opens the dropdown.
-     */
-    async show() {
-        if (this.disabled)
-            return;
-        // Capture trigger width for matching dropdown width
-        const trigger = this.el.querySelector('[slot="trigger"]');
-        if (trigger) {
-            this.triggerWidth = trigger.offsetWidth;
-        }
-        await this.popoverEl?.show();
-    }
-    /**
-     * Closes the dropdown.
-     */
-    async hide() {
-        await this.popoverEl?.hide();
-    }
-    /**
-     * Toggles the dropdown.
-     */
-    async toggle() {
-        if (this.open) {
-            await this.hide();
-        }
-        else {
-            await this.show();
-        }
-    }
-    renderIcon(icon, className) {
-        if (!icon)
-            return null;
-        if (icon.startsWith('http') || icon.startsWith('/')) {
-            return h("img", { class: className, src: icon, alt: "" });
-        }
-        return h("span", { class: className }, icon);
-    }
-    renderOption(option, index) {
-        const isSelected = this.isSelected(option);
-        const isFocused = index === this.focusedIndex;
-        const optionId = option.id || generateId();
-        return (h("div", { class: {
-                'dropdown-option': true,
-                'is-selected': isSelected,
-                'is-focused': isFocused,
-                'is-disabled': !!option.disabled,
-            }, role: "option", id: optionId, "aria-selected": isSelected ? 'true' : 'false', "aria-disabled": option.disabled ? 'true' : undefined, "data-index": index, onClick: e => this.handleOptionClick(option, e), onMouseEnter: () => {
-                if (!option.disabled) {
-                    this.focusedIndex = index;
-                }
-            } }, this.renderIcon(option.iconStart, 'option-icon-start'), h("div", { class: "option-content" }, h("span", { class: "option-label" }, option.label), option.description && h("span", { class: "option-description" }, option.description)), this.renderIcon(option.iconEnd, 'option-icon-end'), (!this.multiple || this.showCheckboxes) && isSelected && (h("span", { class: "option-check" }, h("svg", { viewBox: "0 0 16 16", fill: "currentColor" }, h("path", { d: "M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z" }))))));
-    }
-    renderOptions() {
-        if (this.filteredOptions.length === 0) {
-            return h("div", { class: "dropdown-empty" }, this.emptyText);
-        }
-        // Group options if they have group property
-        const grouped = new Map();
-        const ungrouped = [];
-        this.filteredOptions.forEach(opt => {
-            if (opt.group) {
-                const group = grouped.get(opt.group) || [];
-                group.push(opt);
-                grouped.set(opt.group, group);
-            }
-            else {
-                ungrouped.push(opt);
-            }
-        });
-        // Build flat list with group headers for index tracking
-        let globalIndex = 0;
-        const elements = [];
-        // Render ungrouped options first
-        ungrouped.forEach(opt => {
-            if (opt.separator === 'before') {
-                elements.push(h("div", { class: "dropdown-separator", role: "separator" }));
-            }
-            elements.push(this.renderOption(opt, globalIndex++));
-            if (opt.separator === 'after') {
-                elements.push(h("div", { class: "dropdown-separator", role: "separator" }));
-            }
-        });
-        // Render grouped options
-        grouped.forEach((options, groupLabel) => {
-            elements.push(h("div", { class: "dropdown-group-header", role: "presentation" }, groupLabel));
-            options.forEach(opt => {
-                elements.push(this.renderOption(opt, globalIndex++));
-            });
-        });
-        return elements;
-    }
-    render() {
-        const dropdownWidth = this.width || (this.triggerWidth ? `${this.triggerWidth}px` : undefined);
-        return (h(Host, { key: '71c3537d6234aebb8c18fb6c07e5a751568a4b87' }, h("le-popover", { key: 'e02fcd7454cae5a9c197a509d18cd7b91e49fc9e', ref: el => (this.popoverEl = el), position: "bottom", align: "start", showClose: false, closeOnClickOutside: this.closeOnClickOutside, closeOnEscape: true, offset: 4, width: dropdownWidth, minWidth: "150px", "trigger-full-width": this.fullWidth, onLePopoverOpen: this.handlePopoverOpen, onLePopoverClose: this.handlePopoverClose }, h("slot", { key: 'f1a9e3145119f1cfc1b8a535b98b0858758c6265', name: "trigger", slot: "trigger" }), h("slot", { key: '8dd6126a610e167fb2b3c2593677f70c387bd275', name: "header" }), h("div", { key: '708b3916132c36f736f8a88e3408d482a50610fb', class: "dropdown-list", role: "listbox", "aria-multiselectable": this.multiple ? 'true' : undefined, ref: el => (this.listEl = el), style: { maxHeight: this.maxHeight } }, this.renderOptions()))));
-    }
-    get el() { return this; }
-    static get watchers() { return {
-        "options": ["handleOptionsChange"],
-        "filterQuery": ["handleOptionsChange"]
-    }; }
-    static get style() { return leDropdownBaseCss(); }
-}, [257, "le-dropdown-base", {
-        "options": [16],
-        "value": [8],
-        "multiple": [4],
-        "open": [1540],
-        "disabled": [516],
-        "filterFn": [16],
-        "filterQuery": [1, "filter-query"],
-        "emptyText": [1, "empty-text"],
-        "showCheckboxes": [4, "show-checkboxes"],
-        "maxHeight": [1, "max-height"],
-        "width": [1],
-        "fullWidth": [4, "full-width"],
-        "closeOnClickOutside": [4, "close-on-click-outside"],
-        "focusedIndex": [32],
-        "filteredOptions": [32],
-        "show": [64],
-        "hide": [64],
-        "toggle": [64]
-    }, undefined, {
-        "options": ["handleOptionsChange"],
-        "filterQuery": ["handleOptionsChange"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["le-dropdown-base", "le-popover"];
-    components.forEach(tagName => { switch (tagName) {
-        case "le-dropdown-base":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), LeDropdownBase);
-            }
-            break;
-        case "le-popover":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { LeDropdownBase as L, defineCustomElement as d };
-//# sourceMappingURL=le-dropdown-base2.js.map
-
-//# sourceMappingURL=le-dropdown-base2.js.map

package/dist/components/le-dropdown-base2.js.map

@@ -1 +0,0 @@
-{"file":"le-dropdown-base2.js","mappings":"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","names":["__stencil_proxyCustomElement"],"sources":["src/components/le-dropdown-base/le-dropdown-base.css?tag=le-dropdown-base&encapsulation=shadow","src/components/le-dropdown-base/le-dropdown-base.tsx"],"sourcesContent":["/**\n * le-dropdown-base component styles\n *\n * Internal component - minimal styling, meant to be customized\n * by wrapper components (le-select, le-combobox, etc.)\n */\n\n:host {\n  display: block;\n  --le-dropdown-list-padding: var(--le-spacing-1);\n  --le-dropdown-empty-padding: var(--le-spacing-4);\n  --le-dropdown-option-radius: var(--le-radius-md);\n  --le-dropdown-font-size: var(--le-font-size-sm);\n  --le-dropdown-option-padding: var(--le-spacing-1) var(--le-spacing-2);\n  --le-dropdown-group-padding: var(--le-spacing-2) var(--le-spacing-2) var(--le-spacing-1);\n  --le-dropdown-group-font-size: var(--le-font-size-xs);\n}\n\n:host([disabled]) {\n  pointer-events: none;\n  opacity: 0.5;\n}\n\n/* Dropdown list container */\nle-popover::part(content) {\n  overflow-y: auto;\n  overflow-x: hidden;\n  padding: var(--le-dropdown-list-padding, 0.25rem);\n}\n\n/* Empty state */\n.dropdown-empty {\n  padding: var(--le-dropdown-empty-padding);\n  text-align: center;\n  color: var(--le-color-text-secondary, #9ca3af);\n  font-size: var(--le-dropdown-font-size);\n}\n\n/* Group header */\n.dropdown-group-header {\n  padding: var(--le-dropdown-group-padding);\n  font-size: var(--le-dropdown-group-font-size);\n  font-weight: 700;\n  color: var(--le-color-text-secondary, #9ca3af);\n  letter-spacing: 0.05em;\n}\n\n.dropdown-list {\n  text-align: initial;\n}\n\n/* Separator */\n.dropdown-separator {\n  height: 1px;\n  margin: var(--le-dropdown-separator-margin, 0.25rem 0);\n  background: var(--le-color-border, #e5e7eb);\n}\n\n/* Option item */\n.dropdown-option {\n  display: flex;\n  align-items: center;\n  gap: var(--le-dropdown-option-gap, 0.5rem);\n  padding: var(--le-dropdown-option-padding);\n  font-size: var(--le-dropdown-font-size, 0.875rem);\n  line-height: 1.4;\n  color: var(--le-color-text, #1f2937);\n  border: 1px solid transparent;\n  border-radius: var(--le-dropdown-option-radius, 0.25rem);\n  cursor: pointer;\n  user-select: none;\n  transition: background-color 0.1s ease;\n}\n\n.dropdown-option:hover,\n.dropdown-option.is-focused {\n  border-color: var(--le-color-border-hover, #d1d5db);\n}\n\n.dropdown-option.is-disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.dropdown-option.is-disabled:hover {\n  background: transparent;\n}\n\n/* Checkbox for multiselect */\n.option-checkbox {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1rem;\n  height: 1rem;\n  border: 2px solid var(--le-color-border, #d1d5db);\n  border-radius: 0.25rem;\n  background: var(--le-color-surface, #fff);\n  flex-shrink: 0;\n}\n\n.is-selected .option-checkbox {\n  background: var(--le-color-primary, #3b82f6);\n  border-color: var(--le-color-primary, #3b82f6);\n  color: white;\n}\n\n.option-checkbox svg {\n  width: 0.75rem;\n  height: 0.75rem;\n}\n\n/* Icons */\n.option-icon-start,\n.option-icon-end {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: 1.25rem;\n  height: 1.25rem;\n}\n\n.option-icon-start img,\n.option-icon-end img {\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n/* Content */\n.option-content {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n}\n\n.option-label {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.option-description {\n  font-size: 0.75rem;\n  color: var(--le-color-text-muted, #6b7280);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* Check mark for single select */\n.option-check {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1rem;\n  height: 1rem;\n  color: var(--le-color-primary, #3b82f6);\n  flex-shrink: 0;\n}\n\n.option-check svg {\n  width: 1rem;\n  height: 1rem;\n}\n","import {\n  Component,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Method,\n  Element,\n  Watch,\n  h,\n  Host,\n} from '@stencil/core';\nimport { LeOption, LeOptionValue, LeOptionSelectDetail } from '../../types/options';\nimport { generateId } from '../../utils/utils';\n\n/**\n * Internal dropdown base component that provides shared functionality\n * for select, combobox, and multiselect components.\n *\n * Wraps le-popover for positioning and provides:\n * - Option list rendering with groups\n * - Keyboard navigation (↑↓, Enter, Escape, Home/End)\n * - Option filtering support\n * - Single and multi-select modes\n *\n * @cmsInternal true\n * @cmsCategory System\n *\n * @slot trigger - The element that triggers the dropdown\n */\n@Component({\n  tag: 'le-dropdown-base',\n  styleUrl: 'le-dropdown-base.css',\n  shadow: true,\n})\nexport class LeDropdownBase {\n  @Element() el: HTMLElement;\n\n  /**\n   * The options to display in the dropdown.\n   */\n  @Prop() options: LeOption[] = [];\n\n  /**\n   * Current value(s) - single value or array for multiselect.\n   */\n  @Prop() value?: LeOptionValue | LeOptionValue[];\n\n  /**\n   * Whether multiple selection is allowed.\n   */\n  @Prop() multiple: boolean = false;\n\n  /**\n   * Whether the dropdown is open.\n   */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /**\n   * Whether the dropdown is disabled.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Filter function for options.\n   * Return true to include the option.\n   */\n  @Prop() filterFn?: (option: LeOption, query: string) => boolean;\n\n  /**\n   * Current filter query string.\n   */\n  @Prop() filterQuery: string = '';\n\n  /**\n   * Placeholder text when no options match filter.\n   */\n  @Prop() emptyText: string = 'No options';\n\n  /**\n   * Whether to show checkboxes for multiselect mode.\n   */\n  @Prop() showCheckboxes: boolean = true;\n\n  /**\n   * Maximum height of the dropdown list.\n   */\n  @Prop() maxHeight: string = '300px';\n\n  /**\n   * Width of the dropdown. If not set, matches trigger width.\n   */\n  @Prop() width?: string;\n\n  /**\n   * Sets the dropdown to full width of the trigger.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * Whether to close the dropdown when clicking outside.\n   * (used to support combobox with input focus)\n   */\n  @Prop() closeOnClickOutside: boolean = true;\n\n  /**\n   * Emitted when an option is selected.\n   */\n  @Event() leOptionSelect: EventEmitter<LeOptionSelectDetail>;\n\n  /**\n   * Emitted when the dropdown opens.\n   */\n  @Event() leDropdownOpen: EventEmitter<void>;\n\n  /**\n   * Emitted when the dropdown closes.\n   */\n  @Event() leDropdownClose: EventEmitter<void>;\n\n  @State() private focusedIndex: number = -1;\n  @State() private filteredOptions: LeOption[] = [];\n\n  private popoverEl?: HTMLLePopoverElement;\n  private listEl?: HTMLElement;\n  private triggerWidth: number = 0;\n\n  @Watch('options')\n  @Watch('filterQuery')\n  handleOptionsChange() {\n    this.updateFilteredOptions();\n  }\n\n  componentWillLoad() {\n    this.updateFilteredOptions();\n  }\n\n  private updateFilteredOptions() {\n    // Remember previously focused option\n    const focusedOption = this.filteredOptions[this.focusedIndex];\n\n    if (!this.filterQuery || !this.filterFn) {\n      this.filteredOptions = this.options;\n    } else {\n      this.filteredOptions = this.options.filter(opt => this.filterFn!(opt, this.filterQuery));\n    }\n\n    // try to maintain focus on same option if still present\n    if (focusedOption) {\n      const newIndex = this.filteredOptions.indexOf(focusedOption);\n      this.focusedIndex = newIndex >= 0 ? newIndex : this.getInitialFocusIndex();\n    } else {\n      this.focusedIndex = -1;\n    }\n  }\n\n  private getSelectableOptions(): LeOption[] {\n    return this.filteredOptions.filter(opt => !opt.disabled);\n  }\n\n  private isSelected(option: LeOption): boolean {\n    const optValue = option.value ?? option.label;\n    if (this.multiple && Array.isArray(this.value)) {\n      setTimeout(() => {\n        this.popoverEl?.updatePosition();\n      }, 50);\n      return this.value.includes(optValue);\n    }\n    return this.value === optValue;\n  }\n\n  private handleOptionClick(option: LeOption, e: MouseEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n\n    if (option.disabled) return;\n\n    this.leOptionSelect.emit({\n      value: option.value ?? option.label,\n      option,\n    });\n\n    // Close dropdown for single select\n    if (!this.multiple) {\n      this.hide();\n    }\n  }\n\n  private handleKeyDown = (e: KeyboardEvent) => {\n    if (!this.open) return;\n\n    const optionCount = this.filteredOptions.length;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault();\n        // check for the next non-disabled option and focus\n        let nextIndex = this.focusedIndex < optionCount - 1 ? this.focusedIndex + 1 : 0;\n        while (this.filteredOptions[nextIndex].disabled) {\n          nextIndex = ++nextIndex < optionCount ? nextIndex : 0;\n        }\n        this.focusedIndex = nextIndex;\n        this.scrollToFocused();\n        break;\n\n      case 'ArrowUp':\n        e.preventDefault();\n        // check for the previous non-disabled option and focus\n        let prevIndex = this.focusedIndex > 0 ? this.focusedIndex - 1 : optionCount - 1;\n        while (this.filteredOptions[prevIndex].disabled) {\n          prevIndex = --prevIndex >= 0 ? prevIndex : optionCount - 1;\n        }\n        this.focusedIndex = prevIndex;\n        this.scrollToFocused();\n        break;\n\n      case 'Home':\n        e.preventDefault();\n        // check for the first non-disabled option and focus\n        let firstIndex = 0;\n        while (this.filteredOptions[firstIndex].disabled) {\n          firstIndex++;\n          if (firstIndex >= optionCount) {\n            firstIndex = -1;\n            break;\n          }\n        }\n        this.focusedIndex = firstIndex;\n        this.scrollToFocused();\n        break;\n\n      case 'End':\n        e.preventDefault();\n        // check for the last non-disabled option and focus\n        let lastIndex = optionCount - 1;\n        while (this.filteredOptions[lastIndex].disabled) {\n          lastIndex--;\n          if (lastIndex < 0) {\n            lastIndex = -1;\n            break;\n          }\n        }\n        this.focusedIndex = lastIndex;\n        this.scrollToFocused();\n        break;\n\n      case 'Enter':\n      case ' ':\n        e.preventDefault();\n        if (this.focusedIndex >= 0 && this.focusedIndex < optionCount) {\n          const option = this.filteredOptions[this.focusedIndex];\n          if (!option || option.disabled) return;\n          this.leOptionSelect.emit({\n            value: option.value ?? option.label,\n            option,\n          });\n          if (!this.multiple) {\n            this.hide();\n          }\n        }\n        break;\n\n      case 'Escape':\n        e.preventDefault();\n        this.hide();\n        break;\n\n      case 'Tab':\n        this.hide();\n        break;\n    }\n  };\n\n  private scrollToFocused() {\n    if (!this.listEl || this.focusedIndex < 0) return;\n\n    const focusedEl = this.listEl.querySelector(\n      `[data-index=\"${this.focusedIndex}\"]`,\n    ) as HTMLElement;\n    if (focusedEl) {\n      focusedEl.scrollIntoView({ block: 'nearest' });\n    }\n  }\n\n  private handlePopoverOpen = () => {\n    this.open = true;\n    this.focusedIndex = this.getInitialFocusIndex();\n    this.leDropdownOpen.emit();\n\n    // Add keyboard listener\n    document.addEventListener('keydown', this.handleKeyDown);\n  };\n\n  private handlePopoverClose = () => {\n    this.open = false;\n    this.focusedIndex = -1;\n    this.leDropdownClose.emit();\n\n    // Remove keyboard listener\n    document.removeEventListener('keydown', this.handleKeyDown);\n  };\n\n  private getInitialFocusIndex(): number {\n    // Focus on first selected option, or first option\n    const selectableOptions = this.getSelectableOptions();\n    const selectedIndex = selectableOptions.findIndex(opt => this.isSelected(opt));\n    return selectedIndex >= 0 ? selectedIndex : 0;\n  }\n\n  /**\n   * Opens the dropdown.\n   */\n  @Method()\n  async show() {\n    if (this.disabled) return;\n\n    // Capture trigger width for matching dropdown width\n    const trigger = this.el.querySelector('[slot=\"trigger\"]') as HTMLElement;\n    if (trigger) {\n      this.triggerWidth = trigger.offsetWidth;\n    }\n\n    await this.popoverEl?.show();\n  }\n\n  /**\n   * Closes the dropdown.\n   */\n  @Method()\n  async hide() {\n    await this.popoverEl?.hide();\n  }\n\n  /**\n   * Toggles the dropdown.\n   */\n  @Method()\n  async toggle() {\n    if (this.open) {\n      await this.hide();\n    } else {\n      await this.show();\n    }\n  }\n\n  private renderIcon(icon: string | undefined, className: string) {\n    if (!icon) return null;\n\n    if (icon.startsWith('http') || icon.startsWith('/')) {\n      return <img class={className} src={icon} alt=\"\" />;\n    }\n\n    return <span class={className}>{icon}</span>;\n  }\n\n  private renderOption(option: LeOption, index: number) {\n    const isSelected = this.isSelected(option);\n    const isFocused = index === this.focusedIndex;\n    const optionId = option.id || generateId();\n\n    return (\n      <div\n        class={{\n          'dropdown-option': true,\n          'is-selected': isSelected,\n          'is-focused': isFocused,\n          'is-disabled': !!option.disabled,\n        }}\n        role=\"option\"\n        id={optionId}\n        aria-selected={isSelected ? 'true' : 'false'}\n        aria-disabled={option.disabled ? 'true' : undefined}\n        data-index={index}\n        onClick={e => this.handleOptionClick(option, e)}\n        onMouseEnter={() => {\n          if (!option.disabled) {\n            this.focusedIndex = index;\n          }\n        }}\n      >\n        {this.renderIcon(option.iconStart, 'option-icon-start')}\n        <div class=\"option-content\">\n          <span class=\"option-label\">{option.label}</span>\n          {option.description && <span class=\"option-description\">{option.description}</span>}\n        </div>\n        {this.renderIcon(option.iconEnd, 'option-icon-end')}\n        {(!this.multiple || this.showCheckboxes) && isSelected && (\n          <span class=\"option-check\">\n            <svg viewBox=\"0 0 16 16\" fill=\"currentColor\">\n              <path d=\"M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z\" />\n            </svg>\n          </span>\n        )}\n      </div>\n    );\n  }\n\n  private renderOptions() {\n    if (this.filteredOptions.length === 0) {\n      return <div class=\"dropdown-empty\">{this.emptyText}</div>;\n    }\n\n    // Group options if they have group property\n    const grouped = new Map<string, LeOption[]>();\n    const ungrouped: LeOption[] = [];\n\n    this.filteredOptions.forEach(opt => {\n      if (opt.group) {\n        const group = grouped.get(opt.group) || [];\n        group.push(opt);\n        grouped.set(opt.group, group);\n      } else {\n        ungrouped.push(opt);\n      }\n    });\n\n    // Build flat list with group headers for index tracking\n    let globalIndex = 0;\n    const elements: any[] = [];\n\n    // Render ungrouped options first\n    ungrouped.forEach(opt => {\n      if (opt.separator === 'before') {\n        elements.push(<div class=\"dropdown-separator\" role=\"separator\" />);\n      }\n      elements.push(this.renderOption(opt, globalIndex++));\n      if (opt.separator === 'after') {\n        elements.push(<div class=\"dropdown-separator\" role=\"separator\" />);\n      }\n    });\n\n    // Render grouped options\n    grouped.forEach((options, groupLabel) => {\n      elements.push(\n        <div class=\"dropdown-group-header\" role=\"presentation\">\n          {groupLabel}\n        </div>,\n      );\n      options.forEach(opt => {\n        elements.push(this.renderOption(opt, globalIndex++));\n      });\n    });\n\n    return elements;\n  }\n\n  render() {\n    const dropdownWidth = this.width || (this.triggerWidth ? `${this.triggerWidth}px` : undefined);\n\n    return (\n      <Host>\n        <le-popover\n          ref={el => (this.popoverEl = el)}\n          position=\"bottom\"\n          align=\"start\"\n          showClose={false}\n          closeOnClickOutside={this.closeOnClickOutside}\n          closeOnEscape={true}\n          offset={4}\n          width={dropdownWidth}\n          minWidth=\"150px\"\n          trigger-full-width={this.fullWidth}\n          onLePopoverOpen={this.handlePopoverOpen}\n          onLePopoverClose={this.handlePopoverClose}\n        >\n          <slot name=\"trigger\" slot=\"trigger\" />\n          <slot name=\"header\" />\n          <div\n            class=\"dropdown-list\"\n            role=\"listbox\"\n            aria-multiselectable={this.multiple ? 'true' : undefined}\n            ref={el => (this.listEl = el)}\n            style={{ maxHeight: this.maxHeight }}\n          >\n            {this.renderOptions()}\n          </div>\n        </le-popover>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/le-header-placeholder.d.ts

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

package/dist/components/le-header-placeholder.js

@@ -1,37 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host, transformTag } from '@stencil/core/internal/client';
-
-const LeHeaderPlaceholder$1 = /*@__PURE__*/ proxyCustomElement(class LeHeaderPlaceholder extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-    }
-    render() {
-        return (h(Host, { key: 'b026c810ccb0d5c8df7cdc35a3830ebdf676c614', "aria-hidden": "true", style: {
-                display: 'block',
-                height: 'var(--le-header-height, 64px)',
-            } }));
-    }
-}, [256, "le-header-placeholder"]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["le-header-placeholder"];
-    components.forEach(tagName => { switch (tagName) {
-        case "le-header-placeholder":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), LeHeaderPlaceholder$1);
-            }
-            break;
-    } });
-}
-
-const LeHeaderPlaceholder = LeHeaderPlaceholder$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { LeHeaderPlaceholder, defineCustomElement };
-//# sourceMappingURL=le-header-placeholder.js.map
-
-//# sourceMappingURL=le-header-placeholder.js.map

package/dist/components/le-header-placeholder.js.map

@@ -1 +0,0 @@
-{"file":"le-header-placeholder.js","mappings":";;MAgBaA,qBAAmB,iBAAAC,kBAAA,CAAA,MAAA,mBAAA,SAAA,WAAA,CAAA;;;;;;;IAC9B,MAAM,GAAA;AACJ,QAAA,QACE,CAAC,CAAA,IAAI,oEACS,MAAM,EAClB,KAAK,EAAE;AACL,gBAAA,OAAO,EAAE,OAAO;AAChB,gBAAA,MAAM,EAAE,+BAA+B;aACxC,EAAA,CACD;;;;;;;;;;;;;;;;;;;;;;","names":["LeHeaderPlaceholder","__stencil_proxyCustomElement"],"sources":["src/components/le-header-placeholder/le-header-placeholder.tsx"],"sourcesContent":["import { Component, h, Host } from '@stencil/core';\n\n/**\n * Placeholder for `le-header`.\n *\n * Reserves space using the global CSS variable `--le-header-height`.\n * The header component updates that variable when it renders.\n *\n * @cssprop --le-header-height - Published header height (px)\n *\n * @cmsInternal true\n */\n@Component({\n  tag: 'le-header-placeholder',\n  shadow: false,\n})\nexport class LeHeaderPlaceholder {\n  render() {\n    return (\n      <Host\n        aria-hidden=\"true\"\n        style={{\n          display: 'block',\n          height: 'var(--le-header-height, 64px)',\n        }}\n      />\n    );\n  }\n}\n"],"version":3}

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

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