le-kit 0.5.2 → 0.5.3

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

@@ -1 +1 @@
-{"file":"le-multiselect.js","mappings":"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","names":["LeMultiselect","__stencil_proxyCustomElement"],"sources":["src/components/le-multiselect/le-multiselect.css?tag=le-multiselect&encapsulation=shadow","src/components/le-multiselect/le-multiselect.tsx"],"sourcesContent":["/**\n * le-multiselect component styles\n *\n * CSS Custom Properties:\n * --le-multiselect-min-height\n * --le-multiselect-padding\n * --le-multiselect-font-size\n * --le-multiselect-border-radius\n * --le-multiselect-border-color\n * --le-multiselect-bg\n * --le-multiselect-color\n */\n\n:host {\n  display: inline-block;\n  min-width: 250px;\n\n  --le-multiselect-min-height: 0;\n  --le-multiselect-padding: var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-2);\n  --le-multiselect-border-color: var(--le-color-primary, #3b82f6);\n}\n\n:host([disabled]) {\n  opacity: 0.5;\n  pointer-events: none;\n}\n\n/* Trigger wrapper */\n.multiselect-trigger {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 0.5rem;\n  width: 100%;\n  min-height: var(--le-multiselect-min-height);\n  padding: var(--le-multiselect-padding);\n  line-height: var(--le-line-height-tight);\n  background: var(--le-multiselect-bg, var(--le-color-surface, #fff));\n  border: 1px solid color-mix(in srgb, var(--le-multiselect-border-color) 33%, transparent);\n  border-radius: var(--le-multiselect-border-radius, 0.375rem);\n  cursor: pointer;\n  transition: border-color 0.15s ease, box-shadow 0.15s ease;\n}\n\n.multiselect-trigger:hover:not(.is-disabled),\n:host(:focus-within) .multiselect-trigger:not(.is-disabled) {\n  border-color: var(--le-multiselect-border-color);\n}\n\n:host(:focus-within) .multiselect-trigger {\n  outline: 2px solid var(--le-color-focus);\n  outline-offset: 2px;\n}\n:host([full-width]) {\n  width: 100%;\n}\n\n.multiselect-trigger.is-open {\n  border-color: var(--le-color-primary, #3b82f6);\n}\n\n.multiselect-trigger.is-disabled {\n  cursor: not-allowed;\n  background: var(--le-color-surface-disabled, #f9fafb);\n}\n\n/* Placeholder */\n.multiselect-placeholder {\n  color: color-mix(in srgb, var(--le-color-text-secondary) 66%, transparent);\n}\n\n/* Tags container */\n.multiselect-tags {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.25rem;\n  flex: 1;\n  min-width: 0;\n}\n\n/* Actions (clear + arrow) */\n.multiselect-actions {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n  flex-shrink: 0;\n}\n\n/* Clear button */\n.multiselect-clear {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1.5rem;\n  height: 1.5rem;\n  padding: 0;\n  background: transparent;\n  color: var(--le-color-primary, #3b82f6);\n  border: none;\n  border-radius: 0.25rem;\n  cursor: pointer;\n  opacity: 0.6;\n  transition: opacity 0.15s ease, background-color 0.15s ease;\n}\n\n.multiselect-clear:hover {\n  opacity: 1;\n  background: var(--le-color-surface-hover, #f3f4f6);\n}\n\n.multiselect-clear svg {\n  width: 0.875rem;\n  height: 0.875rem;\n}\n\n/* Arrow icon */\n.multiselect-arrow {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1.5rem;\n  height: 1rem;\n  color: var(--le-color-primary, #3b82f6);\n  transition: transform 0.2s ease;\n}\n\n.multiselect-arrow svg {\n  width: 1rem;\n  height: 1rem;\n}\n\n.multiselect-trigger.is-open .multiselect-arrow {\n  transform: rotate(180deg);\n}\n\n/* Search in dropdown */\n.search-input::part(container):focus-within {\n  outline: none !important;\n}\n.search-input {\n  --le-input-radius: var(--le-radius-md);\n}\n\n/* Status message */\n.multiselect-status {\n  display: block;\n  margin-top: 0.25rem;\n  font-size: 0.75rem;\n  color: var(--le-color-text-muted, #6b7280);\n}\n\n/* Size variants */\n:host([size='small']) .multiselect-trigger {\n  --le-multiselect-min-height: 2rem;\n  --le-multiselect-padding: 0.25rem 0.375rem;\n  --le-multiselect-font-size: 0.75rem;\n}\n\n:host([size='large']) .multiselect-trigger {\n  --le-multiselect-min-height: 3rem;\n  --le-multiselect-padding: 0.5rem 0.625rem;\n  --le-multiselect-font-size: 1rem;\n}\n","import {\n  Component,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Method,\n  Element,\n  Watch,\n  h,\n} from '@stencil/core';\nimport {\n  LeOption,\n  LeOptionValue,\n  LeMultiOptionSelectDetail,\n  LeOptionSelectDetail,\n} from '../../types/options';\n\n/**\n * A multiselect component for selecting multiple options.\n *\n * Displays selected items as tags with optional search filtering.\n *\n * @cmsEditable true\n * @cmsCategory Form\n *\n * @example Basic multiselect\n * ```html\n * <le-multiselect\n *   placeholder=\"Select options...\"\n *   options='[{\"label\": \"Red\"}, {\"label\": \"Green\"}, {\"label\": \"Blue\"}]'\n * ></le-multiselect>\n * ```\n *\n * @example With max selections\n * ```html\n * <le-multiselect\n *   max-selections=\"3\"\n *   options='[{\"label\": \"Option 1\"}, {\"label\": \"Option 2\"}, {\"label\": \"Option 3\"}, {\"label\": \"Option 4\"}]'\n * ></le-multiselect>\n * ```\n *\n * @example With search\n * ```html\n * <le-multiselect\n *   searchable\n *   placeholder=\"Search and select...\"\n *   options='[{\"label\": \"Apple\"}, {\"label\": \"Banana\"}, {\"label\": \"Cherry\"}]'\n * ></le-multiselect>\n * ```\n */\n@Component({\n  tag: 'le-multiselect',\n  styleUrl: 'le-multiselect.css',\n  shadow: true,\n})\nexport class LeMultiselect {\n  @Element() el: HTMLElement;\n\n  /**\n   * The options to display in the dropdown.\n   */\n  @Prop() options: LeOption[] | string = [];\n\n  /**\n   * The currently selected values.\n   */\n  @Prop({ mutable: true }) value: LeOptionValue[] = [];\n\n  /**\n   * Placeholder text when no options are selected.\n   */\n  @Prop() placeholder: string = 'Select options...';\n\n  /**\n   * Whether the multiselect is disabled.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Whether selection is required.\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * Name attribute for form submission.\n   */\n  @Prop() name?: string;\n\n  /**\n   * Whether the multiselect should take full width of its container.\n   */\n  @Prop({ reflect: true }) fullWidth: boolean = false;\n\n  /**\n   * Size variant of the multiselect.\n   */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Maximum number of selections allowed.\n   */\n  @Prop() maxSelections?: number;\n\n  /**\n   * Labels for the \"Select All\" option.\n   */\n  @State() private selectAllLabel: string = 'Select All';\n  @State() private deselectAllLabel: string = 'Deselect All';\n\n  /**\n   * Whether to show a \"Select All\" option.\n   * Also accepts a string or array of strings to customize the label(s).\n   */\n  @Prop({ mutable: true }) showSelectAll: boolean | string | string[] = false;\n\n  /**\n   * Whether the input is searchable.\n   */\n  @Prop() searchable: boolean = false;\n\n  /**\n   * Text to show when no options match the search.\n   */\n  @Prop() emptyText: string = 'No results found';\n\n  /**\n   * Whether the dropdown is currently open.\n   */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /**\n   * Emitted when the selected values change.\n   */\n  @Event() leChange: EventEmitter<LeMultiOptionSelectDetail>;\n\n  /**\n   * Emitted when the dropdown opens.\n   */\n  @Event() leOpen: EventEmitter<void>;\n\n  /**\n   * Emitted when the dropdown closes.\n   */\n  @Event() leClose: EventEmitter<void>;\n\n  @State() private selectedOptions: LeOption[] = [];\n  @State() private searchQuery: string = '';\n\n  private dropdownEl?: HTMLLeDropdownBaseElement;\n  private inputEl?: HTMLInputElement;\n\n  @Watch('value')\n  handleValueChange() {\n    this.updateSelectedOptions();\n  }\n\n  @Watch('options')\n  handleOptionsChange() {\n    this.updateSelectedOptions();\n  }\n\n  @Watch('showSelectAll')\n  handleShowSelectAllChange(newValue: boolean | string | string[]) {\n    if (typeof newValue !== 'boolean' && typeof newValue !== 'string') {\n      this.showSelectAll = false;\n    } else if (typeof newValue === 'boolean') {\n      this.showSelectAll = newValue;\n    } else if (Array.isArray(newValue)) {\n      this.showSelectAll = true;\n      this.selectAllLabel = newValue[0];\n      this.deselectAllLabel = newValue[1] || newValue[0];\n    } else if (typeof newValue === 'string') {\n      this.showSelectAll = true;\n      try {\n        const parsed = JSON.parse(newValue);\n        if (Array.isArray(parsed) && parsed.every(item => typeof item === 'string')) {\n          this.selectAllLabel = parsed[0];\n          this.deselectAllLabel = parsed[1] || parsed[0];\n        } else {\n          this.selectAllLabel = newValue;\n          this.deselectAllLabel = newValue;\n        }\n      } catch {\n        this.selectAllLabel = newValue;\n        this.deselectAllLabel = newValue;\n      }\n    }\n  }\n\n  componentWillLoad() {\n    this.updateSelectedOptions();\n    this.handleShowSelectAllChange(this.showSelectAll);\n  }\n\n  private get parsedOptions(): LeOption[] {\n    if (typeof this.options === 'string') {\n      try {\n        return JSON.parse(this.options);\n      } catch {\n        return [];\n      }\n    }\n    return this.options;\n  }\n\n  private get effectiveOptions(): LeOption[] {\n    let options = [...this.parsedOptions];\n\n    // Add \"Select All\" option if enabled\n    if (this.showSelectAll && options.length > 0) {\n      const allSelected =\n        this.selectedOptions.length === this.parsedOptions.filter(opt => !opt.disabled).length;\n      options = [\n        {\n          label: allSelected ? this.deselectAllLabel : this.selectAllLabel,\n          value: '__select_all__',\n          iconStart: allSelected ? '✕' : '⇣',\n        },\n        ...options,\n      ];\n    }\n\n    return options;\n  }\n\n  private updateSelectedOptions() {\n    const valueArray = Array.isArray(this.value) ? this.value : [];\n    this.selectedOptions = this.parsedOptions.filter(opt =>\n      valueArray.includes(opt.value ?? opt.label),\n    );\n  }\n\n  private filterOption = (option: LeOption, query: string): boolean => {\n    if (!query) return true;\n    // Always show \"Select All\" option\n    if (option.value === '__select_all__') return true;\n\n    const searchLower = query.toLowerCase();\n    return (\n      option.label.toLowerCase().includes(searchLower) ||\n      (option.description?.toLowerCase().includes(searchLower) ?? false)\n    );\n  };\n\n  private handleOptionSelect = (e: CustomEvent<LeOptionSelectDetail>) => {\n    const { value } = e.detail;\n\n    const enabledOptions = this.parsedOptions.filter(opt => !opt.disabled);\n    if (enabledOptions.length === 0) return;\n\n    // Handle \"Select All\" option\n    if (value === '__select_all__') {\n      if (this.selectedOptions.length === enabledOptions.length) {\n        // Deselect all\n        this.value = [];\n      } else {\n        // Select all (respect maxSelections)\n        const selectableOptions = this.maxSelections\n          ? enabledOptions.slice(0, this.maxSelections)\n          : enabledOptions;\n        this.value = selectableOptions.map(opt => opt.value ?? opt.label);\n      }\n      this.emitChange();\n      return;\n    }\n\n    const isSelected = this.value.includes(value);\n\n    if (isSelected) {\n      // Remove from selection\n      this.value = this.value.filter(v => v !== value);\n      this.selectedOptions = this.selectedOptions.filter(opt => (opt.value ?? opt.label) !== value);\n    } else {\n      // Add to selection (if not at max)\n      if (this.maxSelections && this.value.length >= this.maxSelections) {\n        return; // Don't add more\n      }\n      this.value = [...this.value, value];\n    }\n\n    this.emitChange();\n\n    // Clear search after szelection\n    this.searchQuery = '';\n  };\n\n  private emitChange() {\n    this.leChange.emit({\n      values: this.value,\n      options: this.selectedOptions,\n    });\n  }\n\n  private handleDropdownOpen = () => {\n    this.open = true;\n    this.leOpen.emit();\n\n    // Focus search input if searchable\n    if (this.searchable) {\n      setTimeout(() => {\n        this.inputEl?.focus();\n      }, 50);\n    }\n  };\n\n  private handleDropdownClose = () => {\n    this.open = false;\n    this.searchQuery = '';\n    this.leClose.emit();\n  };\n\n  private handleTriggerClick = () => {\n    if (!this.disabled) {\n      this.dropdownEl?.toggle();\n    }\n  };\n\n  private handleTriggerKeyDown = (e: KeyboardEvent) => {\n    if (this.disabled) return;\n\n    if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n      e.preventDefault();\n      this.dropdownEl?.show();\n    }\n  };\n\n  private handleTagDismiss = (option: LeOption, e: CustomEvent) => {\n    e.stopPropagation();\n    const value = option.value ?? option.label;\n    this.value = this.value.filter(v => v !== value);\n    this.selectedOptions = this.selectedOptions.filter(opt => opt !== option);\n    this.emitChange();\n  };\n\n  private handleSearchInput = (e: Event) => {\n    const target = e.target as HTMLInputElement;\n    this.searchQuery = target.value;\n  };\n\n  private handleClearAll = (e: MouseEvent) => {\n    e.stopPropagation();\n    this.value = [];\n    this.selectedOptions = [];\n    this.emitChange();\n  };\n\n  /**\n   * Opens the dropdown.\n   */\n  @Method()\n  async showDropdown() {\n    await this.dropdownEl?.show();\n  }\n\n  /**\n   * Closes the dropdown.\n   */\n  @Method()\n  async hideDropdown() {\n    await this.dropdownEl?.hide();\n  }\n\n  /**\n   * Clears all selections.\n   */\n  @Method()\n  async clearSelection() {\n    this.value = [];\n    this.selectedOptions = [];\n    this.emitChange();\n  }\n\n  private renderTags() {\n    if (this.selectedOptions.length === 0) {\n      return <span class=\"multiselect-placeholder\">{this.placeholder}</span>;\n    }\n\n    return (\n      <div class=\"multiselect-tags\">\n        {this.selectedOptions.map(option => (\n          <le-tag\n            key={option.value ?? option.label}\n            label={option.label}\n            icon={option.iconStart}\n            size={this.size === 'large' ? 'medium' : 'small'}\n            dismissible\n            disabled={this.disabled}\n            onLeDismiss={e => this.handleTagDismiss(option, e)}\n            mode=\"default\"\n          />\n        ))}\n      </div>\n    );\n  }\n\n  render() {\n    const hasSelections = this.selectedOptions.length > 0;\n    const atMaxSelections = this.maxSelections && this.value.length >= this.maxSelections;\n\n    return (\n      <le-component component=\"le-multiselect\">\n        <le-dropdown-base\n          ref={el => (this.dropdownEl = el)}\n          options={this.effectiveOptions}\n          value={this.value}\n          multiple={true}\n          disabled={this.disabled}\n          filterFn={this.searchable ? this.filterOption : undefined}\n          filterQuery={this.searchQuery}\n          emptyText={this.emptyText}\n          showCheckboxes={true}\n          fullWidth={this.fullWidth}\n          onLeOptionSelect={this.handleOptionSelect}\n          onLeDropdownOpen={this.handleDropdownOpen}\n          onLeDropdownClose={this.handleDropdownClose}\n        >\n          <div\n            slot=\"trigger\"\n            class={{\n              'multiselect-trigger': true,\n              'has-selections': hasSelections,\n              'is-open': this.open,\n              'is-disabled': this.disabled,\n            }}\n            tabIndex={this.disabled ? -1 : 0}\n            role=\"combobox\"\n            aria-haspopup=\"listbox\"\n            aria-expanded={this.open ? 'true' : 'false'}\n            aria-disabled={this.disabled ? 'true' : undefined}\n            onClick={this.handleTriggerClick}\n            onKeyDown={this.handleTriggerKeyDown}\n          >\n            {this.renderTags()}\n\n            <div class=\"multiselect-actions\">\n              {hasSelections && !this.disabled && (\n                <button\n                  type=\"button\"\n                  class=\"multiselect-clear\"\n                  onClick={this.handleClearAll}\n                  aria-label=\"Clear all\"\n                  tabIndex={-1}\n                >\n                  <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                    <path d=\"M4 4l8 8M12 4l-8 8\" />\n                  </svg>\n                </button>\n              )}\n              <span class=\"multiselect-arrow\">\n                <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                  <path d=\"M4 6l4 4 4-4\" />\n                </svg>\n              </span>\n            </div>\n          </div>\n\n          {/* Search input shown in dropdown header */}\n          {this.searchable && this.open && (\n            <div class=\"multiselect-search\" slot=\"header\">\n              <le-string-input\n                mode=\"default\"\n                inputRef={el => (this.inputEl = el)}\n                class=\"search-input\"\n                placeholder=\"Search...\"\n                value={this.searchQuery}\n                onInput={this.handleSearchInput}\n              />\n            </div>\n          )}\n        </le-dropdown-base>\n\n        {/* Hidden inputs for form submission */}\n        {this.name &&\n          this.value.map(val => (\n            <input type=\"hidden\" name={this.name} value={val.toString()} key={val.toString()} />\n          ))}\n\n        {/* Status message */}\n        {atMaxSelections && (\n          <span class=\"multiselect-status\">Maximum {this.maxSelections} selections</span>\n        )}\n      </le-component>\n    );\n  }\n}\n"],"version":3}
+{"file":"le-multiselect.js","mappings":"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","names":["LeMultiselect","__stencil_proxyCustomElement"],"sources":["src/components/le-multiselect/le-multiselect.css?tag=le-multiselect&encapsulation=shadow","src/components/le-multiselect/le-multiselect.tsx"],"sourcesContent":["/**\n * le-multiselect component styles\n *\n * CSS Custom Properties:\n * --le-multiselect-min-height\n * --le-multiselect-padding\n * --le-multiselect-font-size\n * --le-multiselect-border-radius\n * --le-multiselect-border-color\n * --le-multiselect-bg\n * --le-multiselect-color\n */\n\n:host {\n  display: inline-block;\n  min-width: 250px;\n\n  --le-multiselect-min-height: 0;\n  --le-multiselect-padding: var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-2);\n  --le-multiselect-border-color: var(--le-color-primary, #3b82f6);\n}\n\n:host([disabled]) {\n  opacity: 0.5;\n  pointer-events: none;\n}\n\n/* Trigger wrapper */\n.multiselect-trigger {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 0.5rem;\n  width: 100%;\n  min-height: var(--le-multiselect-min-height);\n  padding: var(--le-multiselect-padding);\n  line-height: var(--le-line-height-tight);\n  background: var(--le-multiselect-bg, var(--le-color-surface, #fff));\n  border: 1px solid color-mix(in srgb, var(--le-multiselect-border-color) 33%, transparent);\n  border-radius: var(--le-multiselect-border-radius, 0.375rem);\n  cursor: pointer;\n  transition: border-color 0.15s ease, box-shadow 0.15s ease;\n}\n\n.multiselect-trigger:hover:not(.is-disabled),\n:host(:focus-within) .multiselect-trigger:not(.is-disabled) {\n  border-color: var(--le-multiselect-border-color);\n}\n\n:host(:focus-within) .multiselect-trigger {\n  outline: 2px solid var(--le-color-focus);\n  outline-offset: 2px;\n}\n:host([full-width]) {\n  width: 100%;\n}\n\n.multiselect-trigger.is-open {\n  border-color: var(--le-color-primary, #3b82f6);\n}\n\n.multiselect-trigger.is-disabled {\n  cursor: not-allowed;\n  background: var(--le-color-surface-disabled, #f9fafb);\n}\n\n/* Placeholder */\n.multiselect-placeholder {\n  color: color-mix(in srgb, var(--le-color-text-secondary) 66%, transparent);\n}\n\n/* Tags container */\n.multiselect-tags {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.25rem;\n  flex: 1;\n  min-width: 0;\n}\n\n/* Actions (clear + arrow) */\n.multiselect-actions {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n  flex-shrink: 0;\n}\n\n/* Clear button */\n.multiselect-clear {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1.5rem;\n  height: 1.5rem;\n  padding: 0;\n  background: transparent;\n  color: var(--le-color-primary, #3b82f6);\n  border: none;\n  border-radius: 0.25rem;\n  cursor: pointer;\n  opacity: 0.6;\n  transition: opacity 0.15s ease, background-color 0.15s ease;\n}\n\n.multiselect-clear:hover {\n  opacity: 1;\n  background: var(--le-color-surface-hover, #f3f4f6);\n}\n\n.multiselect-clear svg {\n  width: 0.875rem;\n  height: 0.875rem;\n}\n\n/* Arrow icon */\n.multiselect-arrow {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1.5rem;\n  height: 1rem;\n  color: var(--le-color-primary, #3b82f6);\n  transition: transform 0.2s ease;\n}\n\n.multiselect-arrow svg {\n  width: 1rem;\n  height: 1rem;\n}\n\n.multiselect-trigger.is-open .multiselect-arrow {\n  transform: rotate(180deg);\n}\n\n/* Search in dropdown */\n.search-input::part(container):focus-within {\n  outline: none !important;\n}\n.search-input {\n  --le-input-radius: var(--le-radius-md);\n}\n\n/* Status message */\n.multiselect-status {\n  display: block;\n  margin-top: 0.25rem;\n  font-size: 0.75rem;\n  color: var(--le-color-text-muted, #6b7280);\n}\n\n/* Size variants */\n:host([size='small']) .multiselect-trigger {\n  --le-multiselect-min-height: 2rem;\n  --le-multiselect-padding: 0.25rem 0.375rem;\n  --le-multiselect-font-size: 0.75rem;\n}\n\n:host([size='large']) .multiselect-trigger {\n  --le-multiselect-min-height: 3rem;\n  --le-multiselect-padding: 0.5rem 0.625rem;\n  --le-multiselect-font-size: 1rem;\n}\n","import {\n  Component,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Method,\n  Element,\n  Watch,\n  h,\n} from '@stencil/core';\nimport {\n  LeOption,\n  LeOptionValue,\n  LeMultiOptionSelectDetail,\n  LeOptionSelectDetail,\n} from '../../types/options';\n\n/**\n * A multiselect component for selecting multiple options.\n *\n * Displays selected items as tags with optional search filtering.\n *\n * @cmsEditable true\n * @cmsCategory Form\n *\n * @example Basic multiselect\n * ```html\n * <le-multiselect\n *   placeholder=\"Select options...\"\n *   options='[{\"label\": \"Red\"}, {\"label\": \"Green\"}, {\"label\": \"Blue\"}]'\n * ></le-multiselect>\n * ```\n *\n * @example With max selections\n * ```html\n * <le-multiselect\n *   max-selections=\"3\"\n *   options='[{\"label\": \"Option 1\"}, {\"label\": \"Option 2\"}, {\"label\": \"Option 3\"}, {\"label\": \"Option 4\"}]'\n * ></le-multiselect>\n * ```\n *\n * @example With search\n * ```html\n * <le-multiselect\n *   searchable\n *   placeholder=\"Search and select...\"\n *   options='[{\"label\": \"Apple\"}, {\"label\": \"Banana\"}, {\"label\": \"Cherry\"}]'\n * ></le-multiselect>\n * ```\n */\n@Component({\n  tag: 'le-multiselect',\n  styleUrl: 'le-multiselect.css',\n  shadow: true,\n})\nexport class LeMultiselect {\n  @Element() el: HTMLElement;\n\n  /**\n   * The options to display in the dropdown.\n   */\n  @Prop() options: LeOption[] | string = [];\n\n  /**\n   * The currently selected values.\n   */\n  @Prop({ mutable: true }) value: LeOptionValue[] = [];\n\n  /**\n   * Placeholder text when no options are selected.\n   */\n  @Prop() placeholder: string = 'Select options...';\n\n  /**\n   * Whether the multiselect is disabled.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Whether selection is required.\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * Name attribute for form submission.\n   */\n  @Prop() name?: string;\n\n  /**\n   * Whether the multiselect should take full width of its container.\n   */\n  @Prop({ reflect: true }) fullWidth: boolean = false;\n\n  /**\n   * Size variant of the multiselect.\n   */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Maximum number of selections allowed.\n   */\n  @Prop() maxSelections?: number;\n\n  /**\n   * Labels for the \"Select All\" option.\n   */\n  @State() private selectAllLabel: string = 'Select All';\n  @State() private deselectAllLabel: string = 'Deselect All';\n\n  /**\n   * Whether to show a \"Select All\" option.\n   * Also accepts a string or array of strings to customize the label(s).\n   */\n  @Prop({ mutable: true }) showSelectAll: boolean | string | string[] = false;\n\n  /**\n   * Whether the input is searchable.\n   */\n  @Prop() searchable: boolean = false;\n\n  /**\n   * Text to show when no options match the search.\n   */\n  @Prop() emptyText: string = 'No results found';\n\n  /**\n   * Whether the dropdown is currently open.\n   */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /**\n   * Emitted when the selected values change.\n   */\n  @Event() leChange: EventEmitter<LeMultiOptionSelectDetail>;\n\n  /**\n   * Emitted when the dropdown opens.\n   */\n  @Event() leOpen: EventEmitter<void>;\n\n  /**\n   * Emitted when the dropdown closes.\n   */\n  @Event() leClose: EventEmitter<void>;\n\n  @State() private selectedOptions: LeOption[] = [];\n  @State() private searchQuery: string = '';\n\n  private dropdownEl?: HTMLLeDropdownBaseElement;\n  private inputEl?: HTMLInputElement;\n\n  @Watch('value')\n  handleValueChange() {\n    this.updateSelectedOptions();\n  }\n\n  @Watch('options')\n  handleOptionsChange() {\n    this.updateSelectedOptions();\n  }\n\n  @Watch('showSelectAll')\n  handleShowSelectAllChange(newValue: boolean | string | string[]) {\n    if (typeof newValue !== 'boolean' && typeof newValue !== 'string') {\n      this.showSelectAll = false;\n    } else if (typeof newValue === 'boolean') {\n      this.showSelectAll = newValue;\n    } else if (Array.isArray(newValue)) {\n      this.showSelectAll = true;\n      this.selectAllLabel = newValue[0];\n      this.deselectAllLabel = newValue[1] || newValue[0];\n    } else if (typeof newValue === 'string') {\n      this.showSelectAll = true;\n      try {\n        const parsed = JSON.parse(newValue);\n        if (Array.isArray(parsed) && parsed.every(item => typeof item === 'string')) {\n          this.selectAllLabel = parsed[0];\n          this.deselectAllLabel = parsed[1] || parsed[0];\n        } else {\n          this.selectAllLabel = newValue;\n          this.deselectAllLabel = newValue;\n        }\n      } catch {\n        this.selectAllLabel = newValue;\n        this.deselectAllLabel = newValue;\n      }\n    }\n  }\n\n  componentWillLoad() {\n    this.updateSelectedOptions();\n    this.handleShowSelectAllChange(this.showSelectAll);\n  }\n\n  private get parsedOptions(): LeOption[] {\n    if (typeof this.options === 'string') {\n      try {\n        return JSON.parse(this.options);\n      } catch {\n        return [];\n      }\n    }\n    return this.options;\n  }\n\n  private get effectiveOptions(): LeOption[] {\n    let options = [...this.parsedOptions];\n\n    // Add \"Select All\" option if enabled\n    if (this.showSelectAll && options.length > 0) {\n      const allSelected =\n        this.selectedOptions.length === this.parsedOptions.filter(opt => !opt.disabled).length;\n      options = [\n        {\n          label: allSelected ? this.deselectAllLabel : this.selectAllLabel,\n          value: '__select_all__',\n          iconStart: allSelected ? '✕' : '⇣',\n        },\n        ...options,\n      ];\n    }\n\n    return options;\n  }\n\n  private updateSelectedOptions() {\n    const valueArray = Array.isArray(this.value) ? this.value : [];\n    this.selectedOptions = this.parsedOptions.filter(opt =>\n      valueArray.includes(opt.value ?? opt.label),\n    );\n  }\n\n  private filterOption = (option: LeOption, query: string): boolean => {\n    if (!query) return true;\n    // Always show \"Select All\" option\n    if (option.value === '__select_all__') return true;\n\n    const searchLower = query.toLowerCase();\n    return (\n      option.label.toLowerCase().includes(searchLower) ||\n      (option.description?.toLowerCase().includes(searchLower) ?? false)\n    );\n  };\n\n  private handleOptionSelect = (e: CustomEvent<LeOptionSelectDetail>) => {\n    const { value } = e.detail;\n\n    const enabledOptions = this.parsedOptions.filter(opt => !opt.disabled);\n    if (enabledOptions.length === 0) return;\n\n    // Handle \"Select All\" option\n    if (value === '__select_all__') {\n      if (this.selectedOptions.length === enabledOptions.length) {\n        // Deselect all\n        this.value = [];\n      } else {\n        // Select all (respect maxSelections)\n        const selectableOptions = this.maxSelections\n          ? enabledOptions.slice(0, this.maxSelections)\n          : enabledOptions;\n        this.value = selectableOptions.map(opt => opt.value ?? opt.label);\n      }\n      this.emitChange();\n      return;\n    }\n\n    const isSelected = this.value.includes(value);\n\n    if (isSelected) {\n      // Remove from selection\n      this.value = this.value.filter(v => v !== value);\n      this.selectedOptions = this.selectedOptions.filter(opt => (opt.value ?? opt.label) !== value);\n    } else {\n      // Add to selection (if not at max)\n      if (this.maxSelections && this.value.length >= this.maxSelections) {\n        return; // Don't add more\n      }\n      this.value = [...this.value, value];\n    }\n\n    this.emitChange();\n\n    // Clear search after szelection\n    this.searchQuery = '';\n  };\n\n  private emitChange() {\n    this.leChange.emit({\n      values: this.value,\n      options: this.selectedOptions,\n    });\n  }\n\n  private handleDropdownOpen = () => {\n    this.open = true;\n    this.leOpen.emit();\n\n    // Focus search input if searchable\n    if (this.searchable) {\n      setTimeout(() => {\n        this.inputEl?.focus();\n      }, 50);\n    }\n  };\n\n  private handleDropdownClose = () => {\n    this.open = false;\n    this.searchQuery = '';\n    this.leClose.emit();\n  };\n\n  private handleTriggerClick = () => {\n    if (!this.disabled) {\n      this.dropdownEl?.toggle();\n    }\n  };\n\n  private handleTriggerKeyDown = (e: KeyboardEvent) => {\n    if (this.disabled) return;\n\n    if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n      e.preventDefault();\n      this.dropdownEl?.show();\n    }\n  };\n\n  private handleTagDismiss = (option: LeOption, e: CustomEvent) => {\n    e.stopPropagation();\n    const value = option.value ?? option.label;\n    this.value = this.value.filter(v => v !== value);\n    this.selectedOptions = this.selectedOptions.filter(opt => opt !== option);\n    this.emitChange();\n  };\n\n  private handleSearchInput = (e: Event) => {\n    const target = e.target as HTMLInputElement;\n    this.searchQuery = target.value;\n  };\n\n  private handleClearAll = (e: MouseEvent) => {\n    e.stopPropagation();\n    this.value = [];\n    this.selectedOptions = [];\n    this.emitChange();\n  };\n\n  /**\n   * Opens the dropdown.\n   */\n  @Method()\n  async showDropdown() {\n    await this.dropdownEl?.show();\n  }\n\n  /**\n   * Closes the dropdown.\n   */\n  @Method()\n  async hideDropdown() {\n    await this.dropdownEl?.hide();\n  }\n\n  /**\n   * Clears all selections.\n   */\n  @Method()\n  async clearSelection() {\n    this.value = [];\n    this.selectedOptions = [];\n    this.emitChange();\n  }\n\n  private renderTags() {\n    if (this.selectedOptions.length === 0) {\n      return <span class=\"multiselect-placeholder\">{this.placeholder}</span>;\n    }\n\n    return (\n      <div class=\"multiselect-tags\">\n        {this.selectedOptions.map(option => (\n          <le-tag\n            key={option.value ?? option.label}\n            label={option.label}\n            icon={option.iconStart}\n            size={this.size === 'large' ? 'medium' : 'small'}\n            dismissible\n            disabled={this.disabled}\n            onLeDismiss={e => this.handleTagDismiss(option, e)}\n            mode=\"default\"\n          />\n        ))}\n      </div>\n    );\n  }\n\n  render() {\n    const hasSelections = this.selectedOptions.length > 0;\n    const atMaxSelections = this.maxSelections && this.value.length >= this.maxSelections;\n\n    return (\n      <le-component component=\"le-multiselect\">\n        <le-dropdown-base\n          ref={el => (this.dropdownEl = el)}\n          options={this.effectiveOptions}\n          value={this.value}\n          multiple={true}\n          disabled={this.disabled}\n          filterFn={this.searchable ? this.filterOption : undefined}\n          filterQuery={this.searchQuery}\n          emptyText={this.emptyText}\n          showCheckboxes={true}\n          fullWidth={this.fullWidth}\n          onLeOptionSelect={this.handleOptionSelect}\n          onLeDropdownOpen={this.handleDropdownOpen}\n          onLeDropdownClose={this.handleDropdownClose}\n        >\n          <div\n            slot=\"trigger\"\n            class={{\n              'multiselect-trigger': true,\n              'has-selections': hasSelections,\n              'is-open': this.open,\n              'is-disabled': this.disabled,\n            }}\n            tabIndex={this.disabled ? -1 : 0}\n            role=\"combobox\"\n            aria-haspopup=\"listbox\"\n            aria-expanded={this.open ? 'true' : 'false'}\n            aria-disabled={this.disabled ? 'true' : undefined}\n            onClick={this.handleTriggerClick}\n            onKeyDown={this.handleTriggerKeyDown}\n          >\n            {this.renderTags()}\n\n            <div class=\"multiselect-actions\">\n              {hasSelections && !this.disabled && (\n                <button\n                  type=\"button\"\n                  class=\"multiselect-clear\"\n                  onClick={this.handleClearAll}\n                  aria-label=\"Clear all\"\n                  tabIndex={-1}\n                >\n                  <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                    <path d=\"M4 4l8 8M12 4l-8 8\" />\n                  </svg>\n                </button>\n              )}\n              <span class=\"multiselect-arrow\">\n                <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                  <path d=\"M4 6l4 4 4-4\" />\n                </svg>\n              </span>\n            </div>\n          </div>\n\n          {/* Search input shown in dropdown header */}\n          {this.searchable && this.open && (\n            <div class=\"multiselect-search\" slot=\"header\">\n              <le-string-input\n                mode=\"default\"\n                inputRef={el => (this.inputEl = el)}\n                class=\"search-input\"\n                placeholder=\"Search...\"\n                value={this.searchQuery}\n                onInput={this.handleSearchInput}\n              />\n            </div>\n          )}\n        </le-dropdown-base>\n\n        {/* Hidden inputs for form submission */}\n        {this.name &&\n          this.value.map(val => (\n            <input type=\"hidden\" name={this.name} value={val.toString()} key={val.toString()} />\n          ))}\n\n        {/* Status message */}\n        {atMaxSelections && (\n          <span class=\"multiselect-status\">Maximum {this.maxSelections} selections</span>\n        )}\n      </le-component>\n    );\n  }\n}\n"],"version":3}

