@helixui/library 3.3.1 → 3.4.0

package/dist/shared/hx-list-MyEhh8c7.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"hx-list-MyEhh8c7.js","sources":["../../src/components/hx-list/hx-list.styles.ts","../../src/components/hx-list/hx-list-item.styles.ts","../../src/components/hx-list/hx-list-item.ts","../../src/components/hx-list/hx-list.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixListStyles = css`\n  :host {\n    display: block;\n  }\n\n  .list {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    display: flex;\n    flex-direction: column;\n    gap: var(--hx-list-gap, 0);\n  }\n\n  /* ─── Variant: bulleted ─── */\n\n  .list--bulleted {\n    padding-inline-start: var(--hx-space-6, 1.5rem);\n    list-style: disc;\n  }\n\n  /* ─── Variant: numbered ─── */\n\n  .list--numbered {\n    padding-inline-start: var(--hx-space-6, 1.5rem);\n    list-style: decimal;\n  }\n\n  /* ─── Variant: interactive ─── */\n\n  .list--interactive {\n    list-style: none;\n    padding: 0;\n  }\n\n  /* ─── Variant: description ─── */\n\n  .list--description {\n    padding: 0;\n    list-style: none;\n  }\n\n  /* ─── Dividers ─── */\n\n  :host([divided]) .list > ::slotted(hx-list-item:not(:last-child)) {\n    border-bottom: var(--hx-border-width-thin, 1px) solid\n      var(--hx-list-divider-color, var(--hx-color-neutral-200, #d6dbd5));\n  }\n\n  /* ─── High Contrast Mode (forced-colors) ─── */\n\n  @media (forced-colors: active) {\n    /* Divider borders are already using a border property, which forced-colors respects.\n       Ensure the system color is used for divider borders. */\n    :host([divided]) .list > ::slotted(hx-list-item:not(:last-child)) {\n      border-bottom-color: CanvasText;\n    }\n  }\n`;\n","import { css } from 'lit';\n\nexport const helixListItemStyles = css`\n  :host {\n    display: block;\n  }\n\n  :host([disabled]) {\n    pointer-events: none;\n    opacity: var(--hx-opacity-disabled, 0.5);\n  }\n\n  /* ─── Base list item ─── */\n\n  .list-item {\n    display: flex;\n    align-items: center;\n    gap: var(--hx-space-3, 0.75rem);\n    padding: var(--hx-list-item-padding, var(--hx-space-3, 0.75rem));\n    color: var(--hx-list-item-color, var(--hx-color-neutral-900, #0d1825));\n    font-family: var(--hx-list-item-font-family, var(--hx-font-family-sans, sans-serif));\n    font-size: var(--hx-font-size-md, 1rem);\n    line-height: var(--hx-line-height-normal, 1.5);\n    cursor: default;\n    box-sizing: border-box;\n    width: 100%;\n  }\n\n  /* ─── Interactive items — use :host([interactive]) instead of deprecated :host-context() ─── */\n\n  :host([interactive]) .list-item {\n    cursor: pointer;\n    border-radius: var(--hx-border-radius-md, 0.375rem);\n    transition: background-color var(--hx-transition-fast, 150ms ease);\n  }\n\n  :host([interactive]) .list-item:hover:not(.list-item--disabled) {\n    background-color: var(--hx-list-item-bg-hover, var(--hx-color-neutral-50, #f5f8f3));\n  }\n\n  :host([interactive]):focus-visible .list-item {\n    outline: var(--hx-focus-ring-width, 2px) solid var(--hx-focus-ring-color, #0f7078);\n    outline-offset: var(--hx-focus-ring-offset, 2px);\n  }\n\n  /* ─── Selected state ─── */\n\n  .list-item--selected {\n    background-color: var(--hx-list-item-bg-selected, var(--hx-color-primary-50, #ebf8f8));\n    color: var(--hx-list-item-color-selected, var(--hx-color-primary-700, #0f6363));\n  }\n\n  /* ─── Disabled state ─── */\n\n  .list-item--disabled {\n    cursor: not-allowed;\n    opacity: var(--hx-opacity-disabled, 0.5);\n  }\n\n  /* ─── Link mode ─── */\n\n  .list-item__link {\n    display: flex;\n    align-items: center;\n    gap: var(--hx-space-3, 0.75rem);\n    width: 100%;\n    text-decoration: none;\n    color: inherit;\n  }\n\n  .list-item__link:focus-visible {\n    outline: var(--hx-focus-ring-width, 2px) solid var(--hx-focus-ring-color, #0f7078);\n    outline-offset: var(--hx-focus-ring-offset, 2px);\n    border-radius: var(--hx-border-radius-sm, 0.25rem);\n  }\n\n  /* ─── Slots ─── */\n\n  .list-item__prefix,\n  .list-item__suffix {\n    display: inline-flex;\n    align-items: center;\n    flex-shrink: 0;\n  }\n\n  .list-item__body {\n    display: flex;\n    flex-direction: column;\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n\n  .list-item__label {\n    display: block;\n  }\n\n  .list-item__description {\n    display: block;\n    font-size: var(--hx-font-size-sm, 0.875rem);\n    color: var(--hx-list-item-description-color, var(--hx-color-neutral-500, #66787b));\n    margin-top: var(--hx-space-1, 0.25rem);\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    :host([interactive]) .list-item {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast / forced-colors mode) ─── */\n\n  @media (forced-colors: active) {\n    /* Selected state: replace background-color with a visible border using system Highlight color */\n    :host([interactive]) .list-item--selected {\n      background-color: transparent;\n      border: 2px solid Highlight;\n      color: HighlightText;\n      forced-color-adjust: none;\n    }\n\n    /* Hover state: use an outline instead of background-color */\n    :host([interactive]) .list-item:hover:not(.list-item--disabled) {\n      background-color: transparent;\n      outline: 1px solid Highlight;\n      outline-offset: -1px;\n    }\n\n    /* Disabled state: use system GrayText color */\n    :host([interactive][disabled]) .list-item,\n    :host([interactive]) .list-item--disabled {\n      color: GrayText;\n    }\n\n    /* Focus ring: ensure visibility in forced-colors mode */\n    :host([interactive]):focus-visible .list-item {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n      forced-color-adjust: none;\n    }\n  }\n`;\n","import { html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { HelixElement } from '../../base/index.js';\nimport { helixListItemStyles } from './hx-list-item.styles.js';\nimport { forcedColorsSurface } from '../../styles/forced-colors.js';\n\n/**\n * A rich list item for use inside `hx-list`.\n *\n * @summary Individual list item with optional prefix, suffix, description, link, and disabled/selected states.\n *\n * @tag hx-list-item\n *\n * @slot - Default slot for the item label text.\n * @slot prefix - Icon, avatar, or content rendered before the label.\n * @slot suffix - Icon, badge, or text rendered after the label.\n * @slot description - Secondary descriptive text rendered below the label.\n *\n * @fires {CustomEvent<{item: HelixListItem, value: string | undefined}>} hx-list-item-click -\n *   Dispatched when the item is clicked and not disabled.\n *\n * @csspart base - The root item element (li, dt, dd, or wrapper).\n * @csspart prefix - The prefix slot container.\n * @csspart label - The label slot container.\n * @csspart description - The description slot container.\n * @csspart suffix - The suffix slot container.\n *\n * @cssprop [--hx-list-item-padding=var(--hx-space-3)] - Item padding.\n * @cssprop [--hx-list-item-color=var(--hx-color-neutral-900)] - Item text color.\n * @cssprop [--hx-list-item-bg-hover=var(--hx-color-neutral-50)] - Item hover background.\n * @cssprop [--hx-list-item-bg-selected=var(--hx-color-primary-50)] - Selected item background.\n * @cssprop [--hx-list-item-color-selected=var(--hx-color-primary-700)] - Selected item text color.\n * @cssprop [--hx-list-item-description-color=var(--hx-color-neutral-500)] - Description text color.\n */\n@customElement('hx-list-item')\nexport class HelixListItem extends HelixElement {\n  static override styles = [helixListItemStyles, forcedColorsSurface];\n\n  /**\n   * Whether the item is disabled. Prevents interaction.\n   * @attr disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Whether the item is selected (used in interactive mode).\n   * @attr selected\n   */\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  /**\n   * When set, renders the item as a link (only in non-interactive variants).\n   * @attr href\n   */\n  @property({ type: String })\n  href: string | undefined = undefined;\n\n  /**\n   * The value associated with this item (used with hx-select).\n   * @attr value\n   */\n  @property({ type: String })\n  value: string | undefined = undefined;\n\n  /**\n   * Set by the parent hx-list to indicate this item is part of an interactive listbox.\n   * Controls CSS styling and ARIA role via host attributes.\n   * @attr interactive\n   */\n  @property({ type: Boolean, reflect: true })\n  interactive = false;\n\n  /**\n   * Item type for description list variant. Use 'term' for <dt> and 'definition' for <dd>.\n   * @attr type\n   */\n  @property({ type: String, reflect: true })\n  type: 'default' | 'term' | 'definition' = 'default';\n\n  override updated(changedProps: PropertyValues<this>): void {\n    super.updated(changedProps);\n    if (\n      changedProps.has('interactive') ||\n      changedProps.has('selected') ||\n      changedProps.has('disabled')\n    ) {\n      this._syncHostAria();\n    }\n  }\n\n  /**\n   * Syncs ARIA attributes to the host element when in interactive (listbox option) mode.\n   * This ensures correct ARIA ownership: ul[role=listbox] > hx-list-item[role=option].\n   */\n  /** @internal */\n  private _syncHostAria(): void {\n    if (this.interactive) {\n      this.setAttribute('role', 'option');\n      this.setAttribute('aria-selected', String(this.selected));\n      if (this.disabled) {\n        this.setAttribute('aria-disabled', 'true');\n      } else {\n        this.removeAttribute('aria-disabled');\n      }\n      if (!this.disabled) {\n        this.setAttribute('tabindex', '0');\n      } else {\n        this.removeAttribute('tabindex');\n      }\n    } else {\n      this.removeAttribute('role');\n      this.removeAttribute('aria-selected');\n      this.removeAttribute('aria-disabled');\n      this.removeAttribute('tabindex');\n    }\n  }\n\n  /** @internal */\n  private _dispatchListItemClick(): void {\n    this.dispatchEvent(\n      new CustomEvent<{ item: HelixListItem; value: string | undefined }>('hx-list-item-click', {\n        bubbles: true,\n        composed: true,\n        detail: { item: this, value: this.value },\n      }),\n    );\n  }\n\n  /** @internal */\n  private _handleClick(e: MouseEvent): void {\n    if (this.disabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n\n    this._dispatchListItemClick();\n  }\n\n  /** @internal */\n  private _renderContent() {\n    return html`\n      <span part=\"prefix\" class=\"list-item__prefix\">\n        <slot name=\"prefix\"></slot>\n      </span>\n      <span class=\"list-item__body\">\n        <span part=\"label\" class=\"list-item__label\">\n          <slot></slot>\n        </span>\n        <span part=\"description\" class=\"list-item__description\">\n          <slot name=\"description\"></slot>\n        </span>\n      </span>\n      <span part=\"suffix\" class=\"list-item__suffix\">\n        <slot name=\"suffix\"></slot>\n      </span>\n    `;\n  }\n\n  override render() {\n    // Description list: render as <dt> (term) or <dd> (definition)\n    if (this.type === 'term') {\n      return html`\n        <dt\n          part=\"base\"\n          class=${classMap({ 'list-item': true, 'list-item--disabled': this.disabled })}\n          aria-disabled=${this.disabled ? 'true' : nothing}\n        >\n          ${this._renderContent()}\n        </dt>\n      `;\n    }\n\n    if (this.type === 'definition') {\n      return html`\n        <dd\n          part=\"base\"\n          class=${classMap({ 'list-item': true, 'list-item--disabled': this.disabled })}\n          aria-disabled=${this.disabled ? 'true' : nothing}\n        >\n          ${this._renderContent()}\n        </dd>\n      `;\n    }\n\n    // Interactive mode: role is on the host element (ARIA ownership across shadow DOM).\n    // Internal <li> uses role=\"presentation\" so AT sees: listbox > option (host).\n    if (this.interactive) {\n      // In interactive mode, links are not rendered as <a> to avoid\n      // invalid ARIA: focusable content inside role=\"option\" is prohibited.\n      return html`\n        <li\n          part=\"base\"\n          role=\"presentation\"\n          class=${classMap({\n            'list-item': true,\n            'list-item--selected': this.selected,\n            'list-item--disabled': this.disabled,\n          })}\n          @click=${this._handleClick}\n          @keydown=${this._handleKeydown}\n        >\n          ${this._renderContent()}\n        </li>\n      `;\n    }\n\n    // Non-interactive with href: render as link\n    if (this.href !== undefined && !this.disabled) {\n      return html`\n        <li\n          part=\"base\"\n          class=\"list-item\"\n          role=\"listitem\"\n          aria-disabled=${this.disabled ? 'true' : nothing}\n        >\n          <a class=\"list-item__link\" href=${ifDefined(this.href)} @click=${this._handleClick}>\n            ${this._renderContent()}\n          </a>\n        </li>\n      `;\n    }\n\n    // Default non-interactive\n    return html`\n      <li\n        part=\"base\"\n        class=${classMap({\n          'list-item': true,\n          'list-item--selected': this.selected,\n          'list-item--disabled': this.disabled,\n        })}\n        role=\"listitem\"\n        aria-disabled=${this.disabled ? 'true' : nothing}\n        @click=${this._handleClick}\n        @keydown=${this._handleKeydown}\n      >\n        ${this._renderContent()}\n      </li>\n    `;\n  }\n\n  /** @internal */\n  private _handleKeydown(e: KeyboardEvent): void {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      if (!this.disabled) {\n        this._dispatchListItemClick();\n      }\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-list-item': HelixListItem;\n  }\n}\n","import { html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { HelixElement } from '../../base/index.js';\nimport { helixListStyles } from './hx-list.styles.js';\nimport { forcedColorsSurface } from '../../styles/forced-colors.js';\nimport { HelixListItem } from './hx-list-item.js'; // real import for instanceof check and property access\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/**\n * A styled list container supporting plain, bulleted, numbered, description, and interactive variants.\n *\n * @summary Container for list items with optional dividers and interactive selection.\n *\n * @tag hx-list\n *\n * @slot - Default slot for `hx-list-item` elements.\n *\n * @fires {CustomEvent<{item: HelixListItem, value: string | undefined}>} hx-select - Dispatched\n *   when an item is clicked in interactive mode.\n *\n * @csspart base - The root list element.\n *\n * @cssprop [--hx-list-gap=0] - Gap between list items.\n * @cssprop [--hx-list-divider-color=var(--hx-color-neutral-200)] - Divider line color.\n * @cssprop [--hx-space-6] - Spacing token.\n * @cssprop [--hx-border-width-thin] - Width.\n * @cssprop [--hx-color-neutral-200] - Color.\n */\n@customElement('hx-list')\nexport class HelixList extends HelixElement {\n  static override styles = [helixListStyles, forcedColorsSurface];\n\n  /**\n   * Visual variant of the list.\n   * @attr variant\n   */\n  @property({ type: String, reflect: true })\n  variant: 'plain' | 'bulleted' | 'numbered' | 'description' | 'interactive' = 'plain';\n\n  /**\n   * Whether to show dividers between list items.\n   * @attr divided\n   */\n  @property({ type: Boolean, reflect: true })\n  divided = false;\n\n  /**\n   * Accessible label for the list. Required when variant is \"interactive\" (listbox role).\n   * @attr label\n   */\n  @property({ type: String })\n  label: string | undefined = undefined;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.addEventListener('keydown', this._handleKeydown);\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener('keydown', this._handleKeydown);\n  }\n\n  override updated(changedProps: PropertyValues<this>): void {\n    super.updated(changedProps);\n    if (changedProps.has('variant')) {\n      this._updateItemStates();\n    }\n    if (this.variant === 'interactive' && !this.label) {\n      devWarn(\n        'hx-list',\n        'The \"label\" attribute is required when variant is \"interactive\". ' +\n          'Add a label to provide an accessible name for the listbox (WCAG 2.1 SC 4.1.2).',\n      );\n    }\n  }\n\n  /**\n   * Sets the `interactive` property on all child hx-list-item elements\n   * so they can style and behave correctly without `:host-context()`.\n   */\n  /** @internal */\n  private _updateItemStates(): void {\n    const isInteractive = this.variant === 'interactive';\n    const items = this.querySelectorAll('hx-list-item');\n    for (const item of items) {\n      (item as HelixListItem).interactive = isInteractive;\n    }\n  }\n\n  /** @internal */\n  private _handleSlotChange(): void {\n    this._updateItemStates();\n  }\n\n  /** @internal */\n  private readonly _handleKeydown = (e: KeyboardEvent): void => {\n    if (this.variant !== 'interactive') return;\n\n    const items = Array.from(this.querySelectorAll<HelixListItem>('hx-list-item:not([disabled])'));\n    if (items.length === 0) return;\n\n    const focused = this.querySelector<HelixListItem>('hx-list-item:focus');\n    const currentIndex = focused ? items.indexOf(focused) : -1;\n\n    let nextIndex = currentIndex;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault();\n        nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        nextIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n        break;\n      case 'Home':\n        e.preventDefault();\n        nextIndex = 0;\n        break;\n      case 'End':\n        e.preventDefault();\n        nextIndex = items.length - 1;\n        break;\n      default:\n        return;\n    }\n\n    items[nextIndex]?.focus();\n  };\n\n  /** @internal */\n  private _handleItemClick(e: Event): void {\n    if (this.variant !== 'interactive') return;\n\n    if (!(e.target instanceof HelixListItem)) return;\n    const item = e.target;\n    if (item.disabled) return;\n\n    this.dispatchEvent(\n      new CustomEvent<{ item: HelixListItem; value: string | undefined }>('hx-select', {\n        bubbles: true,\n        composed: true,\n        detail: { item, value: item.value },\n      }),\n    );\n  }\n\n  override render() {\n    const isInteractive = this.variant === 'interactive';\n    const isNumbered = this.variant === 'numbered';\n    const isDescription = this.variant === 'description';\n\n    const slot = html`<slot @slotchange=${this._handleSlotChange}></slot>`;\n\n    if (isDescription) {\n      return html`\n        <dl\n          part=\"base\"\n          class=\"list list--${this.variant}\"\n          aria-label=${ifDefined(this.label)}\n          @hx-list-item-click=${this._handleItemClick}\n        >\n          ${slot}\n        </dl>\n      `;\n    }\n\n    if (isNumbered) {\n      return html`\n        <div\n          part=\"base\"\n          role=\"list\"\n          class=\"list list--${this.variant}\"\n          aria-label=${ifDefined(this.label)}\n          @hx-list-item-click=${this._handleItemClick}\n        >\n          ${slot}\n        </div>\n      `;\n    }\n\n    return html`\n      <div\n        part=\"base\"\n        class=\"list list--${this.variant}\"\n        role=${isInteractive ? 'listbox' : 'list'}\n        aria-label=${isInteractive ? this.label || nothing : ifDefined(this.label)}\n        aria-multiselectable=${isInteractive ? 'false' : nothing}\n        @hx-list-item-click=${this._handleItemClick}\n      >\n        ${slot}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-list': HelixList;\n  }\n}\n"],"names":["helixListStyles","css","helixListItemStyles","HelixListItem","HelixElement","changedProps","e","html","classMap","nothing","ifDefined","forcedColorsSurface","__decorateClass","property","customElement","HelixList","items","focused","currentIndex","nextIndex","_a","isInteractive","item","isNumbered","isDescription","slot"],"mappings":";;;;;;AAEO,MAAMA,IAAkBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GCAlBC,IAAsBD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACoC5B,IAAME,IAAN,cAA4BC,EAAa;AAAA,EAAzC,cAAA;AAAA,UAAA,GAAA,SAAA,GAQL,KAAA,WAAW,IAOX,KAAA,WAAW,IAOX,KAAA,OAA2B,QAO3B,KAAA,QAA4B,QAQ5B,KAAA,cAAc,IAOd,KAAA,OAA0C;AAAA,EAAA;AAAA,EAEjC,QAAQC,GAA0C;AACzD,UAAM,QAAQA,CAAY,IAExBA,EAAa,IAAI,aAAa,KAC9BA,EAAa,IAAI,UAAU,KAC3BA,EAAa,IAAI,UAAU,MAE3B,KAAK,cAAA;AAAA,EAET;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOQ,gBAAsB;AAC5B,IAAI,KAAK,eACP,KAAK,aAAa,QAAQ,QAAQ,GAClC,KAAK,aAAa,iBAAiB,OAAO,KAAK,QAAQ,CAAC,GACpD,KAAK,WACP,KAAK,aAAa,iBAAiB,MAAM,IAEzC,KAAK,gBAAgB,eAAe,GAEjC,KAAK,WAGR,KAAK,gBAAgB,UAAU,IAF/B,KAAK,aAAa,YAAY,GAAG,MAKnC,KAAK,gBAAgB,MAAM,GAC3B,KAAK,gBAAgB,eAAe,GACpC,KAAK,gBAAgB,eAAe,GACpC,KAAK,gBAAgB,UAAU;AAAA,EAEnC;AAAA;AAAA,EAGQ,yBAA+B;AACrC,SAAK;AAAA,MACH,IAAI,YAAgE,sBAAsB;AAAA,QACxF,SAAS;AAAA,QACT,UAAU;AAAA,QACV,QAAQ,EAAE,MAAM,MAAM,OAAO,KAAK,MAAA;AAAA,MAAM,CACzC;AAAA,IAAA;AAAA,EAEL;AAAA;AAAA,EAGQ,aAAaC,GAAqB;AACxC,QAAI,KAAK,UAAU;AACjB,MAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA;AACF;AAAA,IACF;AAEA,SAAK,uBAAA;AAAA,EACP;AAAA;AAAA,EAGQ,iBAAiB;AACvB,WAAOC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgBT;AAAA,EAES,SAAS;AAEhB,WAAI,KAAK,SAAS,SACTA;AAAA;AAAA;AAAA,kBAGKC,EAAS,EAAE,aAAa,IAAM,uBAAuB,KAAK,UAAU,CAAC;AAAA,0BAC7D,KAAK,WAAW,SAASC,CAAO;AAAA;AAAA,YAE9C,KAAK,gBAAgB;AAAA;AAAA,UAKzB,KAAK,SAAS,eACTF;AAAA;AAAA;AAAA,kBAGKC,EAAS,EAAE,aAAa,IAAM,uBAAuB,KAAK,UAAU,CAAC;AAAA,0BAC7D,KAAK,WAAW,SAASC,CAAO;AAAA;AAAA,YAE9C,KAAK,gBAAgB;AAAA;AAAA,UAOzB,KAAK,cAGAF;AAAA;AAAA;AAAA;AAAA,kBAIKC,EAAS;AAAA,MACf,aAAa;AAAA,MACb,uBAAuB,KAAK;AAAA,MAC5B,uBAAuB,KAAK;AAAA,IAAA,CAC7B,CAAC;AAAA,mBACO,KAAK,YAAY;AAAA,qBACf,KAAK,cAAc;AAAA;AAAA,YAE5B,KAAK,gBAAgB;AAAA;AAAA,UAMzB,KAAK,SAAS,UAAa,CAAC,KAAK,WAC5BD;AAAA;AAAA;AAAA;AAAA;AAAA,0BAKa,KAAK,WAAW,SAASE,CAAO;AAAA;AAAA,4CAEdC,EAAU,KAAK,IAAI,CAAC,WAAW,KAAK,YAAY;AAAA,cAC9E,KAAK,gBAAgB;AAAA;AAAA;AAAA,UAOxBH;AAAA;AAAA;AAAA,gBAGKC,EAAS;AAAA,MACf,aAAa;AAAA,MACb,uBAAuB,KAAK;AAAA,MAC5B,uBAAuB,KAAK;AAAA,IAAA,CAC7B,CAAC;AAAA;AAAA,wBAEc,KAAK,WAAW,SAASC,CAAO;AAAA,iBACvC,KAAK,YAAY;AAAA,mBACf,KAAK,cAAc;AAAA;AAAA,UAE5B,KAAK,gBAAgB;AAAA;AAAA;AAAA,EAG7B;AAAA;AAAA,EAGQ,eAAeH,GAAwB;AAC7C,KAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SACjCA,EAAE,eAAA,GACG,KAAK,YACR,KAAK,uBAAA;AAAA,EAGX;AACF;AA1NaH,EACK,SAAS,CAACD,GAAqBS,CAAmB;AAOlEC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAP/BV,EAQX,WAAA,YAAA,CAAA;AAOAS,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAd/BV,EAeX,WAAA,YAAA,CAAA;AAOAS,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GArBfV,EAsBX,WAAA,QAAA,CAAA;AAOAS,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA5BfV,EA6BX,WAAA,SAAA,CAAA;AAQAS,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GApC/BV,EAqCX,WAAA,eAAA,CAAA;AAOAS,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GA3C9BV,EA4CX,WAAA,QAAA,CAAA;AA5CWA,IAANS,EAAA;AAAA,EADNE,EAAc,cAAc;AAAA,GAChBX,CAAA;;;;;;ACPN,IAAMY,IAAN,cAAwBX,EAAa;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GAQL,KAAA,UAA6E,SAO7E,KAAA,UAAU,IAOV,KAAA,QAA4B,QA6C5B,KAAiB,iBAAiB,CAACE,MAA2B;;AAC5D,UAAI,KAAK,YAAY,cAAe;AAEpC,YAAMU,IAAQ,MAAM,KAAK,KAAK,iBAAgC,8BAA8B,CAAC;AAC7F,UAAIA,EAAM,WAAW,EAAG;AAExB,YAAMC,IAAU,KAAK,cAA6B,oBAAoB,GAChEC,IAAeD,IAAUD,EAAM,QAAQC,CAAO,IAAI;AAExD,UAAIE,IAAYD;AAEhB,cAAQZ,EAAE,KAAA;AAAA,QACR,KAAK;AACH,UAAAA,EAAE,eAAA,GACFa,IAAYD,IAAeF,EAAM,SAAS,IAAIE,IAAe,IAAI;AACjE;AAAA,QACF,KAAK;AACH,UAAAZ,EAAE,eAAA,GACFa,IAAYD,IAAe,IAAIA,IAAe,IAAIF,EAAM,SAAS;AACjE;AAAA,QACF,KAAK;AACH,UAAAV,EAAE,eAAA,GACFa,IAAY;AACZ;AAAA,QACF,KAAK;AACH,UAAAb,EAAE,eAAA,GACFa,IAAYH,EAAM,SAAS;AAC3B;AAAA,QACF;AACE;AAAA,MAAA;AAGJ,OAAAI,IAAAJ,EAAMG,CAAS,MAAf,QAAAC,EAAkB;AAAA,IACpB;AAAA,EAAA;AAAA,EA5ES,oBAA0B;AACjC,UAAM,kBAAA,GACN,KAAK,iBAAiB,WAAW,KAAK,cAAc;AAAA,EACtD;AAAA,EAES,uBAA6B;AACpC,UAAM,qBAAA,GACN,KAAK,oBAAoB,WAAW,KAAK,cAAc;AAAA,EACzD;AAAA,EAES,QAAQf,GAA0C;AACzD,UAAM,QAAQA,CAAY,GACtBA,EAAa,IAAI,SAAS,KAC5B,KAAK,kBAAA,GAEH,KAAK,YAAY,iBAAkB,KAAK;AAAA,EAO9C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOQ,oBAA0B;AAChC,UAAMgB,IAAgB,KAAK,YAAY,eACjCL,IAAQ,KAAK,iBAAiB,cAAc;AAClD,eAAWM,KAAQN;AAChB,MAAAM,EAAuB,cAAcD;AAAA,EAE1C;AAAA;AAAA,EAGQ,oBAA0B;AAChC,SAAK,kBAAA;AAAA,EACP;AAAA;AAAA,EAuCQ,iBAAiBf,GAAgB;AAGvC,QAFI,KAAK,YAAY,iBAEjB,EAAEA,EAAE,kBAAkBH,GAAgB;AAC1C,UAAMmB,IAAOhB,EAAE;AACf,IAAIgB,EAAK,YAET,KAAK;AAAA,MACH,IAAI,YAAgE,aAAa;AAAA,QAC/E,SAAS;AAAA,QACT,UAAU;AAAA,QACV,QAAQ,EAAE,MAAAA,GAAM,OAAOA,EAAK,MAAA;AAAA,MAAM,CACnC;AAAA,IAAA;AAAA,EAEL;AAAA,EAES,SAAS;AAChB,UAAMD,IAAgB,KAAK,YAAY,eACjCE,IAAa,KAAK,YAAY,YAC9BC,IAAgB,KAAK,YAAY,eAEjCC,IAAOlB,sBAAyB,KAAK,iBAAiB;AAE5D,WAAIiB,IACKjB;AAAA;AAAA;AAAA,8BAGiB,KAAK,OAAO;AAAA,uBACnBG,EAAU,KAAK,KAAK,CAAC;AAAA,gCACZ,KAAK,gBAAgB;AAAA;AAAA,YAEzCe,CAAI;AAAA;AAAA,UAKRF,IACKhB;AAAA;AAAA;AAAA;AAAA,8BAIiB,KAAK,OAAO;AAAA,uBACnBG,EAAU,KAAK,KAAK,CAAC;AAAA,gCACZ,KAAK,gBAAgB;AAAA;AAAA,YAEzCe,CAAI;AAAA;AAAA,UAKLlB;AAAA;AAAA;AAAA,4BAGiB,KAAK,OAAO;AAAA,eACzBc,IAAgB,YAAY,MAAM;AAAA,qBAC5BA,IAAgB,KAAK,SAASZ,IAAUC,EAAU,KAAK,KAAK,CAAC;AAAA,+BACnDW,IAAgB,UAAUZ,CAAO;AAAA,8BAClC,KAAK,gBAAgB;AAAA;AAAA,UAEzCgB,CAAI;AAAA;AAAA;AAAA,EAGZ;AACF;AAtKaV,EACK,SAAS,CAACf,GAAiBW,CAAmB;AAO9DC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAP9BE,EAQX,WAAA,WAAA,CAAA;AAOAH,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAd/BE,EAeX,WAAA,WAAA,CAAA;AAOAH,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GArBfE,EAsBX,WAAA,SAAA,CAAA;AAtBWA,IAANH,EAAA;AAAA,EADNE,EAAc,SAAS;AAAA,GACXC,CAAA;"}

