Skip to content

refactor(aria/combobox): unify combobox and simple-combobox implementations #33175

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
tjshiu wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

refactor(aria/combobox): unify combobox and simple-combobox implementations #33175

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
84 changes: 40 additions & 44 deletions goldens/aria/combobox/index.api.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,76 +4,72 @@

```ts

import * as _angular_cdk_bidi from '@angular/cdk/bidi';
import * as _angular_core from '@angular/core';
import { ComboboxPattern } from '@angular/aria/private';
import { ComboboxPopupPattern } from '@angular/aria/private';
import { DeferredContentAware } from '@angular/aria/private';
import * as i1 from '@angular/aria/private';
import { OnDestroy } from '@angular/core';
import { OnInit } from '@angular/core';

// @public
export class Combobox<V> {
export class Combobox extends DeferredContentAware implements OnInit {
constructor();
readonly alwaysExpanded: _angular_core.InputSignalWithTransform<boolean, unknown>;
close(): void;
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
readonly element: HTMLElement;
readonly expanded: _angular_core.Signal<boolean>;
readonly filterMode: _angular_core.InputSignal<"manual" | "auto-select" | "highlight">;
readonly firstMatch: _angular_core.InputSignal<V | undefined>;
readonly inputElement: _angular_core.Signal<HTMLInputElement | undefined>;
open(): void;
readonly _pattern: ComboboxPattern<any, V>;
readonly popup: _angular_core.Signal<ComboboxPopup<V> | undefined>;
readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
protected readonly textDirection: _angular_core.Signal<_angular_cdk_bidi.Direction>;
readonly expanded: _angular_core.ModelSignal<boolean>;
readonly inlineSuggestion: _angular_core.InputSignal<string | undefined>;
// (undocumented)
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Combobox<any>, "[ngCombobox]", ["ngCombobox"], { "filterMode": { "alias": "filterMode"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "firstMatch": { "alias": "firstMatch"; "required": false; "isSignal": true; }; "alwaysExpanded": { "alias": "alwaysExpanded"; "required": false; "isSignal": true; }; }, {}, ["popup"], never, true, [{ directive: typeof DeferredContentAware; inputs: { "preserveContent": "preserveContent"; }; outputs: {}; }]>;
ngOnInit(): void;
readonly _pattern: ComboboxPattern;
readonly _popup: _angular_core.WritableSignal<ComboboxPopup | undefined>;
_registerPopup(popup: ComboboxPopup): void;
_unregisterPopup(): void;
readonly value: _angular_core.ModelSignal<string>;
// (undocumented)
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Combobox, "[ngCombobox]", ["ngCombobox"], { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "alwaysExpanded": { "alias": "alwaysExpanded"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "inlineSuggestion": { "alias": "inlineSuggestion"; "required": false; "isSignal": true; }; }, { "expanded": "expandedChange"; "value": "valueChange"; }, never, never, true, never>;
// (undocumented)
static ɵfac: _angular_core.ɵɵFactoryDeclaration<Combobox<any>, never>;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<Combobox, never>;
}

// @public
export class ComboboxDialog {
constructor();
export class ComboboxPopup implements OnInit, OnDestroy {
readonly activeDescendant: _angular_core.Signal<string | undefined>;
readonly combobox: _angular_core.InputSignal<Combobox>;
readonly controlTarget: _angular_core.Signal<HTMLElement | undefined>;
// (undocumented)
close(): void;
readonly combobox: Combobox<any>;
readonly element: HTMLDialogElement;
readonly id: _angular_core.InputSignal<string>;
ngOnDestroy(): void;
// (undocumented)
readonly _pattern: ComboboxDialogPattern;
ngOnInit(): void;
readonly _pattern: ComboboxPopupPattern;
readonly popupId: _angular_core.Signal<string | undefined>;
readonly popupType: _angular_core.InputSignal<"listbox" | "tree" | "grid" | "dialog">;
_registerWidget(widget: ComboboxWidget): void;
_unregisterWidget(): void;
readonly _widget: _angular_core.WritableSignal<ComboboxWidget | undefined>;
// (undocumented)
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ComboboxDialog, "dialog[ngComboboxDialog]", ["ngComboboxDialog"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof ComboboxPopup; inputs: {}; outputs: {}; }]>;
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ComboboxPopup, "ng-template[ngComboboxPopup]", ["ngComboboxPopup"], { "combobox": { "alias": "combobox"; "required": true; "isSignal": true; }; "popupType": { "alias": "popupType"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.DeferredContent; inputs: {}; outputs: {}; }]>;
// (undocumented)
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ComboboxDialog, never>;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ComboboxPopup, never>;
}

// @public
export class ComboboxInput {
export class ComboboxWidget implements OnInit, OnDestroy {
constructor();
readonly combobox: Combobox<any>;
readonly activeDescendant: _angular_core.InputSignal<string | undefined>;
readonly element: HTMLElement;
readonly value: _angular_core.ModelSignal<string>;
// (undocumented)
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ComboboxInput, "input[ngComboboxInput]", ["ngComboboxInput"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
// (undocumented)
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ComboboxInput, never>;
}

// @public
export class ComboboxPopup<V> {
readonly combobox: Combobox<V> | null;
readonly _controls: _angular_core.WritableSignal<ComboboxListboxControls<any, V> | ComboboxTreeControls<any, V> | ComboboxDialogPattern | undefined>;
// (undocumented)
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ComboboxPopup<any>, "[ngComboboxPopup]", ["ngComboboxPopup"], {}, {}, never, never, true, never>;
ngOnDestroy(): void;
// (undocumented)
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ComboboxPopup<any>, never>;
}

// @public
export class ComboboxPopupContainer {
ngOnInit(): void;
onFocusin(): void;
onFocusout(event: FocusEvent): void;
readonly popupId: _angular_core.WritableSignal<string | undefined>;
// (undocumented)
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ComboboxPopupContainer, "ng-template[ngComboboxPopupContainer]", ["ngComboboxPopupContainer"], {}, {}, never, never, true, [{ directive: typeof DeferredContent; inputs: {}; outputs: {}; }]>;
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ComboboxWidget, "[ngComboboxWidget]", ["ngComboboxWidget"], { "activeDescendant": { "alias": "activeDescendant"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
// (undocumented)
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ComboboxPopupContainer, never>;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ComboboxWidget, never>;
}

// (No @packageDocumentation comment for this package)
Expand Down
2 changes: 1 addition & 1 deletion goldens/aria/listbox/index.api.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ export class Listbox<V> implements OnDestroy {
readonly value: _angular_core.ModelSignal<V[]>;
readonly wrap: _angular_core.InputSignalWithTransform<boolean, unknown>;
// (undocumented)
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Listbox<any>, "[ngListbox]", ["ngListbox"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "multi": { "alias": "multi"; "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; }; "typeaheadDelay": { "alias": "typeaheadDelay"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, [{ directive: typeof ComboboxPopup; inputs: {}; outputs: {}; }]>;
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Listbox<any>, "[ngListbox]", ["ngListbox"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "multi": { "alias": "multi"; "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; }; "typeaheadDelay": { "alias": "typeaheadDelay"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
// (undocumented)
static ɵfac: _angular_core.ɵɵFactoryDeclaration<Listbox<any>, never>;
}
Expand Down
Loading
Loading