package/dist/components/le-navigation.js

@@ -1,497 +1,4 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host, transformTag } from '@stencil/core/internal/client';
-import { g as generateId, c as classnames } from './utils.js';
-import { d as defineCustomElement$d } from './le-bar2.js';
-import { d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$4, c as defineCustomElement$5, e as defineCustomElement$9, f as defineCustomElement$b, g as defineCustomElement$c } from './le-button2.js';
-import { d as defineCustomElement$a } from './le-collapse2.js';
-import { d as defineCustomElement$8 } from './le-dropdown-base2.js';
-import { d as defineCustomElement$7 } from './le-icon2.js';
-import { d as defineCustomElement$6 } from './le-popover2.js';
-
-const leNavigationCss = () => `:host{display:block;--le-nav-radius:var(--le-radius-md);--le-nav-gap:var(--le-spacing-2);--le-nav-item-padding-x:var(--le-spacing-1);--le-nav-item-padding-y:var(--le-spacing-2);--le-nav-item-gap:var(--le-spacing-2);--le-nav-link-padding-x:var(--le-spacing-2);--le-nav-link-padding-y:var(--le-spacing-1);--le-nav-link-gap:var(--le-spacing-1);--le-nav-color:var(--le-color-text-primary);--le-nav-muted:var(--le-color-text-secondary);--le-nav-hover-bg:var(--le-color-gray-100);--le-nav-selected-bg:var(--le-color-primary);--le-nav-selected-color:var(--le-color-primary-contrast)}:host([orientation='horizontal']:not([wrap])){flex:1 1 0%;min-width:0}.nav-vertical{display:flex;flex-direction:column;gap:var(--le-nav-gap)}.nav-search{width:100%}.nav-search-input{--le-input-radius:var(--le-radius-md)}.nav-empty{padding:var(--le-spacing-2);color:var(--le-nav-muted);font-size:var(--le-font-size-sm)}.nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--le-spacing-1)}.nav-row{display:flex;align-items:stretch;gap:var(--le-spacing-1);border-radius:var(--le-nav-radius)}.nav-row:hover{background:var(--le-nav-hover-bg)}.nav-toggle,.nav-toggle-spacer{box-sizing:border-box;width:var(--le-spacing-4);min-width:var(--le-spacing-4);display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:var(--le-nav-radius);color:inherit}.nav-toggle{background:transparent;cursor:pointer;opacity:0.4}.nav-toggle:hover:not(:disabled){opacity:1}.nav-toggle:focus-visible{outline:2px solid var(--le-color-focus);outline-offset:2px;opacity:1}.nav-chevron{display:inline-block;transition:transform var(--le-transition-fast)}.nav-chevron svg{display:block;width:var(--le-spacing-4);height:var(--le-spacing-4)}.nav-node>div>button>.nav-chevron{transform:rotate(-90deg)}.nav-node.open>div>button>.nav-chevron{transform:rotate(0deg)}.nav-item{flex:1;display:inline-flex;align-items:center;gap:var(--le-nav-item-gap);padding:var(--le-nav-item-padding-y) var(--le-nav-item-padding-x) var(--le-nav-item-padding-y) 0;border-radius:var(--le-nav-radius);border:1px solid transparent;background:transparent;text-decoration:none;color:var(--le-nav-color);font-family:var(--le-font-family-base);font-size:var(--le-font-size-md);line-height:var(--le-line-height-tight);cursor:pointer}.nav-item:focus-visible{outline:2px solid var(--le-color-focus);outline-offset:2px}.nav-node.selected>.nav-row{background:var(--le-nav-selected-bg);color:var(--le-nav-selected-color)}.nav-node.selected>.nav-row>.nav-item{color:inherit}.nav-node.disabled>.nav-row>.nav-item{opacity:0.5;cursor:not-allowed}.nav-text{display:flex;flex-direction:column;min-width:0}.nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-description{color:color-mix(in srgb, var(--le-nav-muted) 90%, transparent);font-size:var(--le-font-size-sm);line-height:var(--le-line-height-tight)}.nav-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.nav-icon-end{margin-left:auto}.nav-children{margin-top:var(--le-spacing-1)}.nav-horizontal-wrapper{display:flex;align-items:center;gap:var(--le-nav-gap)}.nav-bar{flex:1 1 0%;min-width:0;--le-bar-gap:var(--le-nav-gap)}.nav-bar.align-end{--le-bar-justify:flex-end}.nav-bar.align-center{--le-bar-justify:center}.nav-bar.align-space-between{--le-bar-justify:space-between}.nav-bar.overflow-more.has-overflow,.nav-bar.overflow-hamburger.has-overflow{margin-inline-end:calc((var(--le-nav-gap) + (var(--le-nav-link-padding-x) * 2)) * -1)}.h-item{display:flex;align-items:center}.h-link{display:inline-flex;align-items:center;gap:var(--le-nav-link-gap);padding:var(--le-nav-link-padding-y) var(--le-nav-link-padding-x);border-radius:var(--le-nav-radius);border:1px solid transparent;background:transparent;text-decoration:none;color:var(--le-nav-color);font-family:var(--le-font-family-base);font-size:var(--le-font-size-md);cursor:pointer}.h-link:hover{background:var(--le-nav-hover-bg)}.h-link:focus-visible{outline:2px solid var(--le-color-focus);outline-offset:2px}.h-link.disabled,.h-trigger.disabled{opacity:0.5;pointer-events:none}.h-link.selected,.h-trigger.selected{background:var(--le-nav-selected-bg);color:var(--le-nav-selected-color)}.h-label{white-space:nowrap}.h-trigger{display:inline-flex;align-items:center;gap:var(--le-spacing-1);border-radius:var(--le-nav-radius)}.h-submenu-toggle{width:var(--le-spacing-3);height:var(--le-spacing-3);display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:var(--le-nav-radius);background:transparent;color:currentColor;cursor:pointer}.h-submenu-toggle:hover{background:var(--le-nav-hover-bg)}.overflow-trigger{display:inline-flex;align-items:center;justify-content:center;gap:var(--le-nav-link-gap);padding:var(--le-nav-link-padding-y) var(--le-nav-link-padding-x);border-radius:var(--le-nav-radius);border:1px solid transparent;background:transparent;color:var(--le-nav-color);cursor:pointer;font-family:var(--le-font-family-base);font-size:var(--le-font-size-md)}.overflow-trigger:hover{background:var(--le-nav-hover-bg)}.overflow-trigger:focus-visible{outline:2px solid var(--le-color-focus);outline-offset:2px}.nav-overflow-trigger{display:flex;align-items:center}le-popover::part(content){padding:var(--le-spacing-1)}`;
-
-const LeNavigation$1 = /*@__PURE__*/ proxyCustomElement(class LeNavigation extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.leNavItemSelect = createEvent(this, "leNavItemSelect", 7);
-        this.leNavItemToggle = createEvent(this, "leNavItemToggle", 7);
-    }
-    get el() { return this; }
-    /**
-     * Navigation items.
-     * Can be passed as an array or JSON string (same pattern as le-select).
-     */
-    items = [];
-    /**
-     * Layout orientation.
-     */
-    orientation = 'horizontal';
-    /**
-     * Horizontal wrapping behavior.
-     * If false, overflow behavior depends on `overflowMode`.
-     */
-    wrap = false;
-    /**
-     * Overflow behavior for horizontal, non-wrapping menus.
-     * - more: moves overflow items into a "More" popover
-     * - hamburger: turns the whole nav into a hamburger popover
-     */
-    overflowMode = 'more';
-    /**
-     * Minimum number of visible top-level items required to use the "More" overflow.
-     * If fewer would be visible, the navigation falls back to hamburger.
-     */
-    minVisibleItemsForMore = 2;
-    /**
-     * Alignment of the menu items within the navigation bar.
-     */
-    align = 'start';
-    /**
-     * Active url for automatic selection.
-     */
-    activeUrl = '';
-    /**
-     * Enables a search input for the vertical navigation.
-     */
-    searchable = false;
-    /**
-     * Placeholder text for the search input.
-     */
-    searchPlaceholder = 'Search...';
-    /**
-     * Text shown when no items match the filter.
-     */
-    emptyText = 'No results found';
-    /**
-     * Whether submenu popovers should include a filter input.
-     */
-    submenuSearchable = false;
-    /**
-     * Fired when a navigation item is activated.
-     *
-     * This event is cancelable. Call `event.preventDefault()` to prevent
-     * default browser navigation and implement custom routing.
-     */
-    leNavItemSelect;
-    /**
-     * Fired when a tree branch is toggled.
-     */
-    leNavItemToggle;
-    searchQuery = '';
-    openState = {};
-    /** IDs of items currently in overflow (from le-bar) */
-    overflowIds = [];
-    /** Whether hamburger mode is active (from le-bar) */
-    hamburgerActive = false;
-    submenuQueries = {};
-    /** Whether the overflow popover is open */
-    overflowPopoverOpen = false;
-    popoverRefs = new Map();
-    instanceId = generateId('le-nav');
-    partFromOptionPart(base, part) {
-        const raw = (part ?? '').trim();
-        if (!raw)
-            return base;
-        const tokens = raw
-            .split(/\s+/)
-            .map(t => t.replace(/[^a-zA-Z0-9_-]/g, ''))
-            .filter(Boolean);
-        if (tokens.length === 0)
-            return base;
-        return [base, ...tokens.map(t => `${base}-${t}`)].join(' ');
-    }
-    handleLayoutInputsChange() {
-        // Reset overflow state when layout inputs change
-        this.overflowIds = [];
-        this.hamburgerActive = false;
-    }
-    disconnectedCallback() {
-        // Cleanup if needed
-    }
-    get parsedItems() {
-        if (typeof this.items === 'string') {
-            try {
-                return JSON.parse(this.items);
-            }
-            catch {
-                return [];
-            }
-        }
-        return this.items;
-    }
-    getItemId(item, path) {
-        return item.id ?? `${this.instanceId}:${path}`;
-    }
-    getChildItems(item) {
-        return Array.isArray(item.children) ? item.children : [];
-    }
-    isOpen(item, id) {
-        const fromState = this.openState[id];
-        if (typeof fromState === 'boolean')
-            return fromState;
-        return !!item.open;
-    }
-    setOpen(id, open) {
-        if (this.openState[id] === open)
-            return;
-        this.openState = {
-            ...this.openState,
-            [id]: open,
-        };
-    }
-    matchesQuery(option, query) {
-        if (!query)
-            return true;
-        const q = query.toLowerCase();
-        return (option.label.toLowerCase().includes(q) ||
-            (option.description?.toLowerCase().includes(q) ?? false));
-    }
-    filterTree(items, query, pathPrefix, autoOpen) {
-        if (!query)
-            return items;
-        const result = [];
-        items.forEach((item, index) => {
-            const path = pathPrefix ? `${pathPrefix}.${index}` : String(index);
-            const id = this.getItemId(item, path);
-            const children = this.getChildItems(item);
-            const filteredChildren = this.filterTree(children, query, path, autoOpen);
-            const selfMatch = this.matchesQuery(item, query);
-            const childMatch = filteredChildren.length > 0;
-            if (selfMatch || childMatch) {
-                if (childMatch) {
-                    autoOpen.add(id);
-                }
-                if (childMatch && filteredChildren !== children) {
-                    result.push({
-                        ...item,
-                        children: filteredChildren,
-                    });
-                }
-                else {
-                    result.push(item);
-                }
-            }
-        });
-        return result;
-    }
-    handleItemSelect = (e, item, id) => {
-        if (item.disabled) {
-            e.preventDefault();
-            e.stopPropagation();
-            return;
-        }
-        const emitted = this.leNavItemSelect.emit({
-            item,
-            id,
-            href: item.href,
-            originalEvent: e,
-        });
-        if (emitted.defaultPrevented) {
-            e.preventDefault();
-        }
-    };
-    handleToggle = (e, item, id) => {
-        e.preventDefault();
-        e.stopPropagation();
-        if (item.disabled)
-            return;
-        const next = !this.isOpen(item, id);
-        this.setOpen(id, next);
-        this.leNavItemToggle.emit({
-            item,
-            id,
-            open: next,
-            originalEvent: e,
-        });
-    };
-    handleSearchInput = (e) => {
-        const target = e.target;
-        this.searchQuery = target.value;
-    };
-    handleSubmenuSearchInput = (submenuId, e) => {
-        const target = e.target;
-        const value = target.value;
-        if (this.submenuQueries[submenuId] === value)
-            return;
-        this.submenuQueries = {
-            ...this.submenuQueries,
-            [submenuId]: value,
-        };
-        // Position may change as items filter.
-        requestAnimationFrame(() => this.popoverRefs.get(submenuId)?.updatePosition());
-    };
-    handleBarOverflowChange = (e) => {
-        this.overflowIds = e.detail.overflowingIds || [];
-        this.hamburgerActive = e.detail.hamburgerActive || false;
-    };
-    openOverflowPopover = () => {
-        this.overflowPopoverOpen = true;
-    };
-    closeOverflowPopover = () => {
-        this.overflowPopoverOpen = false;
-    };
-    renderVerticalList(items, { depth, pathPrefix, autoOpenIds, searchable, searchQuery, searchPlaceholder, emptyText, submenuId, closePopover, }) {
-        const query = searchQuery ?? '';
-        const openFromSearch = autoOpenIds ?? new Set();
-        const filtered = query ? this.filterTree(items, query, pathPrefix, openFromSearch) : items;
-        return (h("div", { class: classnames('nav-vertical', { 'is-submenu': !!submenuId }) }, searchable && (h("div", { class: "nav-search" }, h("le-string-input", { mode: "default", class: "nav-search-input", placeholder: searchPlaceholder ?? 'Search...', value: query, onInput: (e) => submenuId ? this.handleSubmenuSearchInput(submenuId, e) : this.handleSearchInput(e) }))), filtered.length === 0 ? (h("div", { class: "nav-empty" }, emptyText ?? this.emptyText)) : (h("ul", { class: "nav-list", role: "tree" }, filtered.map((item, index) => {
-            const path = pathPrefix ? `${pathPrefix}.${index}` : String(index);
-            const id = this.getItemId(item, path);
-            const children = this.getChildItems(item);
-            const hasChildren = children.length > 0;
-            const open = hasChildren && (this.isOpen(item, id) || openFromSearch.has(id));
-            const paddingLeft = `calc(var(--le-nav-item-padding-x) + ${depth} * var(--le-spacing-4))`;
-            const TagType = item.href && !item.disabled ? 'a' : 'button';
-            const attrs = TagType === 'a'
-                ? { href: item.href, role: 'treeitem' }
-                : { type: 'button', role: 'treeitem' };
-            const itemPart = this.partFromOptionPart('item', item.part);
-            return (h("li", { class: classnames('nav-node', {
-                    'disabled': item.disabled,
-                    'selected': item.selected || (this.activeUrl && item.href === this.activeUrl),
-                    open,
-                    'has-children': hasChildren,
-                }), key: id, role: "none" }, h("div", { class: "nav-row", style: { paddingLeft } }, hasChildren ? (h("button", { type: "button", class: "nav-toggle", "aria-label": open ? 'Collapse' : 'Expand', "aria-expanded": open ? 'true' : 'false', onClick: (e) => this.handleToggle(e, item, id), disabled: item.disabled }, h("le-icon", { name: "chevron-down", class: "nav-chevron", "aria-hidden": "true" }))) : (h("span", { class: "nav-toggle-spacer", "aria-hidden": "true" })), h(TagType, { class: "nav-item", part: itemPart, ...attrs, "aria-disabled": item.disabled ? 'true' : undefined, onClick: (e) => {
-                    // For buttons, also toggle if this is a purely structural node.
-                    this.handleItemSelect(e, item, id);
-                    if (!item.href && hasChildren && !item.disabled) {
-                        this.handleToggle(e, item, id);
-                        return;
-                    }
-                    if (!item.disabled && closePopover) {
-                        closePopover();
-                    }
-                } }, item.iconStart && (h("span", { class: "nav-icon", "aria-hidden": "true" }, item.iconStart)), h("span", { class: "nav-text" }, h("span", { class: "nav-label" }, item.label), item.description && (h("span", { class: "nav-description" }, item.description))), item.iconEnd && (h("span", { class: "nav-icon nav-icon-end", "aria-hidden": "true" }, item.iconEnd)))), hasChildren && (h("le-collapse", { class: "nav-children", closed: !open, noFading: true, role: "group" }, this.renderVerticalList(children, {
-                depth: depth + 1,
-                pathPrefix: path,
-                autoOpenIds: openFromSearch,
-                submenuId,
-                closePopover,
-            })))));
-        })))));
-    }
-    renderHorizontalItem(item, index) {
-        const id = this.getItemId(item, String(index));
-        const children = this.getChildItems(item);
-        const hasChildren = children.length > 0;
-        if (!hasChildren) {
-            const TagType = item.href && !item.disabled ? 'a' : 'button';
-            const attrs = TagType === 'a'
-                ? { href: item.href, role: 'menuitem' }
-                : { type: 'button', role: 'menuitem' };
-            const itemPart = this.partFromOptionPart('item', item.part);
-            return (h("div", { class: "h-item", "data-bar-id": id }, h(TagType, { class: classnames('h-link', {
-                    disabled: item.disabled,
-                    selected: item.selected || (this.activeUrl && item.href === this.activeUrl),
-                }), part: itemPart, ...attrs, "aria-disabled": item.disabled ? 'true' : undefined, onClick: (e) => this.handleItemSelect(e, item, id) }, item.iconStart && (h("span", { class: "nav-icon", "aria-hidden": "true" }, item.iconStart)), h("span", { class: "h-label" }, item.label), item.iconEnd && (h("span", { class: "nav-icon nav-icon-end", "aria-hidden": "true" }, item.iconEnd)))));
-        }
-        const submenuId = id;
-        const itemPart = this.partFromOptionPart('item', item.part);
-        return (h("div", { class: "h-item", "data-bar-id": id }, h("le-popover", { ref: el => {
-                if (el)
-                    this.popoverRefs.set(submenuId, el);
-            }, mode: "default", offset: 8, showClose: false, closeOnClickOutside: true, closeOnEscape: true, position: "bottom", align: "start", minWidth: "240px" }, h("div", { slot: "trigger", class: classnames('h-trigger', {
-                disabled: item.disabled,
-                selected: item.selected || (this.activeUrl && item.href === this.activeUrl),
-            }), part: itemPart, role: "menuitem", "aria-disabled": item.disabled ? 'true' : undefined, onClick: (e) => {
-                // Don’t let le-popover auto-toggle from its internal wrapper.
-                e.stopPropagation();
-                if (item.disabled)
-                    return;
-                if (item.href) {
-                    this.handleItemSelect(e, item, id);
-                    this.popoverRefs.get(submenuId)?.hide();
-                }
-                else {
-                    this.popoverRefs.get(submenuId)?.toggle();
-                }
-            } }, item.href ? (h("a", { class: "h-link", href: item.href, onClick: (e) => {
-                e.stopPropagation();
-                this.handleItemSelect(e, item, id);
-            } }, item.iconStart && (h("span", { class: "nav-icon", "aria-hidden": "true" }, item.iconStart)), h("span", { class: "h-label" }, item.label), h("span", { class: "nav-chevron", "aria-hidden": "true" }, h("le-icon", { name: "chevron-down" })))) : (h("button", { type: "button", class: "h-link", onClick: (e) => {
-                e.stopPropagation();
-                if (item.disabled)
-                    return;
-                this.popoverRefs.get(submenuId)?.toggle();
-            } }, item.iconStart && (h("span", { class: "nav-icon", "aria-hidden": "true" }, item.iconStart)), h("span", { class: "h-label" }, item.label), h("span", { class: "nav-chevron", "aria-hidden": "true" }, h("le-icon", { name: "chevron-down" }))))), h("div", { class: "popover-menu" }, this.renderVerticalList(children, {
-            depth: 0,
-            pathPrefix: String(index),
-            searchable: this.submenuSearchable,
-            searchQuery: this.submenuQueries[submenuId] ?? '',
-            searchPlaceholder: this.searchPlaceholder,
-            emptyText: this.emptyText,
-            submenuId,
-            closePopover: () => this.popoverRefs.get(submenuId)?.hide(),
-        })))));
-    }
-    getOverflowMode() {
-        if (this.wrap)
-            return 'wrap';
-        return this.overflowMode;
-    }
-    getBarAlignment() {
-        // Map le-navigation align to le-bar alignItems
-        // 'space-between' doesn't map directly, use 'stretch' as closest
-        if (this.align === 'space-between')
-            return 'stretch';
-        return this.align;
-    }
-    renderOverflowPopover() {
-        const items = this.parsedItems;
-        const overflowSet = new Set(this.overflowIds || []);
-        // Determine which items to show in the popover
-        let itemsToShow;
-        if (this.hamburgerActive) {
-            // In hamburger mode, show all items
-            itemsToShow = items;
-        }
-        else {
-            // In "more" mode, show only overflow items
-            itemsToShow = items.filter((item, index) => {
-                const id = this.getItemId(item, String(index));
-                return overflowSet.has(id);
-            });
-        }
-        if (itemsToShow.length === 0)
-            return null;
-        const isHamburger = this.hamburgerActive;
-        return (h("le-popover", { mode: "default", offset: 8, open: this.overflowPopoverOpen, showClose: false, closeOnClickOutside: true, closeOnEscape: true, position: "bottom", align: "end", minWidth: "260px", onLePopoverClose: this.closeOverflowPopover }, h("button", { slot: "trigger", type: "button", class: "overflow-trigger", part: isHamburger ? 'hamburger-trigger' : 'more-trigger', "aria-label": isHamburger ? 'Open menu' : 'More', onClick: this.openOverflowPopover }, h("slot", { name: isHamburger ? 'hamburger-trigger' : 'more-trigger' }, h("le-icon", { name: isHamburger ? 'hamburger' : 'ellipsis-horizontal' }))), h("div", { class: "popover-menu" }, this.renderVerticalList(itemsToShow, {
-            depth: 0,
-            pathPrefix: '',
-            closePopover: this.closeOverflowPopover,
-        }))));
-    }
-    renderHorizontal() {
-        const items = this.parsedItems;
-        const overflowMode = this.getOverflowMode();
-        const showOverflowButton = (this.overflowIds?.length ?? 0) > 0 || this.hamburgerActive;
-        return (h("div", { class: "nav-horizontal-wrapper" }, h("le-bar", { class: classnames('nav-bar', {
-                'align-end': this.align === 'end',
-                'align-center': this.align === 'center',
-                'align-space-between': this.align === 'space-between',
-            }), overflow: overflowMode, alignItems: this.getBarAlignment(), disablePopover: true, minVisibleItems: this.minVisibleItemsForMore, onLeBarOverflowChange: this.handleBarOverflowChange }, items.map((item, index) => this.renderHorizontalItem(item, index))), showOverflowButton && this.renderOverflowPopover()));
-    }
-    render() {
-        const items = this.parsedItems;
-        if (this.orientation === 'horizontal') {
-            return (h(Host, null, h("le-component", { component: "le-navigation" }, this.renderHorizontal())));
-        }
-        return (h(Host, null, h("le-component", { component: "le-navigation" }, this.renderVerticalList(items, {
-            depth: 0,
-            pathPrefix: '',
-            searchable: this.searchable,
-            searchQuery: this.searchQuery,
-            searchPlaceholder: this.searchPlaceholder,
-            emptyText: this.emptyText,
-        }))));
-    }
-    static get watchers() { return {
-        "items": ["handleLayoutInputsChange"],
-        "orientation": ["handleLayoutInputsChange"],
-        "wrap": ["handleLayoutInputsChange"],
-        "overflowMode": ["handleLayoutInputsChange"]
-    }; }
-    static get style() { return leNavigationCss(); }
-}, [769, "le-navigation", {
-        "items": [1],
-        "orientation": [513],
-        "wrap": [516],
-        "overflowMode": [513, "overflow-mode"],
-        "minVisibleItemsForMore": [2, "min-visible-items-for-more"],
-        "align": [513],
-        "activeUrl": [1, "active-url"],
-        "searchable": [4],
-        "searchPlaceholder": [1, "search-placeholder"],
-        "emptyText": [1, "empty-text"],
-        "submenuSearchable": [4, "submenu-searchable"],
-        "searchQuery": [32],
-        "openState": [32],
-        "overflowIds": [32],
-        "hamburgerActive": [32],
-        "submenuQueries": [32],
-        "overflowPopoverOpen": [32]
-    }, undefined, {
-        "items": ["handleLayoutInputsChange"],
-        "orientation": ["handleLayoutInputsChange"],
-        "wrap": ["handleLayoutInputsChange"],
-        "overflowMode": ["handleLayoutInputsChange"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["le-navigation", "le-bar", "le-button", "le-checkbox", "le-collapse", "le-component", "le-dropdown-base", "le-icon", "le-popover", "le-popup", "le-select", "le-slot", "le-string-input"];
-    components.forEach(tagName => { switch (tagName) {
-        case "le-navigation":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), LeNavigation$1);
-            }
-            break;
-        case "le-bar":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$d();
-            }
-            break;
-        case "le-button":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$c();
-            }
-            break;
-        case "le-checkbox":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$b();
-            }
-            break;
-        case "le-collapse":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$a();
-            }
-            break;
-        case "le-component":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$9();
-            }
-            break;
-        case "le-dropdown-base":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$8();
-            }
-            break;
-        case "le-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$7();
-            }
-            break;
-        case "le-popover":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$6();
-            }
-            break;
-        case "le-popup":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$5();
-            }
-            break;
-        case "le-select":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$4();
-            }
-            break;
-        case "le-slot":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$3();
-            }
-            break;
-        case "le-string-input":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
+import { L as LeNavigation$1, d as defineCustomElement$1 } from './le-navigation2.js';
 
 const LeNavigation = LeNavigation$1;
 const defineCustomElement = defineCustomElement$1;