@angular/aria 22.0.0-next.6 → 22.0.0-next.8

package/types/tabs.d.ts

@@ -1,11 +1,10 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy } from '@angular/core';
+import { OnInit, OnDestroy, WritableSignal } from '@angular/core';
 import * as _angular_cdk_bidi from '@angular/cdk/bidi';
 import { TabPattern, TabListPattern, TabPanelPattern } from './_tabs-chunk.js';
-import { HasElement } from './_element-chunk.js';
+import { HasElement, SortedCollection } from './_collection-chunk.js';
 import { DeferredContentAware, DeferredContent } from './_deferred-content-chunk.js';
 import './_keyboard-event-manager-chunk.js';
-import './_signal-like-chunk.js';
 import './_click-event-manager-chunk.js';
 import './_expansion-chunk.js';
 import './_list-navigation-chunk.js';
@@ -31,14 +30,10 @@ declare class Tab implements HasElement, OnInit, OnDestroy {
     private readonly _elementRef;
     /** A reference to the host element. */
     readonly element: HTMLElement;
-    /** The parent Tabs. */
-    private readonly _tabs;
     /** The parent TabList. */
     private readonly _tabList;
     /** A unique identifier for the widget. */
     readonly id: _angular_core.InputSignal<string>;
-    /** The parent TabList UIPattern. */
-    private readonly _tablistPattern;
     /** The TabPanel UIPattern associated with the tab */
     private readonly _tabpanelPattern;
     /** Whether a tab is disabled. */
@@ -82,16 +77,16 @@ declare class TabList implements OnInit, OnDestroy {
     private readonly _elementRef;
     /** A reference to the host element. */
     readonly element: HTMLElement;
-    /** The parent Tabs. */
-    private readonly _tabs;
-    /** The Tabs nested inside of the TabList. */
-    private readonly _unorderedTabs;
-    /** Text direction. */
-    readonly textDirection: _angular_core.WritableSignal<_angular_cdk_bidi.Direction>;
+    /** The parent Tabs container. */
+    readonly _tabsParent: Tabs;
+    /** The collection of Tabs. */
+    readonly _collection: SortedCollection<Tab>;
     /** The Tab UIPatterns of the child Tabs. */
     readonly _tabPatterns: _angular_core.Signal<TabPattern[]>;
     /** Whether the tablist is vertically or horizontally oriented. */
     readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
+    /** Text direction. */
+    readonly textDirection: WritableSignal<_angular_cdk_bidi.Direction>;
     /** Whether focus should wrap when navigating. */
     readonly wrap: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
@@ -111,8 +106,10 @@ declare class TabList implements OnInit, OnDestroy {
      * - `explicit`: Tabs are selected explicitly by the user (e.g., via click or spacebar).
      */
     readonly selectionMode: _angular_core.InputSignal<"follow" | "explicit">;
-    /** The current selected tab. */
+    /** The current selected tab as a model input. */
     readonly selectedTab: _angular_core.ModelSignal<string | undefined>;
+    /** The current selected Tab pattern, passed to the List pattern. */
+    private readonly _selectedTabPattern;
     /** Whether the tablist is disabled. */
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** The TabList UIPattern. */
@@ -120,10 +117,9 @@ declare class TabList implements OnInit, OnDestroy {
     constructor();
     ngOnInit(): void;
     ngOnDestroy(): void;
-    _register(child: Tab): void;
-    _unregister(child: Tab): void;
     /** Opens the tab panel with the specified value. */
     open(value: string): boolean;
+    findTab(value?: string): Tab | undefined;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabList, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TabList, "[ngTabList]", ["ngTabList"], { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "wrap": { "alias": "wrap"; "required": false; "isSignal": true; }; "softDisabled": { "alias": "softDisabled"; "required": false; "isSignal": true; }; "focusMode": { "alias": "focusMode"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "selectedTab": { "alias": "selectedTab"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "selectedTab": "selectedTabChange"; }, never, never, true, never>;
 }
@@ -204,21 +200,27 @@ declare class TabPanel implements OnInit, OnDestroy {
  *
  * @see [Tabs](guide/aria/tabs)
  */
-declare class Tabs {
+declare class Tabs implements OnDestroy {
     /** A reference to the host element. */
     private readonly _elementRef;
     /** A reference to the host element. */
     readonly element: HTMLElement;
-    /** The TabList nested inside of the container. */
-    private readonly _tablist;
-    /** The TabPanels nested inside of the container. */
-    private readonly _unorderedPanels;
+    /** The TabList registered for this container. */
+    readonly _tabList: _angular_core.WritableSignal<TabList | undefined>;
+    /** The collection of TabPanels. */
+    readonly _collection: SortedCollection<TabPanel>;
     /** The Tab UIPattern of the child Tabs. */
     readonly _tabPatterns: _angular_core.Signal<TabPattern[] | undefined>;
     /** The TabPanel UIPattern of the child TabPanels. */
-    readonly _unorderedTabpanelPatterns: _angular_core.Signal<TabPanelPattern[]>;
-    _register(child: TabList | TabPanel): void;
-    _unregister(child: TabList | TabPanel): void;
+    readonly _tabPanelPatterns: _angular_core.Signal<TabPanelPattern[]>;
+    /** A reactive map of tab values to their TabPanelPattern. */
+    readonly _panelMap: _angular_core.Signal<Map<string, TabPanelPattern>>;
+    /** A reactive map of tab values to their TabPattern. */
+    readonly _tabMap: _angular_core.Signal<Map<string, TabPattern>>;
+    constructor();
+    ngOnDestroy(): void;
+    _register(child: TabList): void;
+    _unregister(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tabs, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Tabs, "[ngTabs]", ["ngTabs"], {}, {}, never, never, true, never>;
 }

package/types/toolbar-testing.d.ts

@@ -12,6 +12,8 @@ interface ToolbarWidgetHarnessFilters extends BaseHarnessFilters {
     text?: string | RegExp;
     /** Active state that the widget should match. */
     active?: boolean;
+    /** Selected state that the widget should match. */
+    selected?: boolean;
 }
 
 /** Harness for interacting with an Aria toolbar widget in tests. */
@@ -32,6 +34,8 @@ declare class ToolbarWidgetHarness extends ContentContainerComponentHarness<stri
     isActive(): Promise<boolean>;
     /** Gets whether the widget is disabled. */
     isDisabled(): Promise<boolean>;
+    /** Gets whether the widget is selected. */
+    isSelected(): Promise<boolean>;
 }
 
 /** Harness for interacting with an Aria toolbar widget group in tests. */

package/types/toolbar.d.ts

@@ -2,7 +2,7 @@ import * as _angular_core from '@angular/core';
 import { OnInit, OnDestroy } from '@angular/core';
 import * as _angular_cdk_bidi from '@angular/cdk/bidi';
 import { ToolbarWidgetGroupPattern, ToolbarWidgetPattern, ToolbarPattern } from './_toolbar-chunk.js';
-import './_signal-like-chunk.js';
+import { SortedCollection } from './_collection-chunk.js';
 import './_list-chunk.js';
 import './_list-navigation-chunk.js';
 
@@ -108,13 +108,13 @@ declare class ToolbarWidget<V> implements OnInit, OnDestroy {
  *
  * @see [Toolbar](guide/aria/toolbar)
  */
-declare class Toolbar<V> {
+declare class Toolbar<V> implements OnDestroy {
     /** A reference to the host element. */
     private readonly _elementRef;
     /** A reference to the host element. */
     readonly element: HTMLElement;
-    /** The TabList nested inside of the container. */
-    private readonly _widgets;
+    /** The collection of widgets in the toolbar. */
+    readonly _collection: SortedCollection<ToolbarWidget<V>>;
     /** Text direction. */
     readonly textDirection: _angular_core.WritableSignal<_angular_cdk_bidi.Direction>;
     /** Sorted UIPatterns of the child widgets */
@@ -135,8 +135,7 @@ declare class Toolbar<V> {
     /** The toolbar UIPattern. */
     readonly _pattern: ToolbarPattern<V>;
     constructor();
-    _register(widget: ToolbarWidget<V>): void;
-    _unregister(widget: ToolbarWidget<V>): void;
+    ngOnDestroy(): void;
     /** Finds the toolbar item associated with a given element. */
     private _getItem;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<Toolbar<any>, never>;

package/types/tree-testing.d.ts

@@ -38,6 +38,14 @@ declare class TreeItemHarness extends ContentContainerComponentHarness<string> {
     getText(): Promise<string>;
     /** Clicks the tree item. */
     click(): Promise<void>;
+    /** Focuses the tree item. */
+    focus(): Promise<void>;
+    /** Blurs the tree item. */
+    blur(): Promise<void>;
+    /** Whether the tree item is active. */
+    isActive(): Promise<boolean>;
+    /** Whether the tree item has focus. */
+    isFocused(): Promise<boolean>;
     private _getHostAttribute;
 }
 

package/types/tree.d.ts

@@ -2,18 +2,13 @@ import * as _angular_cdk_bidi from '@angular/cdk/bidi';
 import * as _angular_core from '@angular/core';
 import { OnInit, OnDestroy, Signal } from '@angular/core';
 import { TreeItemPattern, TreePattern } from './_tree-chunk.js';
+import { HasElement, SortedCollection } from './_collection-chunk.js';
 import { DeferredContent, DeferredContentAware } from './_deferred-content-chunk.js';
-import { HasElement } from './_element-chunk.js';
-import { ComboboxPopup } from './combobox.js';
-export { Combobox as ɵɵCombobox, ComboboxDialog as ɵɵComboboxDialog, ComboboxInput as ɵɵComboboxInput, ComboboxPopupContainer as ɵɵComboboxPopupContainer } from './combobox.js';
-import './_signal-like-chunk.js';
 import './_expansion-chunk.js';
 import './_list-navigation-chunk.js';
 import './_list-chunk.js';
 import './_keyboard-event-manager-chunk.js';
 import './_click-event-manager-chunk.js';
-import './_combobox-chunk.js';
-import './_pointer-event-manager-chunk.js';
 
 /**
  * Group that contains children tree items.
@@ -155,15 +150,13 @@ declare class TreeItem<V> extends DeferredContentAware implements OnInit, OnDest
  *
  * @see [Tree](guide/aria/tree)
  */
-declare class Tree<V> {
+declare class Tree<V> implements OnDestroy {
     /** A reference to the host element. */
     private readonly _elementRef;
     /** A reference to the host element. */
     readonly element: HTMLElement;
-    /** A reference to the parent combobox popup, if one exists. */
-    private readonly _popup;
-    /** All TreeItem instances within this tree. */
-    private readonly _unorderedItems;
+    /** The collection of tree items. */
+    readonly _collection: SortedCollection<TreeItem<V>>;
     /** A unique identifier for the tree. */
     readonly id: _angular_core.InputSignal<string>;
     /** Orientation of the tree. */
@@ -193,6 +186,8 @@ declare class Tree<V> {
     readonly softDisabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** The delay in seconds before the typeahead search is reset. */
     readonly typeaheadDelay: _angular_core.InputSignal<number>;
+    /** The tabindex of the tree. */
+    readonly tabIndex: _angular_core.InputSignalWithTransform<number | undefined, string | number | undefined>;
     /** The values of the currently selected items. */
     readonly value: _angular_core.ModelSignal<V[]>;
     /** Text direction. */
@@ -206,12 +201,13 @@ declare class Tree<V> {
     readonly currentType: _angular_core.InputSignal<"page" | "step" | "location" | "date" | "time" | "true" | "false">;
     /** The UI pattern for the tree. */
     readonly _pattern: TreePattern<V>;
+    /** The ID of the active descendant in the tree. */
+    readonly activeDescendant: Signal<string | undefined>;
     constructor();
-    _register(child: TreeItem<V>): void;
-    _unregister(child: TreeItem<V>): void;
+    ngOnDestroy(): void;
     scrollActiveItemIntoView(options?: ScrollIntoViewOptions): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tree<any>, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Tree<any>, "[ngTree]", ["ngTree"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "multi": { "alias": "multi"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "focusMode": { "alias": "focusMode"; "required": false; "isSignal": true; }; "wrap": { "alias": "wrap"; "required": false; "isSignal": true; }; "softDisabled": { "alias": "softDisabled"; "required": false; "isSignal": true; }; "typeaheadDelay": { "alias": "typeaheadDelay"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "nav": { "alias": "nav"; "required": false; "isSignal": true; }; "currentType": { "alias": "currentType"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, [{ directive: typeof ComboboxPopup; inputs: {}; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Tree<any>, "[ngTree]", ["ngTree"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "multi": { "alias": "multi"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "focusMode": { "alias": "focusMode"; "required": false; "isSignal": true; }; "wrap": { "alias": "wrap"; "required": false; "isSignal": true; }; "softDisabled": { "alias": "softDisabled"; "required": false; "isSignal": true; }; "typeaheadDelay": { "alias": "typeaheadDelay"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabindex"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "nav": { "alias": "nav"; "required": false; "isSignal": true; }; "currentType": { "alias": "currentType"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
 }
 
-export { Tree, TreeItem, TreeItemGroup, ComboboxPopup as ɵɵComboboxPopup, DeferredContent as ɵɵDeferredContent };
+export { Tree, TreeItem, TreeItemGroup, DeferredContent as ɵɵDeferredContent };

package/fesm2022/_combobox-chunk.mjs

@@ -1,429 +0,0 @@
-import { computed, signal, KeyboardEventManager } from './_signal-like-chunk.mjs';
-import { PointerEventManager } from './_pointer-event-manager-chunk.mjs';
-
-class ComboboxPattern {
-  inputs;
-  expanded = signal(false);
-  disabled = () => this.inputs.disabled();
-  activeDescendant = computed(() => {
-    const popupControls = this.inputs.popupControls();
-    if (popupControls instanceof ComboboxDialogPattern) {
-      return null;
-    }
-    return popupControls?.activeId() ?? null;
-  });
-  highlightedItem = signal(undefined);
-  _isDeleting = false;
-  isFocused = signal(false);
-  hasBeenInteracted = signal(false);
-  expandKey = computed(() => this.inputs.textDirection() === 'rtl' ? 'ArrowLeft' : 'ArrowRight');
-  collapseKey = computed(() => this.inputs.textDirection() === 'rtl' ? 'ArrowRight' : 'ArrowLeft');
-  popupId = computed(() => this.inputs.popupControls()?.id() || null);
-  autocomplete = computed(() => this.inputs.filterMode() === 'highlight' ? 'both' : 'list');
-  hasPopup = computed(() => this.inputs.popupControls()?.role() || null);
-  readonly = computed(() => this.inputs.readonly() || this.inputs.disabled() || null);
-  listControls = () => {
-    const popupControls = this.inputs.popupControls();
-    if (popupControls instanceof ComboboxDialogPattern) {
-      return null;
-    }
-    return popupControls;
-  };
-  treeControls = () => {
-    const popupControls = this.inputs.popupControls();
-    if (popupControls?.role() === 'tree') {
-      return popupControls;
-    }
-    return null;
-  };
-  keydown = computed(() => {
-    const manager = new KeyboardEventManager();
-    const popupControls = this.inputs.popupControls();
-    if (!popupControls) {
-      return manager;
-    }
-    if (popupControls instanceof ComboboxDialogPattern) {
-      if (!this.expanded()) {
-        manager.on('ArrowUp', () => this.open()).on('ArrowDown', () => this.open());
-        if (this.readonly()) {
-          manager.on('Enter', () => this.open()).on(' ', () => this.open());
-        }
-      }
-      return manager;
-    }
-    if (!this.inputs.alwaysExpanded()) {
-      manager.on('Escape', () => this.close({
-        reset: !this.readonly()
-      }));
-    }
-    if (!this.expanded()) {
-      manager.on('ArrowDown', () => this.open({
-        first: true
-      })).on('ArrowUp', () => this.open({
-        last: true
-      }));
-      if (this.readonly()) {
-        manager.on('Enter', () => this.open({
-          selected: true
-        })).on(' ', () => this.open({
-          selected: true
-        }));
-      }
-      return manager;
-    }
-    manager.on('ArrowDown', () => this.next(), {
-      ignoreRepeat: false
-    }).on('ArrowUp', () => this.prev(), {
-      ignoreRepeat: false
-    }).on('Home', () => this.first()).on('End', () => this.last());
-    if (this.readonly()) {
-      manager.on(' ', () => this.select({
-        commit: true,
-        close: !popupControls.multi()
-      }));
-    }
-    if (popupControls.role() === 'listbox') {
-      manager.on('Enter', () => {
-        this.select({
-          commit: true,
-          close: !popupControls.multi()
-        });
-      });
-    }
-    const treeControls = this.treeControls();
-    if (treeControls?.isItemSelectable()) {
-      manager.on('Enter', () => this.select({
-        commit: true,
-        close: true
-      }));
-    }
-    if (treeControls?.isItemExpandable()) {
-      manager.on(this.expandKey(), () => this.expandItem()).on(this.collapseKey(), () => this.collapseItem());
-      if (!treeControls.isItemSelectable()) {
-        manager.on('Enter', () => this.expandItem());
-      }
-    }
-    if (treeControls?.isItemCollapsible()) {
-      manager.on(this.collapseKey(), () => this.collapseItem());
-    }
-    return manager;
-  });
-  click = computed(() => new PointerEventManager().on(e => {
-    if (e.target === this.inputs.inputEl()) {
-      if (this.readonly()) {
-        this.expanded() ? this.close() : this.open({
-          selected: true
-        });
-      }
-    }
-    const controls = this.inputs.popupControls();
-    if (controls instanceof ComboboxDialogPattern) {
-      return;
-    }
-    const item = controls?.getItem(e);
-    if (item) {
-      if (controls?.role() === 'tree') {
-        const treeControls = controls;
-        if (treeControls.isItemExpandable(item) && !treeControls.isItemSelectable(item)) {
-          treeControls.toggleExpansion(item);
-          this.inputs.inputEl()?.focus();
-          return;
-        }
-      }
-      this.select({
-        item,
-        commit: true,
-        close: !controls?.multi()
-      });
-      this.inputs.inputEl()?.focus();
-    }
-  }));
-  constructor(inputs) {
-    this.inputs = inputs;
-  }
-  onKeydown(event) {
-    if (!this.inputs.disabled()) {
-      this.keydown().handle(event);
-    }
-  }
-  onClick(event) {
-    if (!this.inputs.disabled()) {
-      this.click().handle(event);
-    }
-  }
-  onInput(event) {
-    if (this.inputs.disabled() || this.inputs.readonly()) {
-      return;
-    }
-    const inputEl = this.inputs.inputEl();
-    if (!inputEl) {
-      return;
-    }
-    const popupControls = this.inputs.popupControls();
-    if (popupControls instanceof ComboboxDialogPattern) {
-      return;
-    }
-    this.open();
-    this.inputs.inputValue?.set(inputEl.value);
-    this._isDeleting = event instanceof InputEvent && !!event.inputType.match(/^delete/);
-    if (this.inputs.filterMode() === 'highlight' && !this._isDeleting) {
-      this.highlight();
-    }
-  }
-  onFocusIn() {
-    if (this.inputs.alwaysExpanded() && !this.hasBeenInteracted()) {
-      const firstSelectedItem = this.listControls()?.getSelectedItems()[0];
-      firstSelectedItem ? this.listControls()?.focus(firstSelectedItem) : this.first();
-    }
-    this.isFocused.set(true);
-    this.hasBeenInteracted.set(true);
-  }
-  onFocusOut(event) {
-    if (this.inputs.disabled()) {
-      return;
-    }
-    const popupControls = this.inputs.popupControls();
-    if (popupControls instanceof ComboboxDialogPattern) {
-      return;
-    }
-    if (!(event.relatedTarget instanceof HTMLElement) || !this.inputs.containerEl()?.contains(event.relatedTarget)) {
-      this.isFocused.set(false);
-      if (!this.expanded()) {
-        return;
-      }
-      if (this.readonly()) {
-        this.close();
-        return;
-      }
-      if (this.inputs.filterMode() !== 'manual') {
-        this.commit();
-      } else {
-        const item = popupControls?.items().find(i => i.searchTerm() === this.inputs.inputEl()?.value);
-        if (item) {
-          this.select({
-            item
-          });
-        }
-      }
-      this.close();
-    }
-  }
-  firstMatch = computed(() => {
-    if (this.listControls()?.role() === 'listbox') {
-      return this.listControls()?.items()[0];
-    }
-    return this.listControls()?.items().find(i => i.value() === this.inputs.firstMatch());
-  });
-  onFilter() {
-    if (this.readonly()) {
-      return;
-    }
-    const popupControls = this.inputs.popupControls();
-    if (popupControls instanceof ComboboxDialogPattern) {
-      return;
-    }
-    const isInitialRender = !this.inputs.inputValue?.().length && !this._isDeleting;
-    if (isInitialRender) {
-      return;
-    }
-    if (!this.isFocused()) {
-      return;
-    }
-    if (this.inputs.popupControls()?.role() === 'tree') {
-      const treeControls = this.inputs.popupControls();
-      this.inputs.inputValue?.().length ? treeControls.expandAll() : treeControls.collapseAll();
-    }
-    const item = this.firstMatch();
-    if (!item) {
-      popupControls?.clearSelection();
-      popupControls?.unfocus();
-      return;
-    }
-    popupControls?.focus(item);
-    if (this.inputs.filterMode() !== 'manual') {
-      this.select({
-        item
-      });
-    }
-    if (this.inputs.filterMode() === 'highlight' && !this._isDeleting) {
-      this.highlight();
-    }
-  }
-  highlight() {
-    const inputEl = this.inputs.inputEl();
-    const selectedItems = this.listControls()?.getSelectedItems();
-    const item = selectedItems?.[0];
-    if (!inputEl || !item) {
-      return;
-    }
-    const isHighlightable = item.searchTerm().toLowerCase().startsWith(this.inputs.inputValue().toLowerCase());
-    if (isHighlightable) {
-      inputEl.value = this.inputs.inputValue() + item.searchTerm().slice(this.inputs.inputValue().length);
-      inputEl.setSelectionRange(this.inputs.inputValue().length, item.searchTerm().length);
-      this.highlightedItem.set(item);
-    }
-  }
-  close(opts) {
-    const popupControls = this.inputs.popupControls();
-    if (this.inputs.alwaysExpanded()) {
-      return;
-    }
-    if (popupControls instanceof ComboboxDialogPattern) {
-      this.expanded.set(false);
-      return;
-    }
-    if (this.readonly()) {
-      this.expanded.set(false);
-      popupControls?.unfocus();
-      return;
-    }
-    if (!opts?.reset) {
-      if (this.inputs.filterMode() === 'manual') {
-        if (!this.listControls()?.items().some(i => i.searchTerm() === this.inputs.inputEl()?.value)) {
-          this.listControls()?.clearSelection();
-        }
-      }
-      this.expanded.set(false);
-      popupControls?.unfocus();
-      return;
-    }
-    if (!this.expanded()) {
-      this.inputs.inputValue?.set('');
-      popupControls?.clearSelection();
-      const inputEl = this.inputs.inputEl();
-      if (inputEl) {
-        inputEl.value = '';
-      }
-    } else if (this.expanded()) {
-      this.expanded.set(false);
-      const selectedItem = popupControls?.getSelectedItems()?.[0];
-      if (selectedItem?.searchTerm() !== this.inputs.inputValue()) {
-        popupControls?.clearSelection();
-      }
-      return;
-    }
-    this.close();
-    if (!this.readonly()) {
-      popupControls?.clearSelection();
-    }
-  }
-  open(nav) {
-    this.expanded.set(true);
-    const popupControls = this.inputs.popupControls();
-    if (popupControls instanceof ComboboxDialogPattern) {
-      return;
-    }
-    const inputEl = this.inputs.inputEl();
-    if (inputEl && this.inputs.filterMode() === 'highlight') {
-      const isHighlighting = inputEl.selectionStart !== inputEl.value.length;
-      this.inputs.inputValue?.set(inputEl.value.slice(0, inputEl.selectionStart || 0));
-      if (!isHighlighting) {
-        this.highlightedItem.set(undefined);
-      }
-    }
-    if (nav?.first) {
-      this.first();
-    }
-    if (nav?.last) {
-      this.last();
-    }
-    if (nav?.selected) {
-      const selectedItem = popupControls?.items().find(i => popupControls?.getSelectedItems().includes(i));
-      if (selectedItem) {
-        popupControls?.focus(selectedItem);
-      }
-    }
-  }
-  next() {
-    this._navigate(() => this.listControls()?.next());
-  }
-  prev() {
-    this._navigate(() => this.listControls()?.prev());
-  }
-  first() {
-    this._navigate(() => this.listControls()?.first());
-  }
-  last() {
-    this._navigate(() => this.listControls()?.last());
-  }
-  collapseItem() {
-    const controls = this.inputs.popupControls();
-    this._navigate(() => controls?.collapseItem());
-  }
-  expandItem() {
-    const controls = this.inputs.popupControls();
-    this._navigate(() => controls?.expandItem());
-  }
-  select(opts = {}) {
-    const controls = this.listControls();
-    const item = opts.item ?? controls?.getActiveItem();
-    if (item?.disabled()) {
-      return;
-    }
-    if (opts.item) {
-      controls?.focus(opts.item, {
-        focusElement: false
-      });
-    }
-    controls?.multi() ? controls.toggle(opts.item) : controls?.select(opts.item);
-    if (opts.commit) {
-      this.commit();
-    }
-    if (opts.close) {
-      this.close();
-    }
-  }
-  commit() {
-    const inputEl = this.inputs.inputEl();
-    const selectedItems = this.listControls()?.getSelectedItems();
-    if (!inputEl) {
-      return;
-    }
-    inputEl.value = selectedItems?.map(i => i.searchTerm()).join(', ') || '';
-    this.inputs.inputValue?.set(inputEl.value);
-    if (this.inputs.filterMode() === 'highlight' && !this.readonly()) {
-      const length = inputEl.value.length;
-      inputEl.setSelectionRange(length, length);
-    }
-  }
-  _navigate(operation) {
-    operation();
-    if (this.inputs.filterMode() !== 'manual') {
-      this.select();
-    }
-    if (this.inputs.filterMode() === 'highlight') {
-      const selectedItem = this.listControls()?.getSelectedItems()[0];
-      if (!selectedItem) {
-        return;
-      }
-      if (selectedItem === this.highlightedItem()) {
-        this.highlight();
-      } else {
-        const inputEl = this.inputs.inputEl();
-        inputEl.value = selectedItem?.searchTerm();
-      }
-    }
-  }
-}
-class ComboboxDialogPattern {
-  inputs;
-  id = () => this.inputs.id();
-  role = () => 'dialog';
-  keydown = computed(() => {
-    return new KeyboardEventManager().on('Escape', () => this.inputs.combobox.close());
-  });
-  constructor(inputs) {
-    this.inputs = inputs;
-  }
-  onKeydown(event) {
-    this.keydown().handle(event);
-  }
-  onClick(event) {
-    if (event.target === this.inputs.element()) {
-      this.inputs.combobox.close();
-    }
-  }
-}
-
-export { ComboboxDialogPattern, ComboboxPattern };
-//# sourceMappingURL=_combobox-chunk.mjs.map