dap-design-system 0.62.3 → 0.62.4

package/dist/components/option-list/option-list.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"option-list.component.js","sources":["../../../src/components/option-list/option-list.component.ts"],"sourcesContent":["import clsx from 'clsx'\nimport { PropertyValueMap, unsafeCSS } from 'lit'\nimport { property, state } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { html, unsafeStatic } from 'lit/static-html.js'\n\nimport { scrollIntoContainer } from '@/common/utils'\nimport { DdsElement } from '@/internal/dds-hu-element'\nimport { SizedMixin } from '@/internal/mixin/sizedMixin'\n\nimport DapDSOptionItem from '../option-item/option-item.component'\nimport styles from './option-list.scss?inline'\n\n/**\n * `dap-ds-option-list`\n * @summary An option list is a list of selectable options.\n * @element dap-ds-option-list\n * @title - Option list\n *\n * @event {{ void }} dds-cancel - Fired when the escape key is pressed.\n * @event {{ option: DapDSOptionItem, value: string, index: number, text: string }} dds-option-change - Fired when the option list value changes.\n * @event {{ void }} dds-keydown - Fired when a key is pressed down.\n * @event {{ elements: DapDSOptionItem[] }} dds-list-changed - Fired when the available options list changes.\n *\n * @csspart base - The main option list container.\n * @csspart option-item - The option item of the option list.\n * @csspart popup-base - The base of the popup.\n * @csspart option-item-base - The base of the option item.\n * @csspart option-item-label - The label of the option item.\n * @csspart option-item-prefix - The prefix of the option item.\n * @csspart option-item-suffix - The suffix of the option item.\n *\n * @slot - The default slot for the options.\n */\nexport default class DapDSOptionList extends SizedMixin(DdsElement) {\n  static tagName = 'dap-ds-option-list'\n\n  static dependencies = {\n    'dap-ds-option-item': DapDSOptionItem,\n  }\n\n  /** The filter text of the option list */\n  @property() filterText = ''\n\n  /** The value of the option list */\n  @property({ type: String, reflect: true }) value?: string\n\n  /** The focused state of the option list. */\n  @property({ type: Boolean }) focused = false\n\n  /** Whether the option list is searchable */\n  @property({ type: Boolean }) search = false\n\n  /** The search mode of the option list. Default is `none` */\n  @property() searchMode: 'none' | 'typehead' | 'autocomplete' | 'manual' =\n    'none'\n\n  /**\n   * @ignore\n   */\n  @property({ type: String }) searchOnValueSet = 'true'\n\n  /** Whether the option list items are selectable, whether it shows the selected icon */\n  @property({ type: String }) selectable = 'true'\n\n  /**\n   * @ignore\n   */\n  @property({ type: Array })\n  public options?: any[]\n\n  /**\n   * @ignore\n   */\n  @property({ type: Boolean }) disableDelaySet = false\n\n  queryTimeout: number | undefined\n  queryString = ''\n  firstLoad = true\n\n  @state()\n  private currentOption: any\n\n  @state()\n  public selectedIndex: number\n\n  @state()\n  private optionEls: DapDSOptionItem[] = []\n\n  @state()\n  private availableOptions: DapDSOptionItem[] = []\n\n  get isAutoComplete() {\n    return this.searchMode === 'autocomplete' || this.searchMode === 'manual'\n  }\n\n  static readonly styles = unsafeCSS(styles)\n\n  protected firstUpdated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): void {\n    super.firstUpdated(_changedProperties)\n\n    this.setAttribute('role', 'listbox')\n  }\n\n  getAllOptions() {\n    const mainSlot = this.shadowRoot?.querySelector('slot')\n    const assignedElement = mainSlot?.assignedElements()[0]\n    const embeddedSlot =\n      assignedElement?.nodeName === 'SLOT'\n        ? (\n            mainSlot?.assignedElements()[0] as HTMLSlotElement\n          ).assignedElements()\n        : mainSlot?.assignedElements()\n\n    if (!embeddedSlot) {\n      return [...this.querySelectorAll<DapDSOptionItem>('dap-ds-option-item')]\n    } else {\n      return [...(embeddedSlot as DapDSOptionItem[])]\n    }\n  }\n\n  private getAllRenderedOptions(): DapDSOptionItem[] {\n    const ro =\n      this.shadowRoot?.querySelectorAll<DapDSOptionItem>('dap-ds-option-item')\n    return ro ? [...ro] : []\n  }\n\n  getAllAvailabeOptions() {\n    return this.availableOptions\n  }\n\n  getActiveOption() {\n    if (!this.currentOption) {\n      return null\n    }\n\n    const activeOption = this.getAllRenderedOptions().find(\n      el => el.value === this.currentOption.value,\n    )\n\n    return activeOption\n  }\n\n  protected updated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): void {\n    super.updated(_changedProperties)\n\n    if (\n      _changedProperties.has('value') &&\n      !_changedProperties.has('currentOption') &&\n      this.searchOnValueSet === 'true'\n    ) {\n      const option = this.availableOptions.find(\n        option => option.value === this.value,\n      )\n\n      if (option) {\n        this.changeOption(option, _changedProperties.get('value'))\n\n        this.selectedIndex = this.findIndexByValue(\n          this.availableOptions,\n          this.value,\n        )\n\n        this.emit('dds-option-change', {\n          ...this.getEventDetails(this.currentOption),\n        })\n      }\n    }\n\n    if (\n      _changedProperties.has('options') ||\n      _changedProperties.has('optionEls')\n    ) {\n      this.availableOptions = this.options || this.optionEls\n      this.emit('dds-list-changed', { elements: this.availableOptions })\n    }\n  }\n\n  protected shouldUpdate(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): boolean {\n    if (_changedProperties.has('filterText')) {\n      if (\n        this.filterText &&\n        this.searchMode !== 'none' &&\n        this.searchMode !== 'manual'\n      ) {\n        this.filterAvailableOptions()\n        this.selectedIndex = 0\n        this.setCurrentOption(this.availableOptions[0], false)\n        this.emit('dds-list-changed', { elements: this.availableOptions })\n      } else if (this.filterText && this.searchMode === 'manual') {\n        if (this.selectedIndex === -1 && this.availableOptions.length > 0) {\n          this.selectedIndex = 0\n          this.setCurrentOption(this.availableOptions[0], false)\n        }\n      } else if (this.filterText && this.searchMode === 'none') {\n        this.filterAvailableOptions()\n        this.selectedIndex = -1\n        this.setCurrentOption(null, false)\n        this.setSelectedOption()\n        this.emit('dds-list-changed', { elements: this.availableOptions })\n      } else {\n        this.availableOptions = this.options || this.optionEls\n        this.selectedIndex = -1\n        this.setCurrentOption(null, false)\n        this.emit('dds-list-changed', { elements: this.availableOptions })\n      }\n    }\n\n    return super.shouldUpdate(_changedProperties)\n  }\n\n  public filterAvailableOptions(): void {\n    const valueLowerCase = this.filterText.toLowerCase()\n    this.availableOptions = (this.options || this.optionEls).filter(item => {\n      if (!item.disabled) {\n        const itemTextLowerCase = item.optionText.toLowerCase()\n        return itemTextLowerCase.startsWith(valueLowerCase)\n      }\n    })\n  }\n\n  attributeChangedCallback(name: string, oldValue: any, newValue: any) {\n    super.attributeChangedCallback(name, oldValue, newValue)\n    if (\n      name === 'value' &&\n      oldValue !== newValue &&\n      this.searchOnValueSet === 'true'\n    ) {\n      if (newValue) {\n        const option = this.availableOptions.find(el => el.value === newValue)\n\n        this.setSelectedOption(option)\n        this.selectionChanged(option)\n\n        this.emit('dds-option-change', {\n          ...this.getEventDetails(this.currentOption),\n        })\n      } else {\n        this.setSelectedOption()\n        this.selectionChanged()\n      }\n    }\n  }\n\n  public setOptionsFromSlottedItems(): void {\n    const elements = this.getAllOptions()\n    this.availableOptions = elements\n    this.optionEls = elements\n  }\n\n  private handleKeydown(event: KeyboardEvent): void {\n    // Keydown only reaches the list while focus is inside it. Focus can arrive\n    // via Tab (not captureFocus), so mark the list focused or every key is ignored.\n    this.focused = true\n\n    // Tab and Escape must always work so keyboard users can leave the list\n    // (WCAG 2.1.2). Tab keeps its native behaviour; the host closes the popup.\n    if (event.key === 'Tab' || event.key === 'Escape') {\n      if (event.key === 'Escape') {\n        event.preventDefault()\n        this.emit('dds-cancel')\n      }\n      this.emit('dds-keydown', { key: event.key, code: event.code })\n      return\n    }\n\n    event.preventDefault()\n\n    this.handleKeyCodes(event.key, event.code)\n  }\n\n  private scrollToActiveOption(): void {\n    if (!this.currentOption) {\n      return\n    }\n\n    const activeOption = this.getAllRenderedOptions().find(\n      el => el.value === this.currentOption.value,\n    )\n\n    if (activeOption) {\n      // Scroll only within the list's own scroll container. A plain\n      // scrollIntoView would also scroll every ancestor (modal body, page),\n      // pushing the trigger out of the viewport and tripping the popup's\n      // viewport auto-close so the dropdown snaps shut on open.\n      scrollIntoContainer(activeOption)\n    }\n  }\n\n  private handleNavigationKey(key: string): void {\n    if (key === 'ArrowDown') {\n      this.selectedIndex = this.findNearestEnabled(\n        this.availableOptions,\n        this.selectedIndex,\n        1,\n      )\n    } else if (key === 'ArrowUp') {\n      const nearest = this.findNearestEnabled(\n        this.availableOptions,\n        this.selectedIndex,\n        this.selectedIndex === -1 ? 1 : -1,\n      )\n      this.selectedIndex =\n        nearest === this.availableOptions.length ? -1 : nearest\n    } else if (key === 'Home') {\n      this.selectedIndex = this.availableOptions[0]?.disabled\n        ? this.findNearestEnabled(this.availableOptions, -1, 1)\n        : 0\n    } else if (key === 'End') {\n      const nearest = this.findNearestEnabled(\n        this.availableOptions,\n        this.availableOptions.length,\n        -1,\n      )\n      this.selectedIndex =\n        nearest === this.availableOptions.length ? -1 : nearest\n    }\n  }\n\n  private handleActionKey(key: string): void {\n    if (key === 'Enter') {\n      this.setSelectedOption(this.availableOptions[this.selectedIndex])\n      this.selectionChanged(this.availableOptions[this.selectedIndex])\n      this.emit('dds-option-change', {\n        ...this.getEventDetails(this.currentOption),\n      })\n    }\n  }\n\n  private handleTypeheadKey(key: string): void {\n    if (\n      this.searchMode === 'typehead' &&\n      (key?.length === 1 || key === 'Backspace')\n    ) {\n      this.buildQueryString(key)\n    }\n  }\n\n  private handleKeyCodes(key: string, keyCode?: string) {\n    if (!this.focused) {\n      return\n    }\n\n    this.handleNavigationKey(key)\n    this.handleActionKey(key)\n    this.handleTypeheadKey(key)\n\n    if (this.selectedIndex >= 0) {\n      const option = this.availableOptions[this.selectedIndex]\n      this.setCurrentOption(option)\n      this.emit('dds-keydown', {\n        code: keyCode,\n        key,\n        ...this.getEventDetails(option),\n      })\n    }\n  }\n\n  private getEventDetails(option?: DapDSOptionItem) {\n    if (!option) {\n      return undefined\n    }\n\n    let opt = option\n\n    if (option.tagName !== 'DAP-DS-OPTION-ITEM') {\n      opt = option.closest('dap-ds-option-item')!\n    }\n\n    return {\n      opt,\n      value: opt?.value,\n      text: opt?.optionText,\n      index: this.selectedIndex,\n    }\n  }\n\n  private findNearestEnabled(\n    allOptions: DapDSOptionItem[],\n    current: number,\n    step: number,\n  ) {\n    let nextIndex: number = current\n    let nextOption: DapDSOptionItem\n\n    do {\n      nextIndex += step\n      nextOption = allOptions[nextIndex]\n      if (nextOption === undefined) {\n        break\n      }\n    } while (nextOption?.disabled)\n\n    return nextOption ? nextIndex : current\n  }\n\n  private findIndexByValue(\n    allOptions: DapDSOptionItem[],\n    value?: string,\n  ): number {\n    return allOptions.findIndex(option => option.value === value)\n  }\n\n  private clearItemFocusStates() {\n    this.availableOptions.forEach(el => {\n      el.focused = false\n      el.tabIndex = -1\n    })\n  }\n\n  // Only set the current option without selecting it, eg: focus\n  private setCurrentOption(option?: DapDSOptionItem | null, setFocus = true) {\n    this.clearItemFocusStates()\n\n    if (option) {\n      this.currentOption = option\n      option.focused = true\n      option.tabIndex = 0\n\n      this.emit('dds-current-change', {\n        ...this.getEventDetails(option),\n      })\n\n      if (setFocus) {\n        this.setFocusedOption(option)\n      } else {\n        this.scrollToActiveOption()\n      }\n    } else {\n      this.currentOption = null\n\n      this.emit('dds-current-change', null)\n    }\n  }\n\n  private setFocusedOption(option: DapDSOptionItem) {\n    const renderedItem = this.getAllRenderedOptions().find(\n      el => el.value === option.value,\n    )\n\n    if (renderedItem) {\n      // preventScroll so native focus doesn't scroll ancestor containers (modal\n      // body, page); scrollToActiveOption reveals it within the list instead.\n      renderedItem.focus({ preventScroll: true })\n    }\n  }\n\n  private setSelectedOption(option?: DapDSOptionItem | undefined) {\n    this.availableOptions.forEach(el => (el.selected = false))\n\n    if (option) {\n      this.currentOption = option\n\n      option.selected = true\n    }\n  }\n\n  private selectionChanged(option?: DapDSOptionItem | undefined, value?: any) {\n    const oldValue = value || this.value\n\n    if (option) {\n      if (option.value !== oldValue) {\n        this.value = option.value\n      }\n    }\n  }\n\n  private changeOption(option: DapDSOptionItem, value?: any) {\n    if (option && !option.disabled) {\n      this.selectedIndex = this.findIndexByValue(\n        this.availableOptions,\n        option.value,\n      )\n\n      this.setSelectedOption(option)\n      this.setCurrentOption(option)\n      this.selectionChanged(option, value)\n    }\n  }\n\n  private readonly handleOptionClick = (event: MouseEvent) => {\n    this.focused = true\n    const option = event.target as DapDSOptionItem\n\n    if (option && !option.disabled) {\n      const isModifierKeyPressed = event.ctrlKey || event.metaKey\n      const isAlreadySelected = option.selected\n\n      if (isModifierKeyPressed && isAlreadySelected) {\n        // Find the empty item (with \"empty\" attribute) to select automatically\n        const emptyItem = this.availableOptions.find(opt =>\n          opt.hasAttribute('empty'),\n        )\n\n        if (emptyItem) {\n          // Select the empty item automatically\n          this.setSelectedOption(emptyItem)\n          this.setCurrentOption(emptyItem)\n          this.value = emptyItem.value\n          this.selectedIndex = this.findIndexByValue(\n            this.availableOptions,\n            emptyItem.value,\n          )\n\n          this.emit('dds-option-change', {\n            ...this.getEventDetails(emptyItem),\n          })\n        } else {\n          // Fallback to original behavior if no empty item found\n          this.setSelectedOption(undefined)\n          this.setCurrentOption(null)\n          this.value = undefined\n          this.selectedIndex = -1\n\n          this.emit('dds-option-deselect', {\n            option: option,\n            value: undefined,\n            index: -1,\n            text: option.optionText,\n          })\n        }\n\n        return\n      }\n\n      this.setCurrentOption(option)\n      this.setSelectedOption(option)\n      this.selectionChanged(option)\n\n      this.updateComplete.then(() => {\n        this.selectedIndex = this.findIndexByValue(\n          this.availableOptions,\n          this.value,\n        )\n\n        if (!this.disableDelaySet) {\n          this.emit('dds-option-change', {\n            ...this.getEventDetails(this.currentOption),\n          })\n        }\n      })\n    } else {\n      event.preventDefault()\n      event.stopPropagation()\n    }\n  }\n\n  getSearchString = (char: string) => {\n    if (typeof this.queryTimeout === 'number') {\n      window.clearTimeout(this.queryTimeout)\n    }\n\n    this.queryTimeout = window.setTimeout(() => {\n      this.queryString = ''\n    }, 500)\n\n    this.queryString += char\n    return this.queryString\n  }\n\n  buildQueryString = (char: string) => {\n    const queryString = this.getSearchString(char)\n\n    for (const option of this.availableOptions) {\n      const label = option.optionText.toLowerCase()\n\n      if (label.startsWith(queryString.toLowerCase())) {\n        this.selectedIndex = this.findIndexByValue(\n          this.availableOptions,\n          option.value,\n        )\n        this.setCurrentOption(option)\n        break\n      }\n    }\n  }\n\n  private handleInitialFocus(): void {\n    if (!this.value && this.selectedIndex < 0) {\n      this.selectedIndex = 0\n    } else {\n      const index = this.value\n        ? this.findIndexByValue(this.availableOptions, this.value)\n        : this.selectedIndex\n\n      if (index !== -1 && !this.isAutoComplete) {\n        this.selectedIndex = index\n        this.setCurrentOption(this.availableOptions[this.selectedIndex])\n        this.setSelectedOption(this.availableOptions[this.selectedIndex])\n        if (this.value) {\n          this.selectionChanged(this.availableOptions[this.selectedIndex])\n        }\n      }\n    }\n\n    if (!this.selectedIndex) {\n      this.setCurrentOption(this.availableOptions[0])\n      this.setSelectedOption(this.availableOptions[0])\n    }\n  }\n\n  private handleKeyFocus(key: string): void {\n    if (this.isAutoComplete || this.searchMode === 'none') {\n      this.handleKeyCodes(key)\n      this.setCurrentOption(this.availableOptions[this.selectedIndex], false)\n      this.setSelectedOption(this.availableOptions[this.selectedIndex])\n    }\n\n    if (this.searchMode === 'typehead') {\n      this.buildQueryString(key)\n    }\n  }\n\n  public captureFocus(key?: string): void {\n    this.focused = true\n    this.focus()\n\n    if (!key) {\n      this.handleInitialFocus()\n    } else {\n      this.handleKeyFocus(key)\n    }\n\n    // The popup constrains its scroll container's max-height via floating-ui one\n    // animation frame after opening. At this point that constraint isn't applied\n    // yet (clientHeight === scrollHeight), so the container isn't scrollable and\n    // both native focus() scrolling and scrollIntoView are no-ops. Defer the\n    // scroll to the next frame so the selected option is actually revealed.\n    if (typeof requestAnimationFrame === 'function') {\n      requestAnimationFrame(() => this.scrollToActiveOption())\n    }\n  }\n\n  public removeFocus(): void {\n    this.focused = false\n    this.clearItemFocusStates()\n  }\n\n  private handleSlotChange() {\n    const allOptions = this.getAllOptions()\n    this.setOptionsFromSlottedItems()\n\n    if (allOptions.length > 0 && this.searchOnValueSet === 'true') {\n      const option = allOptions.find(el => el.value === this.value)\n      this.setSelectedOption(option)\n      this.selectionChanged(option)\n\n      if (this.currentOption) {\n        this.selectedIndex = this.findIndexByValue(allOptions, this.value)\n        this.emit('dds-option-change', {\n          ...this.getEventDetails(this.currentOption),\n        })\n      }\n    } else if (allOptions.length > 0 && !this.search && !this.isAutoComplete) {\n      const firstOption = allOptions.find(option => !option.disabled)\n      this.selectedIndex = 0\n      this.setCurrentOption(firstOption, false)\n\n      this.emit('dds-current-change', {\n        ...this.getEventDetails(firstOption),\n      })\n    } else if (allOptions.length > 0 && (this.search || this.isAutoComplete)) {\n      const firstOption = allOptions.find(option => !option.disabled)\n\n      if (\n        !this.currentOption ||\n        this.currentOption.value !== firstOption?.value\n      ) {\n        this.selectedIndex = 0\n        this.setCurrentOption(firstOption, false)\n      }\n    }\n  }\n\n  render() {\n    return html`<div\n      part=\"base\"\n      class=${clsx('option-list', {\n        'option-list--sm': this.size === 'sm',\n        'option-list--lg': this.size === 'lg',\n      })}\n      @keydown=${this.handleKeydown}\n      @focus=${this.captureFocus}>\n      ${this.availableOptions.map(\n        (option, index) => html`\n          <dap-ds-option-item\n            size=${this.size}\n            part=\"option-item\"\n            exportparts=\"base: option-item-base, label: option-item-label, prefix: option-item-prefix, suffix: option-item-suffix\"\n            ?disabled=${option.disabled}\n            ?selected=${this.value === option.value}\n            ?focused=${index === this.selectedIndex}\n            label=${ifDefined(option.label)}\n            role=\"option\"\n            value=${option.value}\n            tabIndex=${option.tabIndex}\n            id=${option.id || `dap-ds-option-${option.value}`}\n            data-testid=${ifDefined(option.dataset.testid || undefined)}\n            selectable=${this.selectable}\n            @click=${this.handleOptionClick}>\n            ${unsafeStatic(option.innerHTML)}\n          </dap-ds-option-item>\n        `,\n      )}\n      <slot hidden @slotchange=${this.handleSlotChange}></slot>\n    </div> `\n  }\n}\n"],"names":["_DapDSOptionList","SizedMixin","DdsElement","event","option","isModifierKeyPressed","isAlreadySelected","emptyItem","opt","__spreadValues","char","queryString","_changedProperties","mainSlot","_a","assignedElement","embeddedSlot","ro","el","valueLowerCase","item","name","oldValue","newValue","elements","activeOption","scrollIntoContainer","key","nearest","keyCode","allOptions","current","step","nextIndex","nextOption","value","setFocus","renderedItem","index","firstOption","html","clsx","ifDefined","unsafeStatic","DapDSOptionItem","unsafeCSS","styles","DapDSOptionList","__decorateClass","property","state"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCqB,MAAAA,IAAA,MAAAA,UAAwBC,EAAWC,CAAU,EAAE;AAAA,EAApE,cAAA;AAAA,UAAA,GAAA,SAAA,GAQ2B,KAAA,aAAA,IAMc,KAAA,UAAA,IAGD,KAAA,SAAA,IAIpC,KAAA,aAAA,QAK6C,KAAA,mBAAA,QAGN,KAAA,aAAA,QAWM,KAAA,kBAAA,IAGjC,KAAA,cAAA,IACF,KAAA,YAAA,IASZ,KAAQ,YAA+B,CAAC,GAGxC,KAAQ,mBAAsC,CAAC,GA4Y9B,KAAA,oBAAoB,CAACC,MAAsB;AAC1D,WAAK,UAAU;AACf,YAAMC,IAASD,EAAM;AAEjB,UAAAC,KAAU,CAACA,EAAO,UAAU;AACxB,cAAAC,IAAuBF,EAAM,WAAWA,EAAM,SAC9CG,IAAoBF,EAAO;AAEjC,YAAIC,KAAwBC,GAAmB;AAEvC,gBAAAC,IAAY,KAAK,iBAAiB;AAAA,YAAK,CAAAC,MAC3CA,EAAI,aAAa,OAAO;AAAA,UAC1B;AAEA,UAAID,KAEF,KAAK,kBAAkBA,CAAS,GAChC,KAAK,iBAAiBA,CAAS,GAC/B,KAAK,QAAQA,EAAU,OACvB,KAAK,gBAAgB,KAAK;AAAA,YACxB,KAAK;AAAA,YACLA,EAAU;AAAA,UACZ,GAEA,KAAK,KAAK,qBAAqBE,EAAA,IAC1B,KAAK,gBAAgBF,CAAS,EAClC,MAGD,KAAK,kBAAkB,MAAS,GAChC,KAAK,iBAAiB,IAAI,GAC1B,KAAK,QAAQ,QACb,KAAK,gBAAgB,IAErB,KAAK,KAAK,uBAAuB;AAAA,YAC/B,QAAAH;AAAA,YACA,OAAO;AAAA,YACP,OAAO;AAAA,YACP,MAAMA,EAAO;AAAA,UAAA,CACd;AAGH;AAAA,QAAA;AAGF,aAAK,iBAAiBA,CAAM,GAC5B,KAAK,kBAAkBA,CAAM,GAC7B,KAAK,iBAAiBA,CAAM,GAEvB,KAAA,eAAe,KAAK,MAAM;AAC7B,eAAK,gBAAgB,KAAK;AAAA,YACxB,KAAK;AAAA,YACL,KAAK;AAAA,UACP,GAEK,KAAK,mBACR,KAAK,KAAK,qBAAqBK,EAAA,IAC1B,KAAK,gBAAgB,KAAK,aAAa,EAC3C;AAAA,QACH,CACD;AAAA,MAAA;AAED,QAAAN,EAAM,eAAe,GACrBA,EAAM,gBAAgB;AAAA,IAE1B,GAEA,KAAA,kBAAkB,CAACO,OACb,OAAO,KAAK,gBAAiB,YACxB,OAAA,aAAa,KAAK,YAAY,GAGlC,KAAA,eAAe,OAAO,WAAW,MAAM;AAC1C,WAAK,cAAc;AAAA,OAClB,GAAG,GAEN,KAAK,eAAeA,GACb,KAAK,cAGd,KAAA,mBAAmB,CAACA,MAAiB;AAC7B,YAAAC,IAAc,KAAK,gBAAgBD,CAAI;AAElC,iBAAAN,KAAU,KAAK;AAGxB,YAFcA,EAAO,WAAW,YAAY,EAElC,WAAWO,EAAY,YAAa,CAAA,GAAG;AAC/C,eAAK,gBAAgB,KAAK;AAAA,YACxB,KAAK;AAAA,YACLP,EAAO;AAAA,UACT,GACA,KAAK,iBAAiBA,CAAM;AAC5B;AAAA,QAAA;AAAA,IAGN;AAAA,EAAA;AAAA,EAzeA,IAAI,iBAAiB;AACnB,WAAO,KAAK,eAAe,kBAAkB,KAAK,eAAe;AAAA,EAAA;AAAA,EAKzD,aACRQ,GACM;AACN,UAAM,aAAaA,CAAkB,GAEhC,KAAA,aAAa,QAAQ,SAAS;AAAA,EAAA;AAAA,EAGrC,gBAAgB;;AACd,UAAMC,KAAWC,IAAA,KAAK,eAAL,gBAAAA,EAAiB,cAAc,SAC1CC,IAAkBF,KAAA,gBAAAA,EAAU,mBAAmB,IAC/CG,KACJD,KAAA,gBAAAA,EAAiB,cAAa,UAExBF,KAAA,gBAAAA,EAAU,mBAAmB,IAC7B,qBACFA,KAAA,gBAAAA,EAAU;AAEhB,WAAKG,IAGI,CAAC,GAAIA,CAAkC,IAFvC,CAAC,GAAG,KAAK,iBAAkC,oBAAoB,CAAC;AAAA,EAGzE;AAAA,EAGM,wBAA2C;;AACjD,UAAMC,KACJH,IAAA,KAAK,eAAL,gBAAAA,EAAiB,iBAAkC;AACrD,WAAOG,IAAK,CAAC,GAAGA,CAAE,IAAI,CAAC;AAAA,EAAA;AAAA,EAGzB,wBAAwB;AACtB,WAAO,KAAK;AAAA,EAAA;AAAA,EAGd,kBAAkB;AACZ,WAAC,KAAK,gBAIW,KAAK,sBAAA,EAAwB;AAAA,MAChD,CAAMC,MAAAA,EAAG,UAAU,KAAK,cAAc;AAAA,IACxC,IALS;AAAA,EAOF;AAAA,EAGC,QACRN,GACM;AAIJ,QAHF,MAAM,QAAQA,CAAkB,GAG9BA,EAAmB,IAAI,OAAO,KAC9B,CAACA,EAAmB,IAAI,eAAe,KACvC,KAAK,qBAAqB,QAC1B;AACM,YAAAR,IAAS,KAAK,iBAAiB;AAAA,QACnC,CAAAA,MAAUA,EAAO,UAAU,KAAK;AAAA,MAClC;AAEA,MAAIA,MACF,KAAK,aAAaA,GAAQQ,EAAmB,IAAI,OAAO,CAAC,GAEzD,KAAK,gBAAgB,KAAK;AAAA,QACxB,KAAK;AAAA,QACL,KAAK;AAAA,MACP,GAEA,KAAK,KAAK,qBAAqBH,EAAA,IAC1B,KAAK,gBAAgB,KAAK,aAAa,EAC3C;AAAA,IACH;AAGF,KACEG,EAAmB,IAAI,SAAS,KAChCA,EAAmB,IAAI,WAAW,OAE7B,KAAA,mBAAmB,KAAK,WAAW,KAAK,WAC7C,KAAK,KAAK,oBAAoB,EAAE,UAAU,KAAK,kBAAkB;AAAA,EACnE;AAAA,EAGQ,aACRA,GACS;AACL,WAAAA,EAAmB,IAAI,YAAY,MAEnC,KAAK,cACL,KAAK,eAAe,UACpB,KAAK,eAAe,YAEpB,KAAK,uBAAuB,GAC5B,KAAK,gBAAgB,GACrB,KAAK,iBAAiB,KAAK,iBAAiB,CAAC,GAAG,EAAK,GACrD,KAAK,KAAK,oBAAoB,EAAE,UAAU,KAAK,kBAAkB,KACxD,KAAK,cAAc,KAAK,eAAe,WAC5C,KAAK,kBAAkB,MAAM,KAAK,iBAAiB,SAAS,MAC9D,KAAK,gBAAgB,GACrB,KAAK,iBAAiB,KAAK,iBAAiB,CAAC,GAAG,EAAK,KAE9C,KAAK,cAAc,KAAK,eAAe,UAChD,KAAK,uBAAuB,GAC5B,KAAK,gBAAgB,IAChB,KAAA,iBAAiB,MAAM,EAAK,GACjC,KAAK,kBAAkB,GACvB,KAAK,KAAK,oBAAoB,EAAE,UAAU,KAAK,kBAAkB,MAE5D,KAAA,mBAAmB,KAAK,WAAW,KAAK,WAC7C,KAAK,gBAAgB,IAChB,KAAA,iBAAiB,MAAM,EAAK,GACjC,KAAK,KAAK,oBAAoB,EAAE,UAAU,KAAK,kBAAkB,KAI9D,MAAM,aAAaA,CAAkB;AAAA,EAAA;AAAA,EAGvC,yBAA+B;AAC9B,UAAAO,IAAiB,KAAK,WAAW,YAAY;AACnD,SAAK,oBAAoB,KAAK,WAAW,KAAK,WAAW,OAAO,CAAQC,MAAA;AAClE,UAAA,CAACA,EAAK;AAED,eADmBA,EAAK,WAAW,YAAY,EAC7B,WAAWD,CAAc;AAAA,IACpD,CACD;AAAA,EAAA;AAAA,EAGH,yBAAyBE,GAAcC,GAAeC,GAAe;AAEnE,QADM,MAAA,yBAAyBF,GAAMC,GAAUC,CAAQ,GAErDF,MAAS,WACTC,MAAaC,KACb,KAAK,qBAAqB;AAE1B,UAAIA,GAAU;AACZ,cAAMnB,IAAS,KAAK,iBAAiB,KAAK,CAAMc,MAAAA,EAAG,UAAUK,CAAQ;AAErE,aAAK,kBAAkBnB,CAAM,GAC7B,KAAK,iBAAiBA,CAAM,GAE5B,KAAK,KAAK,qBAAqBK,EAAA,IAC1B,KAAK,gBAAgB,KAAK,aAAa,EAC3C;AAAA,MAAA;AAED,aAAK,kBAAkB,GACvB,KAAK,iBAAiB;AAAA,EAE1B;AAAA,EAGK,6BAAmC;AAClC,UAAAe,IAAW,KAAK,cAAc;AACpC,SAAK,mBAAmBA,GACxB,KAAK,YAAYA;AAAA,EAAA;AAAA,EAGX,cAAcrB,GAA4B;AAOhD,QAJA,KAAK,UAAU,IAIXA,EAAM,QAAQ,SAASA,EAAM,QAAQ,UAAU;AAC7C,MAAAA,EAAM,QAAQ,aAChBA,EAAM,eAAe,GACrB,KAAK,KAAK,YAAY,IAEnB,KAAA,KAAK,eAAe,EAAE,KAAKA,EAAM,KAAK,MAAMA,EAAM,MAAM;AAC7D;AAAA,IAAA;AAGF,IAAAA,EAAM,eAAe,GAErB,KAAK,eAAeA,EAAM,KAAKA,EAAM,IAAI;AAAA,EAAA;AAAA,EAGnC,uBAA6B;AAC/B,QAAA,CAAC,KAAK;AACR;AAGI,UAAAsB,IAAe,KAAK,sBAAA,EAAwB;AAAA,MAChD,CAAMP,MAAAA,EAAG,UAAU,KAAK,cAAc;AAAA,IACxC;AAEA,IAAIO,KAKFC,EAAoBD,CAAY;AAAA,EAClC;AAAA,EAGM,oBAAoBE,GAAmB;;AAC7C,QAAIA,MAAQ;AACV,WAAK,gBAAgB,KAAK;AAAA,QACxB,KAAK;AAAA,QACL,KAAK;AAAA,QACL;AAAA,MACF;AAAA,aACSA,MAAQ,WAAW;AAC5B,YAAMC,IAAU,KAAK;AAAA,QACnB,KAAK;AAAA,QACL,KAAK;AAAA,QACL,KAAK,kBAAkB,KAAK,IAAI;AAAA,MAClC;AACA,WAAK,gBACHA,MAAY,KAAK,iBAAiB,SAAS,KAAKA;AAAA,IAAA,WACzCD,MAAQ;AACjB,WAAK,iBAAgBb,IAAA,KAAK,iBAAiB,CAAC,MAAvB,QAAAA,EAA0B,WAC3C,KAAK,mBAAmB,KAAK,kBAAkB,IAAI,CAAC,IACpD;AAAA,aACKa,MAAQ,OAAO;AACxB,YAAMC,IAAU,KAAK;AAAA,QACnB,KAAK;AAAA,QACL,KAAK,iBAAiB;AAAA,QACtB;AAAA,MACF;AACA,WAAK,gBACHA,MAAY,KAAK,iBAAiB,SAAS,KAAKA;AAAA,IAAA;AAAA,EACpD;AAAA,EAGM,gBAAgBD,GAAmB;AACzC,IAAIA,MAAQ,YACV,KAAK,kBAAkB,KAAK,iBAAiB,KAAK,aAAa,CAAC,GAChE,KAAK,iBAAiB,KAAK,iBAAiB,KAAK,aAAa,CAAC,GAC/D,KAAK,KAAK,qBAAqBlB,EAAA,IAC1B,KAAK,gBAAgB,KAAK,aAAa,EAC3C;AAAA,EACH;AAAA,EAGM,kBAAkBkB,GAAmB;AAC3C,IACE,KAAK,eAAe,gBACnBA,KAAA,gBAAAA,EAAK,YAAW,KAAKA,MAAQ,gBAE9B,KAAK,iBAAiBA,CAAG;AAAA,EAC3B;AAAA,EAGM,eAAeA,GAAaE,GAAkB;AAChD,QAAC,KAAK,YAIV,KAAK,oBAAoBF,CAAG,GAC5B,KAAK,gBAAgBA,CAAG,GACxB,KAAK,kBAAkBA,CAAG,GAEtB,KAAK,iBAAiB,IAAG;AAC3B,YAAMvB,IAAS,KAAK,iBAAiB,KAAK,aAAa;AACvD,WAAK,iBAAiBA,CAAM,GAC5B,KAAK,KAAK,eAAeK,EAAA;AAAA,QACvB,MAAMoB;AAAA,QACN,KAAAF;AAAA,SACG,KAAK,gBAAgBvB,CAAM,EAC/B;AAAA,IAAA;AAAA,EACH;AAAA,EAGM,gBAAgBA,GAA0B;AAChD,QAAI,CAACA;AACI;AAGT,QAAII,IAAMJ;AAEN,WAAAA,EAAO,YAAY,yBACfI,IAAAJ,EAAO,QAAQ,oBAAoB,IAGpC;AAAA,MACL,KAAAI;AAAA,MACA,OAAOA,KAAA,gBAAAA,EAAK;AAAA,MACZ,MAAMA,KAAA,gBAAAA,EAAK;AAAA,MACX,OAAO,KAAK;AAAA,IACd;AAAA,EAAA;AAAA,EAGM,mBACNsB,GACAC,GACAC,GACA;AACA,QAAIC,IAAoBF,GACpBG;AAED;AAGD,UAFaD,KAAAD,GACbE,IAAaJ,EAAWG,CAAS,GAC7BC,MAAe;AACjB;AAAA,WAEKA,KAAA,QAAAA,EAAY;AAErB,WAAOA,IAAaD,IAAYF;AAAA,EAAA;AAAA,EAG1B,iBACND,GACAK,GACQ;AACR,WAAOL,EAAW,UAAU,CAAU1B,MAAAA,EAAO,UAAU+B,CAAK;AAAA,EAAA;AAAA,EAGtD,uBAAuB;AACxB,SAAA,iBAAiB,QAAQ,CAAMjB,MAAA;AAClC,MAAAA,EAAG,UAAU,IACbA,EAAG,WAAW;AAAA,IAAA,CACf;AAAA,EAAA;AAAA;AAAA,EAIK,iBAAiBd,GAAiCgC,IAAW,IAAM;AACzE,SAAK,qBAAqB,GAEtBhC,KACF,KAAK,gBAAgBA,GACrBA,EAAO,UAAU,IACjBA,EAAO,WAAW,GAElB,KAAK,KAAK,sBAAsBK,EAAA,IAC3B,KAAK,gBAAgBL,CAAM,EAC/B,GAEGgC,IACF,KAAK,iBAAiBhC,CAAM,IAE5B,KAAK,qBAAqB,MAG5B,KAAK,gBAAgB,MAEhB,KAAA,KAAK,sBAAsB,IAAI;AAAA,EACtC;AAAA,EAGM,iBAAiBA,GAAyB;AAC1C,UAAAiC,IAAe,KAAK,sBAAA,EAAwB;AAAA,MAChD,CAAAnB,MAAMA,EAAG,UAAUd,EAAO;AAAA,IAC5B;AAEA,IAAIiC,KAGFA,EAAa,MAAM,EAAE,eAAe,GAAA,CAAM;AAAA,EAC5C;AAAA,EAGM,kBAAkBjC,GAAsC;AAC9D,SAAK,iBAAiB,QAAQ,CAAOc,MAAAA,EAAG,WAAW,EAAM,GAErDd,MACF,KAAK,gBAAgBA,GAErBA,EAAO,WAAW;AAAA,EACpB;AAAA,EAGM,iBAAiBA,GAAsC+B,GAAa;AACpE,UAAAb,IAAWa,KAAS,KAAK;AAE/B,IAAI/B,KACEA,EAAO,UAAUkB,MACnB,KAAK,QAAQlB,EAAO;AAAA,EAExB;AAAA,EAGM,aAAaA,GAAyB+B,GAAa;AACrD,IAAA/B,KAAU,CAACA,EAAO,aACpB,KAAK,gBAAgB,KAAK;AAAA,MACxB,KAAK;AAAA,MACLA,EAAO;AAAA,IACT,GAEA,KAAK,kBAAkBA,CAAM,GAC7B,KAAK,iBAAiBA,CAAM,GACvB,KAAA,iBAAiBA,GAAQ+B,CAAK;AAAA,EACrC;AAAA,EAoGM,qBAA2B;AACjC,QAAI,CAAC,KAAK,SAAS,KAAK,gBAAgB;AACtC,WAAK,gBAAgB;AAAA,SAChB;AACC,YAAAG,IAAQ,KAAK,QACf,KAAK,iBAAiB,KAAK,kBAAkB,KAAK,KAAK,IACvD,KAAK;AAET,MAAIA,MAAU,MAAM,CAAC,KAAK,mBACxB,KAAK,gBAAgBA,GACrB,KAAK,iBAAiB,KAAK,iBAAiB,KAAK,aAAa,CAAC,GAC/D,KAAK,kBAAkB,KAAK,iBAAiB,KAAK,aAAa,CAAC,GAC5D,KAAK,SACP,KAAK,iBAAiB,KAAK,iBAAiB,KAAK,aAAa,CAAC;AAAA,IAEnE;AAGE,IAAC,KAAK,kBACR,KAAK,iBAAiB,KAAK,iBAAiB,CAAC,CAAC,GAC9C,KAAK,kBAAkB,KAAK,iBAAiB,CAAC,CAAC;AAAA,EACjD;AAAA,EAGM,eAAeX,GAAmB;AACxC,KAAI,KAAK,kBAAkB,KAAK,eAAe,YAC7C,KAAK,eAAeA,CAAG,GACvB,KAAK,iBAAiB,KAAK,iBAAiB,KAAK,aAAa,GAAG,EAAK,GACtE,KAAK,kBAAkB,KAAK,iBAAiB,KAAK,aAAa,CAAC,IAG9D,KAAK,eAAe,cACtB,KAAK,iBAAiBA,CAAG;AAAA,EAC3B;AAAA,EAGK,aAAaA,GAAoB;AACtC,SAAK,UAAU,IACf,KAAK,MAAM,GAENA,IAGH,KAAK,eAAeA,CAAG,IAFvB,KAAK,mBAAmB,GAUtB,OAAO,yBAA0B,cACb,sBAAA,MAAM,KAAK,sBAAsB;AAAA,EACzD;AAAA,EAGK,cAAoB;AACzB,SAAK,UAAU,IACf,KAAK,qBAAqB;AAAA,EAAA;AAAA,EAGpB,mBAAmB;AACnB,UAAAG,IAAa,KAAK,cAAc;AAGtC,QAFA,KAAK,2BAA2B,GAE5BA,EAAW,SAAS,KAAK,KAAK,qBAAqB,QAAQ;AAC7D,YAAM1B,IAAS0B,EAAW,KAAK,OAAMZ,EAAG,UAAU,KAAK,KAAK;AAC5D,WAAK,kBAAkBd,CAAM,GAC7B,KAAK,iBAAiBA,CAAM,GAExB,KAAK,kBACP,KAAK,gBAAgB,KAAK,iBAAiB0B,GAAY,KAAK,KAAK,GACjE,KAAK,KAAK,qBAAqBrB,EAAA,IAC1B,KAAK,gBAAgB,KAAK,aAAa,EAC3C;AAAA,IACH,WACSqB,EAAW,SAAS,KAAK,CAAC,KAAK,UAAU,CAAC,KAAK,gBAAgB;AACxE,YAAMS,IAAcT,EAAW,KAAK,CAAU1B,MAAA,CAACA,EAAO,QAAQ;AAC9D,WAAK,gBAAgB,GAChB,KAAA,iBAAiBmC,GAAa,EAAK,GAExC,KAAK,KAAK,sBAAsB9B,EAAA,IAC3B,KAAK,gBAAgB8B,CAAW,EACpC;AAAA,IAAA,WACQT,EAAW,SAAS,MAAM,KAAK,UAAU,KAAK,iBAAiB;AACxE,YAAMS,IAAcT,EAAW,KAAK,CAAU1B,MAAA,CAACA,EAAO,QAAQ;AAE9D,OACE,CAAC,KAAK,iBACN,KAAK,cAAc,WAAUmC,KAAA,gBAAAA,EAAa,YAE1C,KAAK,gBAAgB,GAChB,KAAA,iBAAiBA,GAAa,EAAK;AAAA,IAC1C;AAAA,EACF;AAAA,EAGF,SAAS;AACA,WAAAC;AAAAA;AAAAA,cAEGC,EAAK,eAAe;AAAA,MAC1B,mBAAmB,KAAK,SAAS;AAAA,MACjC,mBAAmB,KAAK,SAAS;AAAA,IAAA,CAClC,CAAC;AAAA,iBACS,KAAK,aAAa;AAAA,eACpB,KAAK,YAAY;AAAA,QACxB,KAAK,iBAAiB;AAAA,MACtB,CAACrC,GAAQkC,MAAUE;AAAAA;AAAAA,mBAER,KAAK,IAAI;AAAA;AAAA;AAAA,wBAGJpC,EAAO,QAAQ;AAAA,wBACf,KAAK,UAAUA,EAAO,KAAK;AAAA,uBAC5BkC,MAAU,KAAK,aAAa;AAAA,oBAC/BI,EAAUtC,EAAO,KAAK,CAAC;AAAA;AAAA,oBAEvBA,EAAO,KAAK;AAAA,uBACTA,EAAO,QAAQ;AAAA,iBACrBA,EAAO,MAAM,iBAAiBA,EAAO,KAAK,EAAE;AAAA,0BACnCsC,EAAUtC,EAAO,QAAQ,UAAU,MAAS,CAAC;AAAA,yBAC9C,KAAK,UAAU;AAAA,qBACnB,KAAK,iBAAiB;AAAA,cAC7BuC,EAAavC,EAAO,SAAS,CAAC;AAAA;AAAA;AAAA,IAGrC,CAAA;AAAA,iCAC0B,KAAK,gBAAgB;AAAA;AAAA,EAAA;AAGtD;AAtqBEJ,EAAO,UAAU,sBAEjBA,EAAO,eAAe;AAAA,EACpB,sBAAsB4C;AACxB,GAyDgB5C,EAAA,SAAS6C,EAAUC,CAAM;AA9DtB,IAAAC,IAAA/C;AAQPgD,EAAA;AAAA,EAAXC,EAAS;AAAA,GARSF,EAQP,WAAA,YAAA;AAG+BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,GAAM,CAAA;AAAA,GAXtBF,EAWwB,WAAA,OAAA;AAGdC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAS,CAAA;AAAA,GAdRF,EAcU,WAAA,SAAA;AAGAC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAS,CAAA;AAAA,GAjBRF,EAiBU,WAAA,QAAA;AAGjBC,EAAA;AAAA,EAAXC,EAAS;AAAA,GApBSF,EAoBP,WAAA,YAAA;AAMgBC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GA1BPF,EA0BS,WAAA,kBAAA;AAGAC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GA7BPF,EA6BS,WAAA,YAAA;AAMrBC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,MAAO,CAAA;AAAA,GAlCNF,EAmCZ,WAAA,SAAA;AAKsBC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAS,CAAA;AAAA,GAxCRF,EAwCU,WAAA,iBAAA;AAOrBC,EAAA;AAAA,EADPE,EAAM;AAAA,GA9CYH,EA+CX,WAAA,eAAA;AAGDC,EAAA;AAAA,EADNE,EAAM;AAAA,GAjDYH,EAkDZ,WAAA,eAAA;AAGCC,EAAA;AAAA,EADPE,EAAM;AAAA,GApDYH,EAqDX,WAAA,WAAA;AAGAC,EAAA;AAAA,EADPE,EAAM;AAAA,GAvDYH,EAwDX,WAAA,kBAAA;"}
+{"version":3,"file":"option-list.component.js","sources":["../../../src/components/option-list/option-list.component.ts"],"sourcesContent":["import clsx from 'clsx'\nimport { PropertyValueMap, unsafeCSS } from 'lit'\nimport { property, state } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { html, unsafeStatic } from 'lit/static-html.js'\n\nimport { scrollIntoContainer } from '@/common/utils'\nimport { DdsElement } from '@/internal/dds-hu-element'\nimport { SizedMixin } from '@/internal/mixin/sizedMixin'\n\nimport DapDSOptionItem from '../option-item/option-item.component'\nimport styles from './option-list.scss?inline'\n\n/**\n * `dap-ds-option-list`\n * @summary An option list is a list of selectable options.\n * @element dap-ds-option-list\n * @title - Option list\n *\n * @event {{ void }} dds-cancel - Fired when the escape key is pressed.\n * @event {{ option: DapDSOptionItem, value: string, index: number, text: string }} dds-option-change - Fired when the option list value changes.\n * @event {{ void }} dds-keydown - Fired when a key is pressed down.\n * @event {{ elements: DapDSOptionItem[] }} dds-list-changed - Fired when the available options list changes.\n *\n * @csspart base - The main option list container.\n * @csspart option-item - The option item of the option list.\n * @csspart popup-base - The base of the popup.\n * @csspart option-item-base - The base of the option item.\n * @csspart option-item-label - The label of the option item.\n * @csspart option-item-prefix - The prefix of the option item.\n * @csspart option-item-suffix - The suffix of the option item.\n *\n * @slot - The default slot for the options.\n */\nexport default class DapDSOptionList extends SizedMixin(DdsElement) {\n  static tagName = 'dap-ds-option-list'\n\n  static dependencies = {\n    'dap-ds-option-item': DapDSOptionItem,\n  }\n\n  /** The filter text of the option list */\n  @property() filterText = ''\n\n  /** The value of the option list */\n  @property({ type: String, reflect: true }) value?: string\n\n  /** The focused state of the option list. */\n  @property({ type: Boolean }) focused = false\n\n  /** Whether the option list is searchable */\n  @property({ type: Boolean }) search = false\n\n  /** The search mode of the option list. Default is `none` */\n  @property() searchMode: 'none' | 'typehead' | 'autocomplete' | 'manual' =\n    'none'\n\n  /**\n   * @ignore\n   */\n  @property({ type: String }) searchOnValueSet = 'true'\n\n  /** Whether the option list items are selectable, whether it shows the selected icon */\n  @property({ type: String }) selectable = 'true'\n\n  /**\n   * @ignore\n   */\n  @property({ type: Array })\n  public options?: any[]\n\n  /**\n   * @ignore\n   */\n  @property({ type: Boolean }) disableDelaySet = false\n\n  /** Whether multiple options can be selected; exposed as aria-multiselectable on the listbox. */\n  @property({ type: Boolean }) multiselectable = false\n\n  queryTimeout: number | undefined\n  queryString = ''\n  firstLoad = true\n\n  @state()\n  private currentOption: any\n\n  @state()\n  public selectedIndex: number\n\n  @state()\n  private optionEls: DapDSOptionItem[] = []\n\n  @state()\n  private availableOptions: DapDSOptionItem[] = []\n\n  get isAutoComplete() {\n    return this.searchMode === 'autocomplete' || this.searchMode === 'manual'\n  }\n\n  static readonly styles = unsafeCSS(styles)\n\n  protected firstUpdated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): void {\n    super.firstUpdated(_changedProperties)\n\n    this.setAttribute('role', 'listbox')\n  }\n\n  getAllOptions() {\n    const mainSlot = this.shadowRoot?.querySelector('slot')\n    const assignedElement = mainSlot?.assignedElements()[0]\n    const embeddedSlot =\n      assignedElement?.nodeName === 'SLOT'\n        ? (\n            mainSlot?.assignedElements()[0] as HTMLSlotElement\n          ).assignedElements()\n        : mainSlot?.assignedElements()\n\n    if (!embeddedSlot) {\n      return [...this.querySelectorAll<DapDSOptionItem>('dap-ds-option-item')]\n    } else {\n      return [...(embeddedSlot as DapDSOptionItem[])]\n    }\n  }\n\n  private getAllRenderedOptions(): DapDSOptionItem[] {\n    const ro =\n      this.shadowRoot?.querySelectorAll<DapDSOptionItem>('dap-ds-option-item')\n    return ro ? [...ro] : []\n  }\n\n  getAllAvailabeOptions() {\n    return this.availableOptions\n  }\n\n  getActiveOption() {\n    if (!this.currentOption) {\n      return null\n    }\n\n    const activeOption = this.getAllRenderedOptions().find(\n      el => el.value === this.currentOption.value,\n    )\n\n    return activeOption\n  }\n\n  protected updated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): void {\n    super.updated(_changedProperties)\n\n    if (_changedProperties.has('multiselectable')) {\n      if (this.multiselectable) {\n        this.setAttribute('aria-multiselectable', 'true')\n      } else {\n        this.removeAttribute('aria-multiselectable')\n      }\n    }\n\n    if (\n      _changedProperties.has('value') &&\n      !_changedProperties.has('currentOption') &&\n      this.searchOnValueSet === 'true'\n    ) {\n      const option = this.availableOptions.find(\n        option => option.value === this.value,\n      )\n\n      if (option) {\n        this.changeOption(option, _changedProperties.get('value'))\n\n        this.selectedIndex = this.findIndexByValue(\n          this.availableOptions,\n          this.value,\n        )\n\n        this.emit('dds-option-change', {\n          ...this.getEventDetails(this.currentOption),\n        })\n      }\n    }\n\n    if (\n      _changedProperties.has('options') ||\n      _changedProperties.has('optionEls')\n    ) {\n      this.availableOptions = this.options || this.optionEls\n      this.emit('dds-list-changed', { elements: this.availableOptions })\n    }\n  }\n\n  protected shouldUpdate(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): boolean {\n    if (_changedProperties.has('filterText')) {\n      if (\n        this.filterText &&\n        this.searchMode !== 'none' &&\n        this.searchMode !== 'manual'\n      ) {\n        this.filterAvailableOptions()\n        this.selectedIndex = 0\n        this.setCurrentOption(this.availableOptions[0], false)\n        this.emit('dds-list-changed', { elements: this.availableOptions })\n      } else if (this.filterText && this.searchMode === 'manual') {\n        if (this.selectedIndex === -1 && this.availableOptions.length > 0) {\n          this.selectedIndex = 0\n          this.setCurrentOption(this.availableOptions[0], false)\n        }\n      } else if (this.filterText && this.searchMode === 'none') {\n        this.filterAvailableOptions()\n        this.selectedIndex = -1\n        this.setCurrentOption(null, false)\n        this.setSelectedOption()\n        this.emit('dds-list-changed', { elements: this.availableOptions })\n      } else {\n        this.availableOptions = this.options || this.optionEls\n        this.selectedIndex = -1\n        this.setCurrentOption(null, false)\n        this.emit('dds-list-changed', { elements: this.availableOptions })\n      }\n    }\n\n    return super.shouldUpdate(_changedProperties)\n  }\n\n  public filterAvailableOptions(): void {\n    const valueLowerCase = this.filterText.toLowerCase()\n    this.availableOptions = (this.options || this.optionEls).filter(item => {\n      if (!item.disabled) {\n        const itemTextLowerCase = item.optionText.toLowerCase()\n        return itemTextLowerCase.startsWith(valueLowerCase)\n      }\n    })\n  }\n\n  attributeChangedCallback(name: string, oldValue: any, newValue: any) {\n    super.attributeChangedCallback(name, oldValue, newValue)\n    if (\n      name === 'value' &&\n      oldValue !== newValue &&\n      this.searchOnValueSet === 'true'\n    ) {\n      if (newValue) {\n        const option = this.availableOptions.find(el => el.value === newValue)\n\n        this.setSelectedOption(option)\n        this.selectionChanged(option)\n\n        this.emit('dds-option-change', {\n          ...this.getEventDetails(this.currentOption),\n        })\n      } else {\n        this.setSelectedOption()\n        this.selectionChanged()\n      }\n    }\n  }\n\n  public setOptionsFromSlottedItems(): void {\n    const elements = this.getAllOptions()\n    this.availableOptions = elements\n    this.optionEls = elements\n  }\n\n  private handleKeydown(event: KeyboardEvent): void {\n    // Keydown only reaches the list while focus is inside it. Focus can arrive\n    // via Tab (not captureFocus), so mark the list focused or every key is ignored.\n    this.focused = true\n\n    // Tab and Escape must always work so keyboard users can leave the list\n    // (WCAG 2.1.2). Tab keeps its native behaviour; the host closes the popup.\n    if (event.key === 'Tab' || event.key === 'Escape') {\n      if (event.key === 'Escape') {\n        event.preventDefault()\n        this.emit('dds-cancel')\n      }\n      this.emit('dds-keydown', { key: event.key, code: event.code })\n      return\n    }\n\n    event.preventDefault()\n\n    this.handleKeyCodes(event.key, event.code)\n  }\n\n  private scrollToActiveOption(): void {\n    if (!this.currentOption) {\n      return\n    }\n\n    const activeOption = this.getAllRenderedOptions().find(\n      el => el.value === this.currentOption.value,\n    )\n\n    if (activeOption) {\n      // Scroll only within the list's own scroll container. A plain\n      // scrollIntoView would also scroll every ancestor (modal body, page),\n      // pushing the trigger out of the viewport and tripping the popup's\n      // viewport auto-close so the dropdown snaps shut on open.\n      scrollIntoContainer(activeOption)\n    }\n  }\n\n  private handleNavigationKey(key: string): void {\n    if (key === 'ArrowDown') {\n      this.selectedIndex = this.findNearestEnabled(\n        this.availableOptions,\n        this.selectedIndex,\n        1,\n      )\n    } else if (key === 'ArrowUp') {\n      const nearest = this.findNearestEnabled(\n        this.availableOptions,\n        this.selectedIndex,\n        this.selectedIndex === -1 ? 1 : -1,\n      )\n      this.selectedIndex =\n        nearest === this.availableOptions.length ? -1 : nearest\n    } else if (key === 'Home') {\n      this.selectedIndex = this.availableOptions[0]?.disabled\n        ? this.findNearestEnabled(this.availableOptions, -1, 1)\n        : 0\n    } else if (key === 'End') {\n      const nearest = this.findNearestEnabled(\n        this.availableOptions,\n        this.availableOptions.length,\n        -1,\n      )\n      this.selectedIndex =\n        nearest === this.availableOptions.length ? -1 : nearest\n    }\n  }\n\n  private handleActionKey(key: string): void {\n    if (key === 'Enter') {\n      this.setSelectedOption(this.availableOptions[this.selectedIndex])\n      this.selectionChanged(this.availableOptions[this.selectedIndex])\n      this.emit('dds-option-change', {\n        ...this.getEventDetails(this.currentOption),\n      })\n    }\n  }\n\n  private handleTypeheadKey(key: string): void {\n    if (\n      this.searchMode === 'typehead' &&\n      (key?.length === 1 || key === 'Backspace')\n    ) {\n      this.buildQueryString(key)\n    }\n  }\n\n  private handleKeyCodes(key: string, keyCode?: string) {\n    if (!this.focused) {\n      return\n    }\n\n    this.handleNavigationKey(key)\n    this.handleActionKey(key)\n    this.handleTypeheadKey(key)\n\n    if (this.selectedIndex >= 0) {\n      const option = this.availableOptions[this.selectedIndex]\n      this.setCurrentOption(option)\n      this.emit('dds-keydown', {\n        code: keyCode,\n        key,\n        ...this.getEventDetails(option),\n      })\n    }\n  }\n\n  private getEventDetails(option?: DapDSOptionItem) {\n    if (!option) {\n      return undefined\n    }\n\n    let opt = option\n\n    if (option.tagName !== 'DAP-DS-OPTION-ITEM') {\n      opt = option.closest('dap-ds-option-item')!\n    }\n\n    return {\n      opt,\n      value: opt?.value,\n      text: opt?.optionText,\n      index: this.selectedIndex,\n    }\n  }\n\n  private findNearestEnabled(\n    allOptions: DapDSOptionItem[],\n    current: number,\n    step: number,\n  ) {\n    let nextIndex: number = current\n    let nextOption: DapDSOptionItem\n\n    do {\n      nextIndex += step\n      nextOption = allOptions[nextIndex]\n      if (nextOption === undefined) {\n        break\n      }\n    } while (nextOption?.disabled)\n\n    return nextOption ? nextIndex : current\n  }\n\n  private findIndexByValue(\n    allOptions: DapDSOptionItem[],\n    value?: string,\n  ): number {\n    return allOptions.findIndex(option => option.value === value)\n  }\n\n  private clearItemFocusStates() {\n    this.availableOptions.forEach(el => {\n      el.focused = false\n      el.tabIndex = -1\n    })\n  }\n\n  // Only set the current option without selecting it, eg: focus\n  private setCurrentOption(option?: DapDSOptionItem | null, setFocus = true) {\n    this.clearItemFocusStates()\n\n    if (option) {\n      this.currentOption = option\n      option.focused = true\n      option.tabIndex = 0\n\n      this.emit('dds-current-change', {\n        ...this.getEventDetails(option),\n      })\n\n      if (setFocus) {\n        this.setFocusedOption(option)\n      } else {\n        this.scrollToActiveOption()\n      }\n    } else {\n      this.currentOption = null\n\n      this.emit('dds-current-change', null)\n    }\n  }\n\n  private setFocusedOption(option: DapDSOptionItem) {\n    const renderedItem = this.getAllRenderedOptions().find(\n      el => el.value === option.value,\n    )\n\n    if (renderedItem) {\n      // preventScroll so native focus doesn't scroll ancestor containers (modal\n      // body, page); scrollToActiveOption reveals it within the list instead.\n      renderedItem.focus({ preventScroll: true })\n    }\n  }\n\n  private setSelectedOption(option?: DapDSOptionItem | undefined) {\n    this.availableOptions.forEach(el => (el.selected = false))\n\n    if (option) {\n      this.currentOption = option\n\n      option.selected = true\n    }\n  }\n\n  private selectionChanged(option?: DapDSOptionItem | undefined, value?: any) {\n    const oldValue = value || this.value\n\n    if (option) {\n      if (option.value !== oldValue) {\n        this.value = option.value\n      }\n    }\n  }\n\n  private changeOption(option: DapDSOptionItem, value?: any) {\n    if (option && !option.disabled) {\n      this.selectedIndex = this.findIndexByValue(\n        this.availableOptions,\n        option.value,\n      )\n\n      this.setSelectedOption(option)\n      this.setCurrentOption(option)\n      this.selectionChanged(option, value)\n    }\n  }\n\n  private readonly handleOptionClick = (event: MouseEvent) => {\n    this.focused = true\n    const option = event.target as DapDSOptionItem\n\n    if (option && !option.disabled) {\n      const isModifierKeyPressed = event.ctrlKey || event.metaKey\n      const isAlreadySelected = option.selected\n\n      if (isModifierKeyPressed && isAlreadySelected) {\n        // Find the empty item (with \"empty\" attribute) to select automatically\n        const emptyItem = this.availableOptions.find(opt =>\n          opt.hasAttribute('empty'),\n        )\n\n        if (emptyItem) {\n          // Select the empty item automatically\n          this.setSelectedOption(emptyItem)\n          this.setCurrentOption(emptyItem)\n          this.value = emptyItem.value\n          this.selectedIndex = this.findIndexByValue(\n            this.availableOptions,\n            emptyItem.value,\n          )\n\n          this.emit('dds-option-change', {\n            ...this.getEventDetails(emptyItem),\n          })\n        } else {\n          // Fallback to original behavior if no empty item found\n          this.setSelectedOption(undefined)\n          this.setCurrentOption(null)\n          this.value = undefined\n          this.selectedIndex = -1\n\n          this.emit('dds-option-deselect', {\n            option: option,\n            value: undefined,\n            index: -1,\n            text: option.optionText,\n          })\n        }\n\n        return\n      }\n\n      this.setCurrentOption(option)\n      this.setSelectedOption(option)\n      this.selectionChanged(option)\n\n      this.updateComplete.then(() => {\n        this.selectedIndex = this.findIndexByValue(\n          this.availableOptions,\n          this.value,\n        )\n\n        if (!this.disableDelaySet) {\n          this.emit('dds-option-change', {\n            ...this.getEventDetails(this.currentOption),\n          })\n        }\n      })\n    } else {\n      event.preventDefault()\n      event.stopPropagation()\n    }\n  }\n\n  getSearchString = (char: string) => {\n    if (typeof this.queryTimeout === 'number') {\n      window.clearTimeout(this.queryTimeout)\n    }\n\n    this.queryTimeout = window.setTimeout(() => {\n      this.queryString = ''\n    }, 500)\n\n    this.queryString += char\n    return this.queryString\n  }\n\n  buildQueryString = (char: string) => {\n    const queryString = this.getSearchString(char)\n\n    for (const option of this.availableOptions) {\n      const label = option.optionText.toLowerCase()\n\n      if (label.startsWith(queryString.toLowerCase())) {\n        this.selectedIndex = this.findIndexByValue(\n          this.availableOptions,\n          option.value,\n        )\n        this.setCurrentOption(option)\n        break\n      }\n    }\n  }\n\n  private handleInitialFocus(): void {\n    if (!this.value && this.selectedIndex < 0) {\n      this.selectedIndex = 0\n    } else {\n      const index = this.value\n        ? this.findIndexByValue(this.availableOptions, this.value)\n        : this.selectedIndex\n\n      if (index !== -1 && !this.isAutoComplete) {\n        this.selectedIndex = index\n        this.setCurrentOption(this.availableOptions[this.selectedIndex])\n        this.setSelectedOption(this.availableOptions[this.selectedIndex])\n        if (this.value) {\n          this.selectionChanged(this.availableOptions[this.selectedIndex])\n        }\n      }\n    }\n\n    if (!this.selectedIndex) {\n      this.setCurrentOption(this.availableOptions[0])\n      this.setSelectedOption(this.availableOptions[0])\n    }\n  }\n\n  private handleKeyFocus(key: string): void {\n    if (this.isAutoComplete || this.searchMode === 'none') {\n      this.handleKeyCodes(key)\n      this.setCurrentOption(this.availableOptions[this.selectedIndex], false)\n      this.setSelectedOption(this.availableOptions[this.selectedIndex])\n    }\n\n    if (this.searchMode === 'typehead') {\n      this.buildQueryString(key)\n    }\n  }\n\n  public captureFocus(key?: string): void {\n    this.focused = true\n    this.focus()\n\n    if (!key) {\n      this.handleInitialFocus()\n    } else {\n      this.handleKeyFocus(key)\n    }\n\n    // The popup constrains its scroll container's max-height via floating-ui one\n    // animation frame after opening. At this point that constraint isn't applied\n    // yet (clientHeight === scrollHeight), so the container isn't scrollable and\n    // both native focus() scrolling and scrollIntoView are no-ops. Defer the\n    // scroll to the next frame so the selected option is actually revealed.\n    if (typeof requestAnimationFrame === 'function') {\n      requestAnimationFrame(() => this.scrollToActiveOption())\n    }\n  }\n\n  public removeFocus(): void {\n    this.focused = false\n    this.clearItemFocusStates()\n  }\n\n  private handleSlotChange() {\n    const allOptions = this.getAllOptions()\n    this.setOptionsFromSlottedItems()\n\n    if (allOptions.length > 0 && this.searchOnValueSet === 'true') {\n      const option = allOptions.find(el => el.value === this.value)\n      this.setSelectedOption(option)\n      this.selectionChanged(option)\n\n      if (this.currentOption) {\n        this.selectedIndex = this.findIndexByValue(allOptions, this.value)\n        this.emit('dds-option-change', {\n          ...this.getEventDetails(this.currentOption),\n        })\n      }\n    } else if (allOptions.length > 0 && !this.search && !this.isAutoComplete) {\n      const firstOption = allOptions.find(option => !option.disabled)\n      this.selectedIndex = 0\n      this.setCurrentOption(firstOption, false)\n\n      this.emit('dds-current-change', {\n        ...this.getEventDetails(firstOption),\n      })\n    } else if (allOptions.length > 0 && (this.search || this.isAutoComplete)) {\n      const firstOption = allOptions.find(option => !option.disabled)\n\n      if (\n        !this.currentOption ||\n        this.currentOption.value !== firstOption?.value\n      ) {\n        this.selectedIndex = 0\n        this.setCurrentOption(firstOption, false)\n      }\n    }\n  }\n\n  render() {\n    return html`<div\n      part=\"base\"\n      class=${clsx('option-list', {\n        'option-list--sm': this.size === 'sm',\n        'option-list--lg': this.size === 'lg',\n      })}\n      @keydown=${this.handleKeydown}\n      @focus=${this.captureFocus}>\n      ${this.availableOptions.map(\n        (option, index) => html`\n          <dap-ds-option-item\n            size=${this.size}\n            part=\"option-item\"\n            exportparts=\"base: option-item-base, label: option-item-label, prefix: option-item-prefix, suffix: option-item-suffix\"\n            ?disabled=${option.disabled}\n            ?selected=${this.value === option.value}\n            ?focused=${index === this.selectedIndex}\n            label=${ifDefined(option.label)}\n            role=\"option\"\n            value=${option.value}\n            tabIndex=${option.tabIndex}\n            id=${option.id || `dap-ds-option-${option.value}`}\n            data-testid=${ifDefined(option.dataset.testid || undefined)}\n            selectable=${this.selectable}\n            @click=${this.handleOptionClick}>\n            ${unsafeStatic(option.innerHTML)}\n          </dap-ds-option-item>\n        `,\n      )}\n      <slot hidden @slotchange=${this.handleSlotChange}></slot>\n    </div> `\n  }\n}\n"],"names":["_DapDSOptionList","SizedMixin","DdsElement","event","option","isModifierKeyPressed","isAlreadySelected","emptyItem","opt","__spreadValues","char","queryString","_changedProperties","mainSlot","_a","assignedElement","embeddedSlot","ro","el","valueLowerCase","item","name","oldValue","newValue","elements","activeOption","scrollIntoContainer","key","nearest","keyCode","allOptions","current","step","nextIndex","nextOption","value","setFocus","renderedItem","index","firstOption","html","clsx","ifDefined","unsafeStatic","DapDSOptionItem","unsafeCSS","styles","DapDSOptionList","__decorateClass","property","state"],"mappings":"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"}

package/dist/components/popup/popup-base-element.d.ts

@@ -42,6 +42,12 @@ export default class PopupBaseElement extends PopupBaseElement_base {
     disableViewportAutoClose: boolean;
     connectedCallback(): Promise<void>;
     protected firstUpdated(changedProps: Map<string, unknown>): void;
+    /**
+     * Whether the trigger can carry aria-expanded. Role-less wrappers (e.g. the
+     * combobox/datepicker field frame) expose state on their own inner control.
+     */
+    private triggerSupportsExpanded;
+    private syncTriggerAria;
     updated(changedProps: Map<string, unknown>): Promise<void>;
     _handleTriggerSlotChange(e?: Event | undefined): Promise<void>;
     _handleTriggerSlotChangeCallback(_e?: Event): void;

package/dist/components/popup/popup-base-element.js

@@ -1,60 +1,89 @@
 var O = Object.getPrototypeOf;
-var W = Reflect.get;
-var y = (h, t, e) => W(O(h), e, t);
-var u = (h, t, e) => new Promise((n, p) => {
-  var l = (s) => {
+var $ = Reflect.get;
+var y = (l, t, e) => $(O(l), e, t);
+var g = (l, t, e) => new Promise((u, n) => {
+  var a = (s) => {
     try {
-      g(e.next(s));
-    } catch (a) {
-      p(a);
+      d(e.next(s));
+    } catch (p) {
+      n(p);
     }
-  }, d = (s) => {
+  }, h = (s) => {
     try {
-      g(e.throw(s));
-    } catch (a) {
-      p(a);
+      d(e.throw(s));
+    } catch (p) {
+      n(p);
     }
-  }, g = (s) => s.done ? n(s.value) : Promise.resolve(s.value).then(l, d);
-  g((e = e.apply(h, t)).next());
+  }, d = (s) => s.done ? u(s.value) : Promise.resolve(s.value).then(a, h);
+  d((e = e.apply(l, t)).next());
 });
-import { autoUpdate as H, computePosition as U, offset as M, flip as T, shift as k, size as V, arrow as q } from "../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";
-import { clsx as _ } from "../../node_modules/clsx/dist/clsx.js";
+import { autoUpdate as U, computePosition as W, offset as H, flip as N, shift as M, size as k, arrow as B } from "../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";
+import { clsx as S } from "../../node_modules/clsx/dist/clsx.js";
 import "../../node_modules/@lit/reactive-element/reactive-element.js";
 import "../../node_modules/lit-html/lit-html.js";
 import "../../node_modules/lit-element/lit-element.js";
 import { property as o } from "../../node_modules/@lit/reactive-element/decorators/property.js";
-import { query as S } from "../../node_modules/@lit/reactive-element/decorators/query.js";
-import { html as w } from "../../node_modules/lit-html/static.js";
-import { SizedMixin as B } from "../../internal/mixin/sizedMixin.js";
-import { DdsElement as j } from "../../internal/dds-hu-element.js";
-import z from "./popup.scss.js";
-import { unsafeCSS as L } from "../../node_modules/@lit/reactive-element/css-tag.js";
-var N = Object.defineProperty, r = (h, t, e, n) => {
-  for (var p = void 0, l = h.length - 1, d; l >= 0; l--)
-    (d = h[l]) && (p = d(t, e, p) || p);
-  return p && N(t, e, p), p;
+import { query as A } from "../../node_modules/@lit/reactive-element/decorators/query.js";
+import { html as b } from "../../node_modules/lit-html/static.js";
+import { SizedMixin as P } from "../../internal/mixin/sizedMixin.js";
+import { DdsElement as L } from "../../internal/dds-hu-element.js";
+import V from "./popup.scss.js";
+import { unsafeCSS as q } from "../../node_modules/@lit/reactive-element/css-tag.js";
+var D = Object.defineProperty, r = (l, t, e, u) => {
+  for (var n = void 0, a = l.length - 1, h; a >= 0; a--)
+    (h = l[a]) && (n = h(t, e, n) || n);
+  return n && D(t, e, n), n;
 };
-const c = class c extends B(j) {
+const I = /* @__PURE__ */ new Set([
+  "application",
+  "button",
+  "checkbox",
+  "columnheader",
+  "combobox",
+  "gridcell",
+  "link",
+  "menuitem",
+  "row",
+  "rowheader",
+  "tab",
+  "treeitem"
+]), R = /* @__PURE__ */ new Set([
+  "button",
+  "checkbox",
+  "image",
+  "reset",
+  "submit"
+]), c = class c extends P(L) {
   constructor() {
     super(...arguments), this.triggerElement = null, this.intersectionObserver = null, this.disabled = !1, this.opened = !1, this.placement = "bottom", this.floatingStrategy = "absolute", this.offset = 0, this.maxHeight = 250, this.maxWidth = "auto", this.disableViewportAutoClose = !1;
   }
   connectedCallback() {
-    return u(this, null, function* () {
+    return g(this, null, function* () {
       y(c.prototype, this, "connectedCallback").call(this), yield this.updateComplete, this.startUpdate();
     });
   }
   firstUpdated(t) {
-    var e, n;
-    super.firstUpdated(t), (e = this.triggerElement) == null || e.setAttribute("aria-controls", "popup"), (n = this.triggerElement) == null || n.setAttribute("aria-expanded", "false");
+    super.firstUpdated(t), this.syncTriggerAria();
+  }
+  /**
+   * Whether the trigger can carry aria-expanded. Role-less wrappers (e.g. the
+   * combobox/datepicker field frame) expose state on their own inner control.
+   */
+  triggerSupportsExpanded(t) {
+    const e = t.getAttribute("role");
+    return e ? I.has(e) : t.tagName === "BUTTON" ? !0 : t.tagName === "A" ? t.hasAttribute("href") : t.tagName === "INPUT" ? R.has(t.type) : !1;
+  }
+  syncTriggerAria() {
+    const t = this.triggerElement;
+    !t || !this.triggerSupportsExpanded(t) || (t.hasAttribute("aria-controls") || t.setAttribute("aria-controls", "popup"), t.setAttribute("aria-expanded", String(!!this.opened)));
   }
   updated(t) {
-    return u(this, null, function* () {
-      var e, n;
-      y(c.prototype, this, "updated").call(this, t), t.has("opened") && (this.opened ? (this.startUpdate(), (e = this.triggerElement) == null || e.setAttribute("aria-expanded", "true"), this.emit("dds-opened")) : (this.stopUpdate(), (n = this.triggerElement) == null || n.setAttribute("aria-expanded", "false"), this.emit("dds-closed"))), t.has("anchor") && this._handleTriggerSlotChange(), this.opened && (yield this.updateComplete, this.updatePosition());
+    return g(this, null, function* () {
+      y(c.prototype, this, "updated").call(this, t), t.has("opened") && (this.opened ? (this.startUpdate(), this.syncTriggerAria(), this.emit("dds-opened")) : (this.stopUpdate(), this.syncTriggerAria(), this.emit("dds-closed"))), t.has("anchor") && this._handleTriggerSlotChange(), this.opened && (yield this.updateComplete, this.updatePosition());
     });
   }
   _handleTriggerSlotChange(t) {
-    return u(this, null, function* () {
+    return g(this, null, function* () {
       var e;
       this._handleTriggerSlotChangeCallback(t), yield this.stopUpdate(), this.triggerElement = this.querySelector(
         ':scope > [slot="trigger"]'
@@ -76,12 +105,12 @@ const c = class c extends B(j) {
         e[0] && !e[0].isIntersecting && this.opened && !this.disableViewportAutoClose && (this.opened = !1, this.emit("dds-close"));
       },
       { threshold: 0 }
-    ), this.intersectionObserver.observe(this.triggerElement), this.cleanup = H(this.triggerElement, this.popup, () => {
+    ), this.intersectionObserver.observe(this.triggerElement), this.cleanup = U(this.triggerElement, this.popup, () => {
       this.updatePosition();
     }));
   }
   stopUpdate() {
-    return u(this, null, function* () {
+    return g(this, null, function* () {
       return new Promise((t) => {
         this.intersectionObserver && (this.intersectionObserver.disconnect(), this.intersectionObserver = null), this.cleanup ? (this.cleanup(), this.cleanup = void 0, requestAnimationFrame(() => t())) : t();
       });
@@ -91,8 +120,8 @@ const c = class c extends B(j) {
     super.disconnectedCallback(), this.intersectionObserver && (this.intersectionObserver.disconnect(), this.intersectionObserver = null), this.stopUpdate();
   }
   updatePosition() {
-    return u(this, null, function* () {
-      var g;
+    return g(this, null, function* () {
+      var d;
       if (this.disabled || !this.triggerElement)
         return;
       const t = this.triggerElement.getBoundingClientRect();
@@ -100,43 +129,43 @@ const c = class c extends B(j) {
         this.opened && !this.disableViewportAutoClose && (this.opened = !1, this.emit("dds-close"));
         return;
       }
-      const { x: n, y: p, placement: l, middlewareData: d } = yield U(
+      const { x: u, y: n, placement: a, middlewareData: h } = yield W(
         this.triggerElement,
         this.popup,
         {
           placement: this.placement,
           strategy: this.floatingStrategy,
           middleware: [
-            M(this.offset),
-            T(),
-            k(),
-            V({
-              apply: ({ rects: s, availableHeight: a, availableWidth: m, elements: f }) => {
-                const b = Math.max(0, a), x = Math.max(0, m), $ = this.sync;
-                this.popup.style.width = $ ? `${s.reference.width}px` : "";
-                const v = typeof this.maxHeight == "number" ? this.maxHeight : void 0, C = v != null ? Math.min(v, b) : b;
-                this.popup.style.maxHeight = C >= f.floating.scrollHeight ? "" : `${C}px`;
-                const E = typeof this.maxWidth == "number" ? this.maxWidth : void 0, A = E != null ? Math.min(E, x) : x;
-                this.popup.style.maxWidth = `${A}px`, this.fullWidth && (this.popup.style.width = "100vw");
+            H(this.offset),
+            N(),
+            M(),
+            k({
+              apply: ({ rects: s, availableHeight: p, availableWidth: m, elements: f }) => {
+                const w = Math.max(0, p), x = Math.max(0, m), C = this.sync;
+                this.popup.style.width = C ? `${s.reference.width}px` : "";
+                const v = typeof this.maxHeight == "number" ? this.maxHeight : void 0, E = v != null ? Math.min(v, w) : w;
+                this.popup.style.maxHeight = E >= f.floating.scrollHeight ? "" : `${E}px`;
+                const _ = typeof this.maxWidth == "number" ? this.maxWidth : void 0, T = _ != null ? Math.min(_, x) : x;
+                this.popup.style.maxWidth = `${T}px`, this.fullWidth && (this.popup.style.width = "100vw");
               }
             }),
-            ...this.arrowElement ? [q({ element: this.arrowElement, padding: 8 })] : []
+            ...this.arrowElement ? [B({ element: this.arrowElement, padding: 8 })] : []
           ]
         }
       );
       if (Object.assign(this.popup.style, {
-        left: `${n}px`,
-        top: `${p}px`
+        left: `${u}px`,
+        top: `${n}px`
       }), this.arrowElement) {
-        const { x: s, y: a } = d.arrow, [m] = l.split("-"), f = (g = {
+        const { x: s, y: p } = h.arrow, [m] = a.split("-"), f = (d = {
           top: "bottom",
           right: "left",
           bottom: "top",
           left: "right"
-        }[m]) != null ? g : "";
+        }[m]) != null ? d : "";
         Object.assign(this.arrowElement.style, {
           left: s != null ? `${s}px` : "",
-          top: a != null ? `${a}px` : "",
+          top: p != null ? `${p}px` : "",
           [f]: "-5px"
         }), this.arrowElement.classList.remove(
           "popup__arrow--top",
@@ -148,10 +177,10 @@ const c = class c extends B(j) {
     });
   }
   renderTrigger() {
-    return w``;
+    return b``;
   }
   renderPopup() {
-    return w`
+    return b`
       <slot name="trigger" @slotchange=${this._handleTriggerSlotChange}>
         ${this.renderTrigger()}
       </slot>
@@ -159,7 +188,7 @@ const c = class c extends B(j) {
         part="popup"
         id="popup"
         ?inert=${!this.opened}
-        class=${_("popup", `popup--${this.size}`, {
+        class=${S("popup", `popup--${this.size}`, {
       "popup--opened": this.opened,
       "popup--fixed": this.floatingStrategy === "fixed",
       "popup--has-arrow": this.hasArrow,
@@ -167,21 +196,21 @@ const c = class c extends B(j) {
       "popup--full-width": this.fullWidth
     })}>
         <slot @slotchange=${this._handleContentSlotChange}></slot>
-        ${this.hasArrow ? w`<div
+        ${this.hasArrow ? b`<div
               part="arrow"
-              class=${_("popup__arrow")}
+              class=${S("popup__arrow")}
               role="presentation"></div>` : ""}
       </div>
     `;
   }
 };
-c.styles = L(z);
+c.styles = q(V);
 let i = c;
 r([
-  S(".popup")
+  A(".popup")
 ], i.prototype, "popup");
 r([
-  S(".popup__arrow")
+  A(".popup__arrow")
 ], i.prototype, "arrowElement");
 r([
   o({ reflect: !0, type: Boolean })

package/dist/components/popup/popup-base-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"popup-base-element.js","sources":["../../../src/components/popup/popup-base-element.ts"],"sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  computePosition,\n  Coords,\n  flip,\n  offset,\n  shift,\n  size,\n} from '@floating-ui/dom'\nimport { clsx } from 'clsx'\nimport { TemplateResult, unsafeCSS } from 'lit'\nimport { property, query } from 'lit/decorators.js'\nimport { html } from 'lit/static-html.js'\n\nimport { SizedMixin } from '@/internal/mixin/sizedMixin'\n\nimport { FloatingStrategy, PopupPlacement } from '../../common/types'\nimport { DdsElement } from '../../internal/dds-hu-element'\nimport styles from './popup.scss?inline'\n\nexport default class PopupBaseElement extends SizedMixin(DdsElement) {\n  static readonly styles = unsafeCSS(styles)\n\n  protected triggerElement: Element | null = null\n  private cleanup: ReturnType<typeof autoUpdate> | undefined\n  private intersectionObserver: IntersectionObserver | null = null\n\n  @query('.popup') protected readonly popup!: HTMLDivElement\n  @query('.popup__arrow') private readonly arrowElement?: HTMLDivElement\n\n  /** The disabled state of the popup. */\n  @property({ reflect: true, type: Boolean }) disabled? = false\n\n  /** The open state of the popup. */\n  @property({ reflect: true, type: Boolean }) opened? = false\n\n  /** The placement of the popup.\n   * @type {'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end'}\n   */\n  @property({ reflect: true }) placement: PopupPlacement = 'bottom'\n\n  /** The floating strategy of the popup.\n   * @type {'absolute' | 'fixed'}\n   */\n  @property({ reflect: true })\n  floatingStrategy: FloatingStrategy = 'absolute'\n\n  /** The offset of the popup. */\n  @property({ type: Number }) offset = 0\n\n  /** Whether the popup should sync its width with the trigger. */\n  @property({ type: Boolean }) sync?: boolean\n\n  /** The maximum height of the popup. */\n  @property({ type: Number }) maxHeight: number | 'auto' = 250\n\n  /** The maximum width of the popup. */\n  @property({ type: Number }) maxWidth: number | 'auto' = 'auto'\n\n  /** Whether the popup has an arrow. */\n  @property({ type: Boolean }) hasArrow: boolean\n\n  /** Whether the popup should overflow. */\n  @property({ type: Boolean }) overflow: boolean\n\n  /** Whether the popup should take full width of the screen. */\n  @property({ type: Boolean }) fullWidth: boolean\n\n  /** Whether to keep popup open when trigger leaves viewport. */\n  @property({ type: Boolean }) disableViewportAutoClose: boolean = false\n\n  async connectedCallback() {\n    super.connectedCallback()\n\n    await this.updateComplete\n    this.startUpdate()\n  }\n\n  protected firstUpdated(changedProps: Map<string, unknown>) {\n    super.firstUpdated(changedProps)\n\n    this.triggerElement?.setAttribute('aria-controls', 'popup')\n    this.triggerElement?.setAttribute('aria-expanded', 'false')\n  }\n\n  async updated(changedProps: Map<string, unknown>) {\n    super.updated(changedProps)\n\n    if (changedProps.has('opened')) {\n      if (this.opened) {\n        this.startUpdate()\n        this.triggerElement?.setAttribute('aria-expanded', 'true')\n        this.emit('dds-opened')\n      } else {\n        this.stopUpdate()\n        this.triggerElement?.setAttribute('aria-expanded', 'false')\n        this.emit('dds-closed')\n      }\n    }\n\n    if (changedProps.has('anchor')) {\n      this._handleTriggerSlotChange()\n    }\n\n    if (this.opened) {\n      await this.updateComplete\n      this.updatePosition()\n    }\n  }\n\n  async _handleTriggerSlotChange(e?: Event | undefined) {\n    this._handleTriggerSlotChangeCallback(e)\n\n    await this.stopUpdate()\n\n    // Use :scope > to only match direct children, not descendants\n    this.triggerElement = this.querySelector<HTMLElement>(\n      ':scope > [slot=\"trigger\"]',\n    )\n\n    if (!this.triggerElement) {\n      this.triggerElement = this.shadowRoot?.querySelector(\n        'slot[name=\"trigger\"] *',\n      ) as HTMLElement\n    }\n\n    if (this.triggerElement instanceof HTMLSlotElement) {\n      this.triggerElement = this.triggerElement.assignedElements({\n        flatten: true,\n      })[0] as HTMLElement\n    }\n\n    if (this.triggerElement) {\n      this.startUpdate()\n    }\n  }\n\n  public _handleTriggerSlotChangeCallback(_e?: Event) {\n    return\n  }\n\n  public _handleContentSlotChange(_e: Event) {\n    return\n  }\n\n  public startUpdate() {\n    if (!this.triggerElement) {\n      return\n    }\n\n    // Create IntersectionObserver to detect when trigger is out of viewport\n    this.intersectionObserver?.disconnect()\n    this.intersectionObserver = new IntersectionObserver(\n      entries => {\n        // If trigger is not intersecting (out of viewport), close the popup\n        if (\n          entries[0] &&\n          !entries[0].isIntersecting &&\n          this.opened &&\n          !this.disableViewportAutoClose\n        ) {\n          this.opened = false\n          this.emit('dds-close')\n        }\n      },\n      { threshold: 0 },\n    )\n    this.intersectionObserver.observe(this.triggerElement)\n\n    this.cleanup = autoUpdate(this.triggerElement, this.popup, () => {\n      this.updatePosition()\n    })\n  }\n\n  public async stopUpdate(): Promise<void> {\n    return new Promise(resolve => {\n      if (this.intersectionObserver) {\n        this.intersectionObserver.disconnect()\n        this.intersectionObserver = null\n      }\n\n      if (this.cleanup) {\n        this.cleanup()\n        this.cleanup = undefined\n        requestAnimationFrame(() => resolve())\n      } else {\n        resolve()\n      }\n    })\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback()\n\n    // Clean up the IntersectionObserver\n    if (this.intersectionObserver) {\n      this.intersectionObserver.disconnect()\n      this.intersectionObserver = null\n    }\n\n    this.stopUpdate()\n  }\n\n  protected async updatePosition() {\n    if (this.disabled || !this.triggerElement) {\n      return\n    }\n\n    // Check if trigger element is visible in viewport\n    const triggerRect = this.triggerElement.getBoundingClientRect()\n    const isVisible =\n      triggerRect.top < window.innerHeight &&\n      triggerRect.bottom > 0 &&\n      triggerRect.left < window.innerWidth &&\n      triggerRect.right > 0\n\n    if (!isVisible) {\n      if (this.opened && !this.disableViewportAutoClose) {\n        this.opened = false\n        this.emit('dds-close')\n      }\n      return\n    }\n\n    const { x, y, placement, middlewareData } = await computePosition(\n      this.triggerElement,\n      this.popup,\n      {\n        placement: this.placement,\n        strategy: this.floatingStrategy,\n        middleware: [\n          offset(this.offset),\n          flip(),\n          shift(),\n          size({\n            apply: ({ rects, availableHeight, availableWidth, elements }) => {\n              const safeAvailableHeight = Math.max(0, availableHeight)\n              const safeAvailableWidth = Math.max(0, availableWidth)\n              const syncWidth = this.sync\n              this.popup.style.width = syncWidth\n                ? `${rects.reference.width}px`\n                : ''\n\n              const configuredMaxHeight =\n                typeof this.maxHeight === 'number' ? this.maxHeight : undefined\n              const effectiveMaxHeight =\n                configuredMaxHeight != null\n                  ? Math.min(configuredMaxHeight, safeAvailableHeight)\n                  : safeAvailableHeight\n              this.popup.style.maxHeight =\n                effectiveMaxHeight >= elements.floating.scrollHeight\n                  ? ''\n                  : `${effectiveMaxHeight}px`\n\n              const configuredMaxWidth =\n                typeof this.maxWidth === 'number' ? this.maxWidth : undefined\n              const effectiveMaxWidth =\n                configuredMaxWidth != null\n                  ? Math.min(configuredMaxWidth, safeAvailableWidth)\n                  : safeAvailableWidth\n              this.popup.style.maxWidth = `${effectiveMaxWidth}px`\n\n              if (this.fullWidth) {\n                this.popup.style.width = '100vw'\n              }\n            },\n          }),\n          ...(this.arrowElement\n            ? [arrow({ element: this.arrowElement, padding: 8 })]\n            : []),\n        ],\n      },\n    )\n\n    Object.assign(this.popup.style, {\n      left: `${x}px`,\n      top: `${y}px`,\n    })\n\n    if (this.arrowElement) {\n      const { x: arrowX, y: arrowY } = middlewareData.arrow as Coords\n      const [side] = placement.split('-')\n      const staticSide =\n        {\n          top: 'bottom',\n          right: 'left',\n          bottom: 'top',\n          left: 'right',\n        }[side] ?? ''\n\n      Object.assign(this.arrowElement.style, {\n        left: arrowX != null ? `${arrowX}px` : '',\n        top: arrowY != null ? `${arrowY}px` : '',\n        [staticSide]: `-5px`,\n      })\n\n      this.arrowElement.classList.remove(\n        'popup__arrow--top',\n        'popup__arrow--right',\n        'popup__arrow--bottom',\n        'popup__arrow--left',\n      )\n      this.arrowElement.classList.add(`popup__arrow--${side}`)\n    }\n  }\n\n  renderTrigger(): TemplateResult {\n    return html``\n  }\n\n  renderPopup() {\n    return html`\n      <slot name=\"trigger\" @slotchange=${this._handleTriggerSlotChange}>\n        ${this.renderTrigger()}\n      </slot>\n      <div\n        part=\"popup\"\n        id=\"popup\"\n        ?inert=${!this.opened}\n        class=${clsx('popup', `popup--${this.size}`, {\n          'popup--opened': this.opened,\n          'popup--fixed': this.floatingStrategy === 'fixed',\n          'popup--has-arrow': this.hasArrow,\n          'popup--overflow': this.overflow,\n          'popup--full-width': this.fullWidth,\n        })}>\n        <slot @slotchange=${this._handleContentSlotChange}></slot>\n        ${this.hasArrow\n          ? html`<div\n              part=\"arrow\"\n              class=${clsx('popup__arrow')}\n              role=\"presentation\"></div>`\n          : ''}\n      </div>\n    `\n  }\n}\n"],"names":["_PopupBaseElement","SizedMixin","DdsElement","__async","__superGet","changedProps","_a","_b","e","_e","entries","autoUpdate","resolve","triggerRect","x","y","placement","middlewareData","computePosition","offset","flip","shift","size","rects","availableHeight","availableWidth","elements","safeAvailableHeight","safeAvailableWidth","syncWidth","configuredMaxHeight","effectiveMaxHeight","configuredMaxWidth","effectiveMaxWidth","arrow","arrowX","arrowY","side","staticSide","html","clsx","unsafeCSS","styles","PopupBaseElement","__decorateClass","query","property"],"mappings":"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"}
+{"version":3,"file":"popup-base-element.js","sources":["../../../src/components/popup/popup-base-element.ts"],"sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  computePosition,\n  Coords,\n  flip,\n  offset,\n  shift,\n  size,\n} from '@floating-ui/dom'\nimport { clsx } from 'clsx'\nimport { TemplateResult, unsafeCSS } from 'lit'\nimport { property, query } from 'lit/decorators.js'\nimport { html } from 'lit/static-html.js'\n\nimport { SizedMixin } from '@/internal/mixin/sizedMixin'\n\nimport { FloatingStrategy, PopupPlacement } from '../../common/types'\nimport { DdsElement } from '../../internal/dds-hu-element'\nimport styles from './popup.scss?inline'\n\n// Roles on which ARIA 1.2 permits aria-expanded; on any other role axe reports aria-allowed-attr\nconst EXPANDABLE_ROLES = new Set([\n  'application',\n  'button',\n  'checkbox',\n  'columnheader',\n  'combobox',\n  'gridcell',\n  'link',\n  'menuitem',\n  'row',\n  'rowheader',\n  'tab',\n  'treeitem',\n])\n\nconst EXPANDABLE_INPUT_TYPES = new Set([\n  'button',\n  'checkbox',\n  'image',\n  'reset',\n  'submit',\n])\n\nexport default class PopupBaseElement extends SizedMixin(DdsElement) {\n  static readonly styles = unsafeCSS(styles)\n\n  protected triggerElement: Element | null = null\n  private cleanup: ReturnType<typeof autoUpdate> | undefined\n  private intersectionObserver: IntersectionObserver | null = null\n\n  @query('.popup') protected readonly popup!: HTMLDivElement\n  @query('.popup__arrow') private readonly arrowElement?: HTMLDivElement\n\n  /** The disabled state of the popup. */\n  @property({ reflect: true, type: Boolean }) disabled? = false\n\n  /** The open state of the popup. */\n  @property({ reflect: true, type: Boolean }) opened? = false\n\n  /** The placement of the popup.\n   * @type {'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end'}\n   */\n  @property({ reflect: true }) placement: PopupPlacement = 'bottom'\n\n  /** The floating strategy of the popup.\n   * @type {'absolute' | 'fixed'}\n   */\n  @property({ reflect: true })\n  floatingStrategy: FloatingStrategy = 'absolute'\n\n  /** The offset of the popup. */\n  @property({ type: Number }) offset = 0\n\n  /** Whether the popup should sync its width with the trigger. */\n  @property({ type: Boolean }) sync?: boolean\n\n  /** The maximum height of the popup. */\n  @property({ type: Number }) maxHeight: number | 'auto' = 250\n\n  /** The maximum width of the popup. */\n  @property({ type: Number }) maxWidth: number | 'auto' = 'auto'\n\n  /** Whether the popup has an arrow. */\n  @property({ type: Boolean }) hasArrow: boolean\n\n  /** Whether the popup should overflow. */\n  @property({ type: Boolean }) overflow: boolean\n\n  /** Whether the popup should take full width of the screen. */\n  @property({ type: Boolean }) fullWidth: boolean\n\n  /** Whether to keep popup open when trigger leaves viewport. */\n  @property({ type: Boolean }) disableViewportAutoClose: boolean = false\n\n  async connectedCallback() {\n    super.connectedCallback()\n\n    await this.updateComplete\n    this.startUpdate()\n  }\n\n  protected firstUpdated(changedProps: Map<string, unknown>) {\n    super.firstUpdated(changedProps)\n\n    this.syncTriggerAria()\n  }\n\n  /**\n   * Whether the trigger can carry aria-expanded. Role-less wrappers (e.g. the\n   * combobox/datepicker field frame) expose state on their own inner control.\n   */\n  private triggerSupportsExpanded(el: Element): boolean {\n    const role = el.getAttribute('role')\n    if (role) {\n      return EXPANDABLE_ROLES.has(role)\n    }\n    if (el.tagName === 'BUTTON') {\n      return true\n    }\n    if (el.tagName === 'A') {\n      return el.hasAttribute('href')\n    }\n    if (el.tagName === 'INPUT') {\n      return EXPANDABLE_INPUT_TYPES.has((el as HTMLInputElement).type)\n    }\n    return false\n  }\n\n  private syncTriggerAria() {\n    const trigger = this.triggerElement\n    if (!trigger || !this.triggerSupportsExpanded(trigger)) {\n      return\n    }\n    // Keep a trigger's own aria-controls (e.g. select points at its option list)\n    if (!trigger.hasAttribute('aria-controls')) {\n      trigger.setAttribute('aria-controls', 'popup')\n    }\n    trigger.setAttribute('aria-expanded', String(!!this.opened))\n  }\n\n  async updated(changedProps: Map<string, unknown>) {\n    super.updated(changedProps)\n\n    if (changedProps.has('opened')) {\n      if (this.opened) {\n        this.startUpdate()\n        this.syncTriggerAria()\n        this.emit('dds-opened')\n      } else {\n        this.stopUpdate()\n        this.syncTriggerAria()\n        this.emit('dds-closed')\n      }\n    }\n\n    if (changedProps.has('anchor')) {\n      this._handleTriggerSlotChange()\n    }\n\n    if (this.opened) {\n      await this.updateComplete\n      this.updatePosition()\n    }\n  }\n\n  async _handleTriggerSlotChange(e?: Event | undefined) {\n    this._handleTriggerSlotChangeCallback(e)\n\n    await this.stopUpdate()\n\n    // Use :scope > to only match direct children, not descendants\n    this.triggerElement = this.querySelector<HTMLElement>(\n      ':scope > [slot=\"trigger\"]',\n    )\n\n    if (!this.triggerElement) {\n      this.triggerElement = this.shadowRoot?.querySelector(\n        'slot[name=\"trigger\"] *',\n      ) as HTMLElement\n    }\n\n    if (this.triggerElement instanceof HTMLSlotElement) {\n      this.triggerElement = this.triggerElement.assignedElements({\n        flatten: true,\n      })[0] as HTMLElement\n    }\n\n    if (this.triggerElement) {\n      this.startUpdate()\n    }\n  }\n\n  public _handleTriggerSlotChangeCallback(_e?: Event) {\n    return\n  }\n\n  public _handleContentSlotChange(_e: Event) {\n    return\n  }\n\n  public startUpdate() {\n    if (!this.triggerElement) {\n      return\n    }\n\n    // Create IntersectionObserver to detect when trigger is out of viewport\n    this.intersectionObserver?.disconnect()\n    this.intersectionObserver = new IntersectionObserver(\n      entries => {\n        // If trigger is not intersecting (out of viewport), close the popup\n        if (\n          entries[0] &&\n          !entries[0].isIntersecting &&\n          this.opened &&\n          !this.disableViewportAutoClose\n        ) {\n          this.opened = false\n          this.emit('dds-close')\n        }\n      },\n      { threshold: 0 },\n    )\n    this.intersectionObserver.observe(this.triggerElement)\n\n    this.cleanup = autoUpdate(this.triggerElement, this.popup, () => {\n      this.updatePosition()\n    })\n  }\n\n  public async stopUpdate(): Promise<void> {\n    return new Promise(resolve => {\n      if (this.intersectionObserver) {\n        this.intersectionObserver.disconnect()\n        this.intersectionObserver = null\n      }\n\n      if (this.cleanup) {\n        this.cleanup()\n        this.cleanup = undefined\n        requestAnimationFrame(() => resolve())\n      } else {\n        resolve()\n      }\n    })\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback()\n\n    // Clean up the IntersectionObserver\n    if (this.intersectionObserver) {\n      this.intersectionObserver.disconnect()\n      this.intersectionObserver = null\n    }\n\n    this.stopUpdate()\n  }\n\n  protected async updatePosition() {\n    if (this.disabled || !this.triggerElement) {\n      return\n    }\n\n    // Check if trigger element is visible in viewport\n    const triggerRect = this.triggerElement.getBoundingClientRect()\n    const isVisible =\n      triggerRect.top < window.innerHeight &&\n      triggerRect.bottom > 0 &&\n      triggerRect.left < window.innerWidth &&\n      triggerRect.right > 0\n\n    if (!isVisible) {\n      if (this.opened && !this.disableViewportAutoClose) {\n        this.opened = false\n        this.emit('dds-close')\n      }\n      return\n    }\n\n    const { x, y, placement, middlewareData } = await computePosition(\n      this.triggerElement,\n      this.popup,\n      {\n        placement: this.placement,\n        strategy: this.floatingStrategy,\n        middleware: [\n          offset(this.offset),\n          flip(),\n          shift(),\n          size({\n            apply: ({ rects, availableHeight, availableWidth, elements }) => {\n              const safeAvailableHeight = Math.max(0, availableHeight)\n              const safeAvailableWidth = Math.max(0, availableWidth)\n              const syncWidth = this.sync\n              this.popup.style.width = syncWidth\n                ? `${rects.reference.width}px`\n                : ''\n\n              const configuredMaxHeight =\n                typeof this.maxHeight === 'number' ? this.maxHeight : undefined\n              const effectiveMaxHeight =\n                configuredMaxHeight != null\n                  ? Math.min(configuredMaxHeight, safeAvailableHeight)\n                  : safeAvailableHeight\n              this.popup.style.maxHeight =\n                effectiveMaxHeight >= elements.floating.scrollHeight\n                  ? ''\n                  : `${effectiveMaxHeight}px`\n\n              const configuredMaxWidth =\n                typeof this.maxWidth === 'number' ? this.maxWidth : undefined\n              const effectiveMaxWidth =\n                configuredMaxWidth != null\n                  ? Math.min(configuredMaxWidth, safeAvailableWidth)\n                  : safeAvailableWidth\n              this.popup.style.maxWidth = `${effectiveMaxWidth}px`\n\n              if (this.fullWidth) {\n                this.popup.style.width = '100vw'\n              }\n            },\n          }),\n          ...(this.arrowElement\n            ? [arrow({ element: this.arrowElement, padding: 8 })]\n            : []),\n        ],\n      },\n    )\n\n    Object.assign(this.popup.style, {\n      left: `${x}px`,\n      top: `${y}px`,\n    })\n\n    if (this.arrowElement) {\n      const { x: arrowX, y: arrowY } = middlewareData.arrow as Coords\n      const [side] = placement.split('-')\n      const staticSide =\n        {\n          top: 'bottom',\n          right: 'left',\n          bottom: 'top',\n          left: 'right',\n        }[side] ?? ''\n\n      Object.assign(this.arrowElement.style, {\n        left: arrowX != null ? `${arrowX}px` : '',\n        top: arrowY != null ? `${arrowY}px` : '',\n        [staticSide]: `-5px`,\n      })\n\n      this.arrowElement.classList.remove(\n        'popup__arrow--top',\n        'popup__arrow--right',\n        'popup__arrow--bottom',\n        'popup__arrow--left',\n      )\n      this.arrowElement.classList.add(`popup__arrow--${side}`)\n    }\n  }\n\n  renderTrigger(): TemplateResult {\n    return html``\n  }\n\n  renderPopup() {\n    return html`\n      <slot name=\"trigger\" @slotchange=${this._handleTriggerSlotChange}>\n        ${this.renderTrigger()}\n      </slot>\n      <div\n        part=\"popup\"\n        id=\"popup\"\n        ?inert=${!this.opened}\n        class=${clsx('popup', `popup--${this.size}`, {\n          'popup--opened': this.opened,\n          'popup--fixed': this.floatingStrategy === 'fixed',\n          'popup--has-arrow': this.hasArrow,\n          'popup--overflow': this.overflow,\n          'popup--full-width': this.fullWidth,\n        })}>\n        <slot @slotchange=${this._handleContentSlotChange}></slot>\n        ${this.hasArrow\n          ? html`<div\n              part=\"arrow\"\n              class=${clsx('popup__arrow')}\n              role=\"presentation\"></div>`\n          : ''}\n      </div>\n    `\n  }\n}\n"],"names":["EXPANDABLE_ROLES","EXPANDABLE_INPUT_TYPES","_PopupBaseElement","SizedMixin","DdsElement","__async","__superGet","changedProps","el","role","trigger","e","_a","_e","entries","autoUpdate","resolve","triggerRect","x","y","placement","middlewareData","computePosition","offset","flip","shift","size","rects","availableHeight","availableWidth","elements","safeAvailableHeight","safeAvailableWidth","syncWidth","configuredMaxHeight","effectiveMaxHeight","configuredMaxWidth","effectiveMaxWidth","arrow","arrowX","arrowY","side","staticSide","html","clsx","unsafeCSS","styles","PopupBaseElement","__decorateClass","query","property"],"mappings":"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"}