package/dist/shared/hx-menu-divider-C2omnPtj.js

@@ -1,558 +0,0 @@
-import { css as p, html as u, nothing as h } from "lit";
-import { property as c, customElement as f, state as x, query as g } from "lit/decorators.js";
-import { f as v } from "./forced-colors-CTEDFRGa.js";
-import { d as y } from "./dev-warn-YlwPHjtX.js";
-import { H as b } from "./helix-element-BNEYeiys.js";
-import { classMap as k } from "lit/directives/class-map.js";
-const I = p`
-  :host {
-    display: block;
-  }
-
-  .menu {
-    display: flex;
-    flex-direction: column;
-    padding: var(--hx-space-1, 0.25rem);
-    background: var(--hx-menu-bg, var(--hx-color-surface-default, #ffffff));
-    border: var(--hx-border-width-thin, 1px) solid
-      var(--hx-menu-border-color, var(--hx-color-border-default, #d6dbd5));
-    border-radius: var(--hx-menu-border-radius, var(--hx-border-radius-md, 0.375rem));
-    box-shadow: var(
-      --hx-menu-shadow,
-      var(--hx-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1))
-    );
-    min-width: var(--hx-menu-min-width, 10rem);
-    max-height: var(--hx-menu-max-height, 20rem);
-    overflow-y: auto;
-    outline: none;
-  }
-
-  /* ─── High Contrast Mode (forced-colors) ─── */
-
-  @media (forced-colors: active) {
-    .menu {
-      background-color: Canvas;
-      border: 2px solid CanvasText;
-    }
-  }
-`;
-var w = Object.defineProperty, C = Object.getOwnPropertyDescriptor, _ = (e, t, s, n) => {
-  for (var i = n > 1 ? void 0 : n ? C(t, s) : t, r = e.length - 1, a; r >= 0; r--)
-    (a = e[r]) && (i = (n ? a(t, s, i) : a(i)) || i);
-  return n && i && w(t, s, i), i;
-};
-let d = class extends b {
-  constructor() {
-    super(...arguments), this.label = "", this._focusedIndex = -1, this._typeaheadBuffer = "", this._typeaheadTimer = null;
-  }
-  /** @internal */
-  _getItems() {
-    return Array.from(this.querySelectorAll("hx-menu-item")).filter(
-      (e) => !e.disabled && !e.loading
-    );
-  }
-  /**
-   * Synchronize roving tabindex across all enabled items.
-   * Only the active item (or first item if none active) gets tabindex=0.
-   */
-  /** @internal */
-  _syncRovingTabIndex() {
-    const e = this._getItems(), t = this._focusedIndex >= 0 ? this._focusedIndex : 0;
-    e.forEach((s, n) => {
-      s.setRovingTabIndex(n === t ? 0 : -1);
-    });
-  }
-  /** Focus the first menu item. */
-  focusFirst() {
-    const t = this._getItems()[0];
-    t !== void 0 && (this._focusedIndex = 0, this._syncRovingTabIndex(), t.focus());
-  }
-  /** Focus the last menu item. */
-  focusLast() {
-    const e = this._getItems(), t = e[e.length - 1];
-    t !== void 0 && (this._focusedIndex = e.length - 1, this._syncRovingTabIndex(), t.focus());
-  }
-  /** @internal */
-  _focusItem(e) {
-    const t = this._getItems();
-    if (t.length === 0) return;
-    this._focusedIndex = Math.max(0, Math.min(e, t.length - 1)), this._syncRovingTabIndex();
-    const s = t[this._focusedIndex];
-    s !== void 0 && s.focus();
-  }
-  /** @internal */
-  _updateFocusedIndex() {
-    var n;
-    const e = this._getItems(), t = ((n = this.shadowRoot) == null ? void 0 : n.activeElement) ?? document.activeElement, s = e.findIndex((i) => i.matches(":focus-within") || i === t);
-    s !== -1 && (this._focusedIndex = s);
-  }
-  /** @internal */
-  _handleKeyDown(e) {
-    this._updateFocusedIndex();
-    const t = this._getItems();
-    if (t.length !== 0)
-      switch (e.key) {
-        case "ArrowDown":
-          e.preventDefault(), this._focusItem(this._focusedIndex + 1 < t.length ? this._focusedIndex + 1 : 0);
-          break;
-        case "ArrowUp":
-          e.preventDefault(), this._focusItem(this._focusedIndex > 0 ? this._focusedIndex - 1 : t.length - 1);
-          break;
-        case "Home":
-          e.preventDefault(), this._focusItem(0);
-          break;
-        case "End":
-          e.preventDefault(), this._focusItem(t.length - 1);
-          break;
-        case "Escape":
-          e.preventDefault(), this.dispatchEvent(new CustomEvent("hx-close", { bubbles: !0, composed: !0 }));
-          break;
-        default:
-          e.key.length === 1 && e.key !== " " && !e.ctrlKey && !e.metaKey && !e.altKey && this._handleTypeahead(e.key, t);
-          break;
-      }
-  }
-  /** @internal */
-  _handleTypeahead(e, t) {
-    this._typeaheadTimer !== null && clearTimeout(this._typeaheadTimer), this._typeaheadBuffer += e.toLowerCase(), this._typeaheadTimer = setTimeout(() => {
-      this._typeaheadBuffer = "", this._typeaheadTimer = null;
-    }, 500);
-    const s = t.findIndex((n) => {
-      var r;
-      return n.disabled || n.hasAttribute("disabled") ? !1 : (((r = n.textContent) == null ? void 0 : r.trim().toLowerCase()) ?? "").startsWith(this._typeaheadBuffer);
-    });
-    s !== -1 && this._focusItem(s);
-  }
-  /** @internal */
-  _handleSlotChange(e) {
-    const t = e.target;
-    if (!(t instanceof HTMLSlotElement)) return;
-    const s = /* @__PURE__ */ new Set(["hx-menu-item", "hx-menu-divider"]), n = t.assignedElements().filter((i) => !s.has(i.tagName.toLowerCase()));
-    n.length > 0 && y(
-      "hx-menu",
-      `Default slot expects <hx-menu-item> or <hx-menu-divider> elements. Found unexpected: ${n.map((i) => `<${i.tagName.toLowerCase()}>`).join(", ")}`
-    ), this._syncRovingTabIndex();
-  }
-  /** @internal */
-  _handleItemSelect(e) {
-    if (!(e instanceof CustomEvent)) return;
-    const t = e.detail, s = this._getItems();
-    this._focusedIndex = s.indexOf(t.item), this.dispatchEvent(
-      new CustomEvent("hx-select", {
-        bubbles: !0,
-        composed: !0,
-        detail: { item: t.item, value: t.value }
-      })
-    );
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this._typeaheadTimer !== null && (clearTimeout(this._typeaheadTimer), this._typeaheadTimer = null);
-  }
-  firstUpdated() {
-    this.label;
-  }
-  render() {
-    return u`
-      <div
-        part="base"
-        class="menu"
-        role="menu"
-        aria-label=${this.label || "Menu"}
-        @keydown=${this._handleKeyDown}
-        @hx-item-select=${this._handleItemSelect}
-      >
-        <slot @slotchange=${this._handleSlotChange}></slot>
-      </div>
-    `;
-  }
-};
-d.styles = [I, v];
-_([
-  c({ type: String, reflect: !0 })
-], d.prototype, "label", 2);
-d = _([
-  f("hx-menu")
-], d);
-const S = p`
-  :host {
-    display: block;
-  }
-
-  :host([disabled]) {
-    pointer-events: none;
-    opacity: var(--hx-opacity-disabled, 0.5);
-  }
-
-  .menu-item {
-    display: flex;
-    align-items: center;
-    gap: var(--hx-space-2, 0.5rem);
-    min-height: var(--hx-touch-target-min, 44px);
-    padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);
-    border-radius: var(--hx-border-radius-sm, 0.25rem);
-    cursor: pointer;
-    color: var(--hx-menu-item-color, var(--hx-color-text-primary, #0d1825));
-    font-size: var(--hx-font-size-sm, 0.875rem);
-    font-family: var(--hx-menu-item-font-family, var(--hx-font-family-sans, sans-serif));
-    line-height: var(--hx-line-height-tight, 1.25);
-    user-select: none;
-    -webkit-user-select: none;
-    outline: none;
-    background: none;
-    width: 100%;
-    box-sizing: border-box;
-    transition: background-color var(--hx-transition-fast, 150ms ease);
-  }
-
-  .menu-item:hover,
-  .menu-item:focus-visible {
-    background-color: var(--hx-menu-item-hover-bg, var(--hx-color-surface-sunken, #ebeee9));
-  }
-
-  .menu-item:focus-visible {
-    outline: var(--hx-focus-ring-width, 2px) solid
-      var(--hx-menu-item-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
-    outline-offset: var(--hx-menu-item-focus-ring-offset, 0px);
-  }
-
-  .menu-item__prefix,
-  .menu-item__suffix {
-    display: inline-flex;
-    align-items: center;
-    flex-shrink: 0;
-  }
-
-  .menu-item__label {
-    flex: 1 1 auto;
-  }
-
-  .menu-item__checked-icon {
-    display: inline-flex;
-    align-items: center;
-    flex-shrink: 0;
-    width: 1em;
-    opacity: 0;
-    transition: opacity var(--hx-transition-fast, 150ms ease);
-  }
-
-  .menu-item--checked .menu-item__checked-icon {
-    opacity: 1;
-  }
-
-  .menu-item__submenu-icon {
-    display: inline-flex;
-    align-items: center;
-    flex-shrink: 0;
-    margin-inline-start: auto;
-  }
-
-  .menu-item__spinner {
-    width: 1em;
-    height: 1em;
-    flex-shrink: 0;
-    animation: hx-menu-spin var(--hx-duration-spinner, 750ms) linear infinite;
-  }
-
-  @keyframes hx-menu-spin {
-    to {
-      transform: rotate(360deg);
-    }
-  }
-
-  @media (prefers-reduced-motion: reduce) {
-    .menu-item {
-      transition: none;
-    }
-
-    .menu-item__checked-icon {
-      transition: none;
-    }
-
-    .menu-item__spinner {
-      animation: none;
-      opacity: var(--hx-opacity-muted, 0.6);
-    }
-  }
-
-  /* ─── High Contrast Mode (forced-colors) ─── */
-
-  @media (forced-colors: active) {
-    .menu-item {
-      forced-color-adjust: none;
-      color: CanvasText;
-      background-color: Canvas;
-    }
-
-    .menu-item:hover,
-    .menu-item:focus-visible {
-      background-color: Highlight;
-      color: HighlightText;
-    }
-
-    .menu-item:focus-visible {
-      outline: 2px solid Highlight;
-      outline-offset: -2px;
-    }
-
-    :host([disabled]) .menu-item {
-      color: GrayText;
-      opacity: 1;
-    }
-  }
-`;
-var T = Object.defineProperty, E = Object.getOwnPropertyDescriptor, l = (e, t, s, n) => {
-  for (var i = n > 1 ? void 0 : n ? E(t, s) : t, r = e.length - 1, a; r >= 0; r--)
-    (a = e[r]) && (i = (n ? a(t, s, i) : a(i)) || i);
-  return n && i && T(t, s, i), i;
-};
-let o = class extends b {
-  constructor() {
-    super(...arguments), this._rovingTabIndex = -1, this.value = "", this.disabled = !1, this.checked = !1, this.type = "normal", this.loading = !1, this._hasSubmenu = !1, this._submenuOpen = !1;
-  }
-  /** @internal Set the roving tabindex value. Called by parent hx-menu. */
-  setRovingTabIndex(e) {
-    this._rovingTabIndex = e;
-  }
-  /** Set whether the nested submenu is open. Called by the component managing submenu visibility. */
-  setSubmenuOpen(e) {
-    this._submenuOpen = e;
-  }
-  /** Focus the inner interactive element. */
-  focus(e) {
-    var t;
-    (t = this._menuItemEl) == null || t.focus(e);
-  }
-  connectedCallback() {
-    super.connectedCallback(), this.closest('hx-menu, hx-split-button, [role="menu"], [role="menubar"]');
-  }
-  /** @internal */
-  _handleSubmenuSlotChange(e) {
-    const t = e.target;
-    this._hasSubmenu = t.assignedElements().length > 0;
-  }
-  /** @internal */
-  _activate() {
-    if (!(this.disabled || this.loading)) {
-      if (this.type === "checkbox")
-        this.checked = !this.checked;
-      else if (this.type === "radio") {
-        const e = this.closest("hx-menu");
-        e ? e.querySelectorAll(':scope > hx-menu-item[type="radio"]').forEach((t) => {
-          t.checked = t === this;
-        }) : this.checked = !0;
-      }
-      this.dispatchEvent(
-        new CustomEvent("hx-item-select", {
-          bubbles: !0,
-          composed: !0,
-          detail: { item: this, value: this.value }
-        })
-      );
-    }
-  }
-  /** @internal */
-  _handleClick(e) {
-    if (this.disabled || this.loading) {
-      e.preventDefault(), e.stopPropagation();
-      return;
-    }
-    this._activate();
-  }
-  /** @internal */
-  _handleKeyDown(e) {
-    if (e.key === "Enter" || e.key === " ") {
-      e.preventDefault(), this._activate();
-      return;
-    }
-    if (e.key === "ArrowRight" && this._hasSubmenu) {
-      e.preventDefault(), this.dispatchEvent(
-        new CustomEvent("hx-item-submenu-open", {
-          bubbles: !0,
-          composed: !0,
-          detail: { item: this }
-        })
-      );
-      return;
-    }
-    e.key === "ArrowLeft" && (e.preventDefault(), this.dispatchEvent(
-      new CustomEvent("hx-item-submenu-close", {
-        bubbles: !0,
-        composed: !0,
-        detail: { item: this }
-      })
-    ));
-  }
-  /** @internal */
-  _renderCheckedIcon() {
-    return u`
-      <span part="checked-icon" class="menu-item__checked-icon" aria-hidden="true">
-        <svg
-          width="1em"
-          height="1em"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          stroke-width="3"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        >
-          <polyline points="20 6 9 17 4 12" />
-        </svg>
-      </span>
-    `;
-  }
-  /** @internal */
-  _renderSubmenuIcon() {
-    return u`
-      <span part="submenu-icon" class="menu-item__submenu-icon" aria-hidden="true">
-        <svg
-          width="1em"
-          height="1em"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          stroke-width="2"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        >
-          <polyline points="9 18 15 12 9 6" />
-        </svg>
-      </span>
-    `;
-  }
-  /** @internal */
-  _renderSpinner() {
-    return u`
-      <svg class="menu-item__spinner" aria-hidden="true" viewBox="0 0 24 24" fill="none">
-        <circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="3" opacity="0.3" />
-        <path
-          d="M12 2a10 10 0 0 1 10 10"
-          stroke="currentColor"
-          stroke-width="3"
-          stroke-linecap="round"
-        />
-      </svg>
-    `;
-  }
-  /** @internal */
-  _getRole() {
-    switch (this.type) {
-      case "checkbox":
-        return "menuitemcheckbox";
-      case "radio":
-        return "menuitemradio";
-      default:
-        return "menuitem";
-    }
-  }
-  render() {
-    const e = this._getRole(), t = this.type === "checkbox" || this.type === "radio", s = {
-      "menu-item": !0,
-      "menu-item--checked": this.checked
-    };
-    return u`
-      <div
-        part="base"
-        class=${k(s)}
-        role=${e}
-        tabindex=${this.disabled ? "-1" : String(this._rovingTabIndex)}
-        aria-disabled=${this.disabled ? "true" : h}
-        aria-checked=${t ? this.checked ? "true" : "false" : h}
-        aria-haspopup=${this._hasSubmenu ? "menu" : h}
-        aria-expanded=${this._hasSubmenu ? this._submenuOpen ? "true" : "false" : h}
-        aria-busy=${this.loading ? "true" : h}
-        @click=${this._handleClick}
-        @keydown=${this._handleKeyDown}
-      >
-        ${this.loading ? this._renderSpinner() : h}
-        ${t ? this._renderCheckedIcon() : h}
-        <span part="prefix" class="menu-item__prefix">
-          <slot name="prefix"></slot>
-        </span>
-        <span part="label" class="menu-item__label">
-          <slot></slot>
-        </span>
-        <span part="suffix" class="menu-item__suffix">
-          <slot name="suffix"></slot>
-        </span>
-        ${this._hasSubmenu ? this._renderSubmenuIcon() : h}
-        <slot name="submenu" @slotchange=${this._handleSubmenuSlotChange}></slot>
-      </div>
-    `;
-  }
-};
-o.styles = [S, v];
-l([
-  x()
-], o.prototype, "_rovingTabIndex", 2);
-l([
-  c({ type: String })
-], o.prototype, "value", 2);
-l([
-  c({ type: Boolean, reflect: !0 })
-], o.prototype, "disabled", 2);
-l([
-  c({ type: Boolean, reflect: !0 })
-], o.prototype, "checked", 2);
-l([
-  c({ type: String, reflect: !0 })
-], o.prototype, "type", 2);
-l([
-  c({ type: Boolean, reflect: !0 })
-], o.prototype, "loading", 2);
-l([
-  x()
-], o.prototype, "_hasSubmenu", 2);
-l([
-  x()
-], o.prototype, "_submenuOpen", 2);
-l([
-  g(".menu-item")
-], o.prototype, "_menuItemEl", 2);
-o = l([
-  f("hx-menu-item")
-], o);
-const $ = p`
-  :host {
-    display: block;
-  }
-
-  .menu-divider {
-    height: var(--hx-border-width-thin, 1px);
-    background-color: var(--hx-menu-divider-color, var(--hx-color-border-default, #d6dbd5));
-    margin: var(--hx-space-1, 0.25rem) calc(-1 * var(--hx-space-1, 0.25rem));
-  }
-
-  /* ─── High Contrast Mode (forced-colors) ─── */
-
-  @media (forced-colors: active) {
-    .menu-divider {
-      background-color: GrayText;
-    }
-  }
-`;
-var D = Object.getOwnPropertyDescriptor, O = (e, t, s, n) => {
-  for (var i = n > 1 ? void 0 : n ? D(t, s) : t, r = e.length - 1, a; r >= 0; r--)
-    (a = e[r]) && (i = a(i) || i);
-  return i;
-};
-let m = class extends b {
-  render() {
-    return u`<div
-      part="base"
-      class="menu-divider"
-      role="separator"
-      aria-orientation="horizontal"
-    ></div>`;
-  }
-};
-m.styles = [$, v];
-m = O([
-  f("hx-menu-divider")
-], m);
-export {
-  d as H,
-  m as a,
-  o as b
-};
-//# sourceMappingURL=hx-menu-divider-C2omnPtj.js.map