fix(aria/combobox): several small fixes (#32202)

* fix(aria/combobox): do not open on click

* fix(aria/combobox): handle unselectable tree items

* fix(aria/combobox): multi selection

* docs(aria/combobox): multi select examples

(cherry picked from commit c345614)

Author: wagnermaciel

src/aria/combobox/combobox.spec.ts

@@ -211,12 +211,6 @@ describe('Combobox', () => {
     describe('Expansion', () => {
       beforeEach(() => setupCombobox());
 
-      it('should open on click', () => {
-        focus();
-        click(inputElement);
-        expect(inputElement.getAttribute('aria-expanded')).toBe('true');
-      });
-
       it('should open on ArrowDown', () => {
         focus();
         keydown('ArrowDown');
@@ -545,15 +539,6 @@ describe('Combobox', () => {
         escape();
         expect(inputElement.getAttribute('aria-expanded')).toBe('false');
       });
-
-      it('should clear selection on escape when closed', () => {
-        focus();
-        down();
-        enter();
-        expect(inputElement.value).toBe('Alabama');
-        escape();
-        expect(inputElement.value).toBe('');
-      });
     });
 
     // describe('with programmatic value changes', () => {
@@ -956,12 +941,6 @@ describe('Combobox', () => {
     describe('Expansion', () => {
       beforeEach(() => setupCombobox());
 
-      it('should open on click', () => {
-        focus();
-        click(inputElement);
-        expect(inputElement.getAttribute('aria-expanded')).toBe('true');
-      });
-
       it('should open on ArrowDown', () => {
         focus();
         keydown('ArrowDown');
@@ -1108,18 +1087,6 @@ describe('Combobox', () => {
         escape();
         expect(inputElement.getAttribute('aria-expanded')).toBe('false');
       });
-
-      it('should clear selection on escape when closed', () => {
-        focus();
-        down();
-        right();
-        right();
-        enter();
-        expect(inputElement.value).toBe('December');
-        expect(inputElement.getAttribute('aria-expanded')).toBe('false');
-        escape();
-        expect(inputElement.value).toBe('');
-      });
     });
   });
 });

src/aria/combobox/combobox.ts

@@ -71,7 +71,7 @@ export class Combobox<V> {
   /** Whether the combobox is focused. */
   readonly isFocused = signal(false);
 
-  /** Whether the listbox has received focus yet. */
+  /** Whether the combobox has received focus yet. */
   private _hasBeenFocused = signal(false);
 
   /** Whether the combobox is disabled. */

src/aria/private/behaviors/list-selection/list-selection.ts

@@ -71,7 +71,7 @@ export class ListSelection<T extends ListSelectionItem<V>, V> {
   }
 
   /** Deselects the item at the current active index. */
-  deselect(item?: T | null) {
+  deselect(item?: ListSelectionItem<V>) {
     item = item ?? this.inputs.focusManager.inputs.activeItem();
 
     if (item && !item.disabled() && item.selectable()) {
@@ -80,10 +80,10 @@ export class ListSelection<T extends ListSelectionItem<V>, V> {
   }
 
   /** Toggles the item at the current active index. */
-  toggle() {
-    const item = this.inputs.focusManager.inputs.activeItem();
+  toggle(item?: ListSelectionItem<V>) {
+    item = item ?? this.inputs.focusManager.inputs.activeItem();
     if (item) {
-      this.inputs.value().includes(item.value()) ? this.deselect() : this.select();
+      this.inputs.value().includes(item.value()) ? this.deselect(item) : this.select(item);
     }
   }
 

src/aria/private/behaviors/list/list.ts

@@ -171,8 +171,8 @@ export class List<T extends ListItem<V>, V> {
   }
 
   /** Toggles the currently active item in the list. */
-  toggle() {
-    this.selectionBehavior.toggle();
+  toggle(item?: T) {
+    this.selectionBehavior.toggle(item);
   }
 
   /** Toggles the currently active item in the list, deselecting all other items. */