@angular/aria 22.0.0-next.5 → 22.0.0-next.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (56) hide show
  1. package/fesm2022/_combobox-chunk.mjs +51 -2
  2. package/fesm2022/_combobox-chunk.mjs.map +1 -1
  3. package/fesm2022/_combobox-listbox-chunk.mjs +3 -0
  4. package/fesm2022/_combobox-listbox-chunk.mjs.map +1 -1
  5. package/fesm2022/_combobox-tree-chunk.mjs.map +1 -1
  6. package/fesm2022/_deferred-content-chunk.mjs +16 -14
  7. package/fesm2022/_deferred-content-chunk.mjs.map +1 -1
  8. package/fesm2022/_list-navigation-chunk.mjs +3 -1
  9. package/fesm2022/_list-navigation-chunk.mjs.map +1 -1
  10. package/fesm2022/_signal-like-chunk.mjs +0 -1
  11. package/fesm2022/_signal-like-chunk.mjs.map +1 -1
  12. package/fesm2022/_tabs-chunk.mjs +22 -47
  13. package/fesm2022/_tabs-chunk.mjs.map +1 -1
  14. package/fesm2022/_widget-chunk.mjs +55 -13
  15. package/fesm2022/_widget-chunk.mjs.map +1 -1
  16. package/fesm2022/accordion.mjs +16 -14
  17. package/fesm2022/accordion.mjs.map +1 -1
  18. package/fesm2022/aria.mjs +1 -1
  19. package/fesm2022/aria.mjs.map +1 -1
  20. package/fesm2022/combobox.mjs +59 -34
  21. package/fesm2022/combobox.mjs.map +1 -1
  22. package/fesm2022/grid-testing.mjs +72 -0
  23. package/fesm2022/grid-testing.mjs.map +1 -0
  24. package/fesm2022/grid.mjs +83 -37
  25. package/fesm2022/grid.mjs.map +1 -1
  26. package/fesm2022/listbox.mjs +58 -31
  27. package/fesm2022/listbox.mjs.map +1 -1
  28. package/fesm2022/menu.mjs +41 -35
  29. package/fesm2022/menu.mjs.map +1 -1
  30. package/fesm2022/private.mjs +156 -5
  31. package/fesm2022/private.mjs.map +1 -1
  32. package/fesm2022/simple-combobox.mjs +443 -0
  33. package/fesm2022/simple-combobox.mjs.map +1 -0
  34. package/fesm2022/tabs.mjs +243 -218
  35. package/fesm2022/tabs.mjs.map +1 -1
  36. package/fesm2022/toolbar.mjs +11 -11
  37. package/fesm2022/toolbar.mjs.map +1 -1
  38. package/fesm2022/tree.mjs +65 -33
  39. package/fesm2022/tree.mjs.map +1 -1
  40. package/package.json +10 -2
  41. package/types/_combobox-chunk.d.ts +32 -2
  42. package/types/_grid-chunk.d.ts +16 -8
  43. package/types/_tabs-chunk.d.ts +7 -42
  44. package/types/combobox.d.ts +4 -3
  45. package/types/grid-testing.d.ts +79 -0
  46. package/types/grid.d.ts +14 -6
  47. package/types/listbox.d.ts +8 -6
  48. package/types/menu.d.ts +7 -4
  49. package/types/private.d.ts +106 -10
  50. package/types/simple-combobox.d.ts +124 -0
  51. package/types/tabs.d.ts +79 -74
  52. package/types/tree.d.ts +5 -2
  53. package/fesm2022/_pointer-event-manager-chunk.mjs +0 -54
  54. package/fesm2022/_pointer-event-manager-chunk.mjs.map +0 -1
  55. package/resources/code-examples.db +0 -0
  56. package/types/_pointer-event-manager-chunk.d.ts +0 -34
@@ -1,5 +1,6 @@
1
1
  import * as _angular_cdk_bidi from '@angular/cdk/bidi';
2
2
  import * as _angular_core from '@angular/core';
3
+ import { Signal } from '@angular/core';
3
4
  import { OptionPattern, ListboxPattern } from './_listbox-chunk.js';
4
5
  import { ComboboxPopup } from './combobox.js';
5
6
  export { Combobox as ɵɵCombobox, ComboboxDialog as ɵɵComboboxDialog, ComboboxInput as ɵɵComboboxInput, ComboboxPopupContainer as ɵɵComboboxPopupContainer } from './combobox.js';
@@ -9,7 +10,6 @@ import './_list-navigation-chunk.js';
9
10
  import './_keyboard-event-manager-chunk.js';
10
11
  import './_click-event-manager-chunk.js';
11
12
  import './_combobox-chunk.js';
12
- import './_pointer-event-manager-chunk.js';
13
13
  import './_deferred-content-chunk.js';
14
14
 
15
15
  /**
@@ -48,9 +48,9 @@ declare class Listbox<V> {
48
48
  /** The Options nested inside of the Listbox. */
49
49
  private readonly _options;
50
50
  /** A signal wrapper for directionality. */
51
- protected readonly textDirection: _angular_core.Signal<_angular_cdk_bidi.Direction>;
51
+ protected readonly textDirection: Signal<_angular_cdk_bidi.Direction>;
52
52
  /** The Option UIPatterns of the child Options. */
53
- protected readonly items: _angular_core.Signal<OptionPattern<V>[]>;
53
+ protected readonly items: Signal<OptionPattern<V>[]>;
54
54
  /** Whether the list is vertically or horizontally oriented. */
55
55
  readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
56
56
  /** Whether multiple items in the list can be selected at once. */
@@ -80,16 +80,20 @@ declare class Listbox<V> {
80
80
  readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
81
81
  /** Whether the listbox is readonly. */
82
82
  readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
83
+ /** The tabindex of the listbox. */
84
+ readonly tabIndex: _angular_core.InputSignalWithTransform<number | undefined, string | number | undefined>;
83
85
  /** The values of the currently selected items. */
84
86
  readonly value: _angular_core.ModelSignal<V[]>;
85
87
  /** The Listbox UIPattern. */
86
88
  readonly _pattern: ListboxPattern<V>;
89
+ /** The ID of the active descendant in the listbox. */
90
+ readonly activeDescendant: Signal<string | undefined>;
87
91
  constructor();
88
92
  scrollActiveItemIntoView(options?: ScrollIntoViewOptions): void;
89
93
  /** Navigates to the first item in the listbox. */
90
94
  gotoFirst(): void;
91
95
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<Listbox<any>, never>;
92
- 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; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, ["_options"], never, true, [{ directive: typeof ComboboxPopup; inputs: {}; outputs: {}; }]>;
96
+ 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"; }, ["_options"], never, true, [{ directive: typeof ComboboxPopup; inputs: {}; outputs: {}; }]>;
93
97
  }
94
98
 
95
99
  /**
@@ -121,8 +125,6 @@ declare class Option<V> {
121
125
  private readonly _listbox;
122
126
  /** A unique identifier for the option. */
123
127
  readonly id: _angular_core.InputSignal<string>;
124
- /** The text used by the typeahead search. */
125
- protected readonly searchTerm: _angular_core.Signal<string>;
126
128
  /** The parent Listbox UIPattern. */
127
129
  private readonly _listboxPattern;
128
130
  /** The value of the option. */
package/types/menu.d.ts CHANGED
@@ -175,11 +175,14 @@ declare class Menu<V> {
175
175
  /** The menu ui pattern instance. */
176
176
  readonly _pattern: MenuPattern<V>;
177
177
  /**
178
- * The menu items as a writable signal.
178
+ * The menu item patterns for the menu items that are direct children of this menu, passed
179
+ * to the menu pattern.
179
180
  *
180
- * TODO(wagnermaciel): This would normally be a computed, but using a computed causes a bug where
181
- * sometimes the items array is empty. The bug can be reproduced by switching this to use a
182
- * computed and then quickly opening and closing menus in the dev app.
181
+ * Note: contentChildren has an issue where it will return a successively smaller list
182
+ * each time that the menu is open and closed, eventually resulting in an empty list.
183
+ * The workaround is to trigger a recomputation of this signal whenever the menu is opened
184
+ * or closed, by calling this._pattern.visible() in the signal body. Otherwise, computed could
185
+ * not be used and would have to rebuild the list each time this method is called.
183
186
  */
184
187
  private readonly _itemPatterns;
185
188
  /** Whether the menu is visible. */
@@ -2,25 +2,24 @@ import { ComboboxPattern, ComboboxListboxControls, ComboboxTreeControls } from '
2
2
  export { ComboboxDialogPattern, ComboboxInputs } from './_combobox-chunk.js';
3
3
  import { ListboxInputs, OptionPattern, ListboxPattern } from './_listbox-chunk.js';
4
4
  export { OptionInputs } from './_listbox-chunk.js';
5
- import { SignalLike } from './_signal-like-chunk.js';
6
- export { WritableSignalLike, computed, convertGetterSetterToWritableSignalLike, linkedSignal, signal } from './_signal-like-chunk.js';
5
+ import { SignalLike, WritableSignalLike } from './_signal-like-chunk.js';
6
+ export { computed, convertGetterSetterToWritableSignalLike, linkedSignal, signal } from './_signal-like-chunk.js';
7
7
  export { MenuBarInputs, MenuBarPattern, MenuInputs, MenuItemInputs, MenuItemPattern, MenuPattern, MenuTriggerInputs, MenuTriggerPattern } from './_menu-chunk.js';
8
8
  export { TabInputs, TabListInputs, TabListPattern, TabPanelInputs, TabPanelPattern, TabPattern } from './_tabs-chunk.js';
9
9
  export { ToolbarInputs, ToolbarPattern, ToolbarWidgetGroupInputs, ToolbarWidgetGroupPattern, ToolbarWidgetInputs, ToolbarWidgetPattern } from './_toolbar-chunk.js';
10
10
  export { AccordionGroupInputs, AccordionGroupPattern, AccordionTriggerInputs, AccordionTriggerPattern } from './_accordion-chunk.js';
11
11
  import { TreeInputs, TreeItemPattern, TreePattern } from './_tree-chunk.js';
12
12
  export { TreeItemInputs } from './_tree-chunk.js';
13
- export { GridCellInputs, GridCellPattern, GridCellWidgetInputs, GridCellWidgetPattern, GridInputs, GridPattern, GridRowInputs, GridRowPattern } from './_grid-chunk.js';
13
+ export { ElementResolver, GridCellInputs, GridCellPattern, GridCellWidgetInputs, GridCellWidgetPattern, GridInputs, GridPattern, GridRowInputs, GridRowPattern, resolveElement } from './_grid-chunk.js';
14
14
  export { DeferredContent, DeferredContentAware } from './_deferred-content-chunk.js';
15
15
  export { HasElement, sortDirectives } from './_element-chunk.js';
16
+ import * as _angular_core from '@angular/core';
17
+ import { KeyboardEventManager } from './_keyboard-event-manager-chunk.js';
18
+ import { ClickEventManager } from './_click-event-manager-chunk.js';
19
+ import { ExpansionItem } from './_expansion-chunk.js';
16
20
  export { untracked } from '@angular/core/primitives/signals';
17
- import './_keyboard-event-manager-chunk.js';
18
- import './_pointer-event-manager-chunk.js';
19
21
  import './_list-chunk.js';
20
22
  import './_list-navigation-chunk.js';
21
- import './_click-event-manager-chunk.js';
22
- import './_expansion-chunk.js';
23
- import '@angular/core';
24
23
 
25
24
  type ComboboxListboxInputs<V> = ListboxInputs<V> & {
26
25
  /** The combobox controlling the listbox. */
@@ -141,5 +140,102 @@ declare class ComboboxTreePattern<V> extends TreePattern<V> implements ComboboxT
141
140
  readonly isItemSelectable: (item?: TreeItemPattern<V> | undefined) => boolean;
142
141
  }
143
142
 
144
- export { ComboboxListboxControls, ComboboxListboxPattern, ComboboxPattern, ComboboxTreeControls, ComboboxTreePattern, ListboxInputs, ListboxPattern, OptionPattern, SignalLike, TreeInputs, TreeItemPattern, TreePattern };
145
- export type { ComboboxListboxInputs, ComboboxTreeInputs };
143
+ /** Represents the required inputs for a simple combobox. */
144
+ interface SimpleComboboxInputs extends ExpansionItem {
145
+ /** Whether the combobox should always remain expanded. */
146
+ alwaysExpanded: SignalLike<boolean>;
147
+ /** The value of the combobox. */
148
+ value: WritableSignalLike<string>;
149
+ /** The element that the combobox is attached to. */
150
+ element: SignalLike<HTMLElement>;
151
+ /** The popup associated with the combobox. */
152
+ popup: SignalLike<SimpleComboboxPopupPattern | undefined>;
153
+ /** An inline suggestion to be displayed in the input. */
154
+ inlineSuggestion: SignalLike<string | undefined>;
155
+ /** Whether the combobox is disabled. */
156
+ disabled: SignalLike<boolean>;
157
+ }
158
+ /** Controls the state of a simple combobox. */
159
+ declare class SimpleComboboxPattern {
160
+ readonly inputs: SimpleComboboxInputs;
161
+ /** The expanded state of the combobox. */
162
+ readonly isExpanded: _angular_core.Signal<boolean>;
163
+ /** The value of the combobox. */
164
+ readonly value: WritableSignalLike<string>;
165
+ /** The element that the combobox is attached to. */
166
+ readonly element: () => HTMLElement;
167
+ /** Whether the combobox is disabled. */
168
+ readonly disabled: () => boolean;
169
+ /** An inline suggestion to be displayed in the input. */
170
+ readonly inlineSuggestion: () => string | undefined;
171
+ /** The ID of the active descendant in the popup. */
172
+ readonly activeDescendant: _angular_core.Signal<string | undefined>;
173
+ /** The ID of the popup. */
174
+ readonly popupId: _angular_core.Signal<string | undefined>;
175
+ /** The type of the popup. */
176
+ readonly popupType: _angular_core.Signal<"listbox" | "tree" | "grid" | "dialog" | undefined>;
177
+ /** The autocomplete behavior of the combobox. */
178
+ readonly autocomplete: _angular_core.Signal<"none" | "inline" | "list" | "both">;
179
+ /** A relay for keyboard events to the popup. */
180
+ readonly keyboardEventRelay: _angular_core.WritableSignal<KeyboardEvent | undefined>;
181
+ /** Whether the combobox is focused. */
182
+ readonly isFocused: _angular_core.WritableSignal<boolean>;
183
+ /** Whether the most recent input event was a deletion. */
184
+ readonly isDeleting: _angular_core.WritableSignal<boolean>;
185
+ /** Whether the combobox is editable (i.e., an input or textarea). */
186
+ readonly isEditable: _angular_core.Signal<boolean>;
187
+ /** The keydown event manager for the combobox. */
188
+ keydown: _angular_core.Signal<KeyboardEventManager<KeyboardEvent>>;
189
+ /** The click event manager for the combobox. */
190
+ click: _angular_core.Signal<ClickEventManager<PointerEvent>>;
191
+ constructor(inputs: SimpleComboboxInputs);
192
+ /** Handles keydown events for the combobox. */
193
+ onKeydown(event: KeyboardEvent): void;
194
+ /** Handles click events for the combobox. */
195
+ onClick(event: PointerEvent): void;
196
+ /** Handles focus in events for the combobox. */
197
+ onFocusin(): void;
198
+ /** Handles focus out events for the combobox. */
199
+ onFocusout(event: FocusEvent): void;
200
+ /** Handles input events for the combobox. */
201
+ onInput(event: Event): void;
202
+ /** Highlights the currently selected item in the combobox. */
203
+ highlightEffect(): void;
204
+ /** Relays keyboard events to the popup. */
205
+ keyboardEventRelayEffect(): void;
206
+ /** Closes the popup when focus leaves the combobox and popup. */
207
+ closePopupOnBlurEffect(): void;
208
+ }
209
+ /** Represents the required inputs for a simple combobox popup. */
210
+ interface SimpleComboboxPopupInputs {
211
+ /** The type of the popup. */
212
+ popupType: SignalLike<'listbox' | 'tree' | 'grid' | 'dialog'>;
213
+ /** The element that serves as the control target for the popup. */
214
+ controlTarget: SignalLike<HTMLElement | undefined>;
215
+ /** The ID of the active descendant in the popup. */
216
+ activeDescendant: SignalLike<string | undefined>;
217
+ /** The ID of the popup. */
218
+ popupId: SignalLike<string | undefined>;
219
+ }
220
+ /** Controls the state of a simple combobox popup. */
221
+ declare class SimpleComboboxPopupPattern {
222
+ readonly inputs: SimpleComboboxPopupInputs;
223
+ /** The type of the popup. */
224
+ readonly popupType: () => "listbox" | "tree" | "grid" | "dialog";
225
+ /** The element that serves as the control target for the popup. */
226
+ readonly controlTarget: () => HTMLElement | undefined;
227
+ /** The ID of the active descendant in the popup. */
228
+ readonly activeDescendant: () => string | undefined;
229
+ /** The ID of the popup. */
230
+ readonly popupId: () => string | undefined;
231
+ /** Whether the popup is focused. */
232
+ readonly isFocused: _angular_core.WritableSignal<boolean>;
233
+ constructor(inputs: SimpleComboboxPopupInputs);
234
+ /** Handles focus in events for the popup. */
235
+ onFocusin(): void;
236
+ /** Handles focus out events for the popup. */
237
+ onFocusout(event: FocusEvent): void;
238
+ }
239
+
240
+ export { ComboboxListboxControls, ComboboxListboxPattern, ComboboxPattern, ComboboxTreeControls, ComboboxTreePattern, ListboxInputs, ListboxPattern, OptionPattern, SignalLike, SimpleComboboxPattern, SimpleComboboxPopupPattern, TreeInputs, TreeItemPattern, TreePattern, WritableSignalLike };
241
+ export type { ComboboxListboxInputs, ComboboxTreeInputs, SimpleComboboxInputs, SimpleComboboxPopupInputs };
@@ -0,0 +1,124 @@
1
+ import * as _angular_core from '@angular/core';
2
+ import { OnInit, OnDestroy } from '@angular/core';
3
+ import * as i1 from '@angular/aria/private';
4
+ import { SimpleComboboxPopupPattern, DeferredContentAware, SimpleComboboxPattern } from '@angular/aria/private';
5
+ export { DeferredContent as ɵɵDeferredContent, DeferredContentAware as ɵɵDeferredContentAware } from './_deferred-content-chunk.js';
6
+
7
+ /**
8
+ * Identifies an element as a widget within a combobox popup.
9
+ *
10
+ * This directive should be applied to the element that contains the options or content
11
+ * of the popup. It handles the communication of ID and active descendant information
12
+ * to the combobox.
13
+ */
14
+ declare class ComboboxWidget implements OnInit, OnDestroy {
15
+ /** The element that the popup widget is attached to. */
16
+ private readonly _elementRef;
17
+ private readonly _popup;
18
+ /** A reference to the popup widget element. */
19
+ readonly element: HTMLElement;
20
+ /** The ID of the popup widget. */
21
+ readonly popupId: _angular_core.WritableSignal<string | undefined>;
22
+ /** The ID of the active descendant in the widget. */
23
+ readonly activeDescendant: _angular_core.InputSignal<string | undefined>;
24
+ private _observer;
25
+ constructor();
26
+ ngOnInit(): void;
27
+ ngOnDestroy(): void;
28
+ /** Handles focus in events for the widget. */
29
+ onFocusin(): void;
30
+ /** Handles focus out events for the widget. */
31
+ onFocusout(event: FocusEvent): void;
32
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<ComboboxWidget, never>;
33
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ComboboxWidget, "[ngComboboxWidget]", ["ngComboboxWidget"], { "activeDescendant": { "alias": "activeDescendant"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
34
+ }
35
+
36
+ /**
37
+ * A structural directive that marks the `ng-template` to be used as the popup
38
+ * for a combobox. This content is conditionally rendered.
39
+ *
40
+ * The content of the popup can be any element with the `ngComboboxWidget` directive.
41
+ *
42
+ * ```html
43
+ * <ng-template ngComboboxPopup>
44
+ * <div ngComboboxWidget>
45
+ * <!-- ... options ... -->
46
+ * </div>
47
+ * </ng-template>
48
+ * ```
49
+ */
50
+ declare class ComboboxPopup implements OnInit, OnDestroy {
51
+ private readonly _deferredContent;
52
+ /** The combobox that the popup belongs to. */
53
+ readonly combobox: _angular_core.InputSignal<Combobox>;
54
+ /** The widget contained within the popup. */
55
+ readonly _widget: _angular_core.WritableSignal<ComboboxWidget | undefined>;
56
+ /** The element that serves as the control target for the popup. */
57
+ readonly controlTarget: _angular_core.Signal<HTMLElement | undefined>;
58
+ /** The ID of the popup. */
59
+ readonly popupId: _angular_core.Signal<string | undefined>;
60
+ /** The ID of the active descendant in the popup. */
61
+ readonly activeDescendant: _angular_core.Signal<string | undefined>;
62
+ /** The type of the popup (e.g., listbox, tree, grid, dialog). */
63
+ readonly popupType: _angular_core.InputSignal<"listbox" | "tree" | "grid" | "dialog">;
64
+ /** The popup pattern. */
65
+ readonly _pattern: SimpleComboboxPopupPattern;
66
+ ngOnInit(): void;
67
+ ngOnDestroy(): void;
68
+ /** Registers a widget with the popup. */
69
+ _registerWidget(widget: ComboboxWidget): void;
70
+ /** Unregisters the widget from the popup. */
71
+ _unregisterWidget(): void;
72
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<ComboboxPopup, never>;
73
+ 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: {}; }]>;
74
+ }
75
+
76
+ /**
77
+ * The container element that wraps a combobox input and popup, and orchestrates its behavior.
78
+ *
79
+ * The `ngCombobox` directive is the main entry point for creating a combobox and customizing its
80
+ * behavior. It coordinates the interactions between the input and the popup.
81
+ *
82
+ * ```html
83
+ * <div ngCombobox [(expanded)]="expanded">
84
+ * <input ngComboboxInput />
85
+ *
86
+ * <ng-template ngComboboxPopup>
87
+ * <div ngComboboxWidget>
88
+ * <!-- ... options ... -->
89
+ * </div>
90
+ * </ng-template>
91
+ * </div>
92
+ * ```
93
+ */
94
+ declare class Combobox extends DeferredContentAware implements OnInit {
95
+ private readonly _renderer;
96
+ /** The element that the combobox is attached to. */
97
+ private readonly _elementRef;
98
+ /** A reference to the input element. */
99
+ readonly element: HTMLElement;
100
+ /** The popup associated with the combobox. */
101
+ readonly _popup: _angular_core.WritableSignal<ComboboxPopup | undefined>;
102
+ /** Whether the combobox is disabled. */
103
+ readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
104
+ /** Whether the combobox should always remain expanded. */
105
+ readonly alwaysExpanded: _angular_core.InputSignalWithTransform<boolean, unknown>;
106
+ /** Whether the combobox is expanded. */
107
+ readonly expanded: _angular_core.ModelSignal<boolean>;
108
+ /** The value of the combobox input. */
109
+ readonly value: _angular_core.ModelSignal<string>;
110
+ /** An inline suggestion to be displayed in the input. */
111
+ readonly inlineSuggestion: _angular_core.InputSignal<string | undefined>;
112
+ /** The combobox ui pattern. */
113
+ readonly _pattern: SimpleComboboxPattern;
114
+ constructor();
115
+ ngOnInit(): void;
116
+ /** Registers a popup with the combobox. */
117
+ _registerPopup(popup: ComboboxPopup): void;
118
+ /** Unregisters the popup from the combobox. */
119
+ _unregisterPopup(): void;
120
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<Combobox, never>;
121
+ 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>;
122
+ }
123
+
124
+ export { Combobox, ComboboxPopup, ComboboxWidget };
package/types/tabs.d.ts CHANGED
@@ -1,15 +1,60 @@
1
- import * as _angular_core from '@angular/core';
2
- import { OnInit, OnDestroy } from '@angular/core';
3
1
  import * as _angular_cdk_bidi from '@angular/cdk/bidi';
4
- import { TabPattern, TabListPattern, TabPanelPattern } from './_tabs-chunk.js';
5
- import { HasElement } from './_element-chunk.js';
2
+ import * as _angular_core from '@angular/core';
3
+ import { OnInit, OnDestroy, WritableSignal } from '@angular/core';
4
+ import { TabPattern, TabPanelPattern, TabListPattern } from './_tabs-chunk.js';
6
5
  import { DeferredContentAware, DeferredContent } from './_deferred-content-chunk.js';
6
+ import { HasElement } from './_element-chunk.js';
7
7
  import './_keyboard-event-manager-chunk.js';
8
8
  import './_signal-like-chunk.js';
9
9
  import './_click-event-manager-chunk.js';
10
10
  import './_expansion-chunk.js';
11
11
  import './_list-navigation-chunk.js';
12
12
 
13
+ /**
14
+ * A TabPanel container for the resources of layered content associated with a tab.
15
+ *
16
+ * The `ngTabPanel` directive holds the content for a specific tab. It is linked to an
17
+ * `ngTab` by a matching `value`. If a tab panel is hidden, the `inert` attribute will be
18
+ * applied to remove it from the accessibility tree. Proper styling is required for visual hiding.
19
+ *
20
+ * ```html
21
+ * <div ngTabPanel value="myTabId">
22
+ * <ng-template ngTabContent>
23
+ * <!-- Content for the tab panel -->
24
+ * </ng-template>
25
+ * </div>
26
+ * ```
27
+ *
28
+ * @developerPreview 21.0
29
+ *
30
+ * @see [Tabs](guide/aria/tabs)
31
+ */
32
+ declare class TabPanel implements OnInit, OnDestroy {
33
+ /** A reference to the host element. */
34
+ private readonly _elementRef;
35
+ /** A reference to the host element. */
36
+ readonly element: HTMLElement;
37
+ /** The DeferredContentAware host directive. */
38
+ private readonly _deferredContentAware;
39
+ /** The parent Tabs. */
40
+ private readonly _tabs;
41
+ /** A global unique identifier for the tab. */
42
+ readonly id: _angular_core.InputSignal<string>;
43
+ /** The Tab UIPattern associated with the tabpanel */
44
+ readonly _tabPattern: WritableSignal<TabPattern | undefined>;
45
+ /** A local unique identifier for the tabpanel. */
46
+ readonly value: _angular_core.InputSignal<string>;
47
+ /** Whether the tab panel is visible. */
48
+ readonly visible: _angular_core.Signal<boolean>;
49
+ /** The TabPanel UIPattern. */
50
+ readonly _pattern: TabPanelPattern;
51
+ constructor();
52
+ ngOnInit(): void;
53
+ ngOnDestroy(): void;
54
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabPanel, never>;
55
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TabPanel, "[ngTabPanel]", ["ngTabPanel"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof DeferredContentAware; inputs: { "preserveContent": "preserveContent"; }; outputs: {}; }]>;
56
+ }
57
+
13
58
  /**
14
59
  * A selectable tab in a TabList.
15
60
  *
@@ -31,16 +76,14 @@ declare class Tab implements HasElement, OnInit, OnDestroy {
31
76
  private readonly _elementRef;
32
77
  /** A reference to the host element. */
33
78
  readonly element: HTMLElement;
34
- /** The parent Tabs. */
35
- private readonly _tabs;
79
+ /** The parent Tabs wrapper. */
80
+ private readonly _tabsWrapper;
36
81
  /** The parent TabList. */
37
82
  private readonly _tabList;
38
83
  /** A unique identifier for the widget. */
39
84
  readonly id: _angular_core.InputSignal<string>;
40
- /** The parent TabList UIPattern. */
41
- private readonly _tablistPattern;
42
- /** The TabPanel UIPattern associated with the tab */
43
- private readonly _tabpanelPattern;
85
+ /** The panel associated with this tab. */
86
+ readonly panel: _angular_core.Signal<TabPanel | undefined>;
44
87
  /** Whether a tab is disabled. */
45
88
  readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
46
89
  /** The remote tabpanel unique identifier. */
@@ -82,16 +125,18 @@ declare class TabList implements OnInit, OnDestroy {
82
125
  private readonly _elementRef;
83
126
  /** A reference to the host element. */
84
127
  readonly element: HTMLElement;
85
- /** The parent Tabs. */
128
+ /** The parent Tabs container. */
129
+ private readonly _tabsParent;
130
+ /** The Tabs registered for this TabList. */
86
131
  private readonly _tabs;
87
- /** The Tabs nested inside of the TabList. */
88
- private readonly _unorderedTabs;
89
- /** Text direction. */
90
- readonly textDirection: _angular_core.WritableSignal<_angular_cdk_bidi.Direction>;
132
+ /** The Tabs registered for this TabList. */
133
+ readonly _sortedTabs: _angular_core.Signal<Tab[]>;
91
134
  /** The Tab UIPatterns of the child Tabs. */
92
- readonly _tabPatterns: _angular_core.Signal<TabPattern[]>;
135
+ private readonly _tabPatterns;
93
136
  /** Whether the tablist is vertically or horizontally oriented. */
94
137
  readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
138
+ /** Text direction. */
139
+ readonly textDirection: WritableSignal<_angular_cdk_bidi.Direction>;
95
140
  /** Whether focus should wrap when navigating. */
96
141
  readonly wrap: _angular_core.InputSignalWithTransform<boolean, unknown>;
97
142
  /**
@@ -111,8 +156,10 @@ declare class TabList implements OnInit, OnDestroy {
111
156
  * - `explicit`: Tabs are selected explicitly by the user (e.g., via click or spacebar).
112
157
  */
113
158
  readonly selectionMode: _angular_core.InputSignal<"follow" | "explicit">;
114
- /** The current selected tab. */
159
+ /** The current selected tab as a model input. */
115
160
  readonly selectedTab: _angular_core.ModelSignal<string | undefined>;
161
+ /** The current selected Tab pattern, passed to the List pattern. */
162
+ private readonly _selectedTabPattern;
116
163
  /** Whether the tablist is disabled. */
117
164
  readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
118
165
  /** The TabList UIPattern. */
@@ -120,59 +167,15 @@ declare class TabList implements OnInit, OnDestroy {
120
167
  constructor();
121
168
  ngOnInit(): void;
122
169
  ngOnDestroy(): void;
123
- _register(child: Tab): void;
124
- _unregister(child: Tab): void;
170
+ _registerTab(child: Tab): void;
171
+ _unregisterTab(child: Tab): void;
125
172
  /** Opens the tab panel with the specified value. */
126
173
  open(value: string): boolean;
174
+ findTab(value?: string): Tab | undefined;
127
175
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabList, never>;
128
176
  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>;
129
177
  }
130
178
 
131
- /**
132
- * A TabPanel container for the resources of layered content associated with a tab.
133
- *
134
- * The `ngTabPanel` directive holds the content for a specific tab. It is linked to an
135
- * `ngTab` by a matching `value`. If a tab panel is hidden, the `inert` attribute will be
136
- * applied to remove it from the accessibility tree. Proper styling is required for visual hiding.
137
- *
138
- * ```html
139
- * <div ngTabPanel value="myTabId">
140
- * <ng-template ngTabContent>
141
- * <!-- Content for the tab panel -->
142
- * </ng-template>
143
- * </div>
144
- * ```
145
- *
146
- * @developerPreview 21.0
147
- *
148
- * @see [Tabs](guide/aria/tabs)
149
- */
150
- declare class TabPanel implements OnInit, OnDestroy {
151
- /** A reference to the host element. */
152
- private readonly _elementRef;
153
- /** A reference to the host element. */
154
- readonly element: HTMLElement;
155
- /** The DeferredContentAware host directive. */
156
- private readonly _deferredContentAware;
157
- /** The parent Tabs. */
158
- private readonly _tabs;
159
- /** A global unique identifier for the tab. */
160
- readonly id: _angular_core.InputSignal<string>;
161
- /** The Tab UIPattern associated with the tabpanel */
162
- private readonly _tabPattern;
163
- /** A local unique identifier for the tabpanel. */
164
- readonly value: _angular_core.InputSignal<string>;
165
- /** Whether the tab panel is visible. */
166
- readonly visible: _angular_core.Signal<boolean>;
167
- /** The TabPanel UIPattern. */
168
- readonly _pattern: TabPanelPattern;
169
- constructor();
170
- ngOnInit(): void;
171
- ngOnDestroy(): void;
172
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabPanel, never>;
173
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TabPanel, "[ngTabPanel]", ["ngTabPanel"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof DeferredContentAware; inputs: { "preserveContent": "preserveContent"; }; outputs: {}; }]>;
174
- }
175
-
176
179
  /**
177
180
  * A Tabs container.
178
181
  *
@@ -209,16 +212,18 @@ declare class Tabs {
209
212
  private readonly _elementRef;
210
213
  /** A reference to the host element. */
211
214
  readonly element: HTMLElement;
212
- /** The TabList nested inside of the container. */
213
- private readonly _tablist;
214
- /** The TabPanels nested inside of the container. */
215
- private readonly _unorderedPanels;
216
- /** The Tab UIPattern of the child Tabs. */
217
- readonly _tabPatterns: _angular_core.Signal<TabPattern[] | undefined>;
218
- /** The TabPanel UIPattern of the child TabPanels. */
219
- readonly _unorderedTabpanelPatterns: _angular_core.Signal<TabPanelPattern[]>;
220
- _register(child: TabList | TabPanel): void;
221
- _unregister(child: TabList | TabPanel): void;
215
+ /** The TabList registered for this container. */
216
+ private readonly _tabList;
217
+ /** The TabPanels registered for this container. */
218
+ private readonly _tabPanels;
219
+ /** The TabPanels registered for this container. */
220
+ private readonly _tabPanelsList;
221
+ constructor();
222
+ _registerList(list: TabList): void;
223
+ _unregisterList(list: TabList): void;
224
+ _registerPanel(panel: TabPanel): void;
225
+ _unregisterPanel(panel: TabPanel): void;
226
+ findTabPanel(value?: string): TabPanel | undefined;
222
227
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tabs, never>;
223
228
  static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Tabs, "[ngTabs]", ["ngTabs"], {}, {}, never, never, true, never>;
224
229
  }
package/types/tree.d.ts CHANGED
@@ -13,7 +13,6 @@ import './_list-chunk.js';
13
13
  import './_keyboard-event-manager-chunk.js';
14
14
  import './_click-event-manager-chunk.js';
15
15
  import './_combobox-chunk.js';
16
- import './_pointer-event-manager-chunk.js';
17
16
 
18
17
  /**
19
18
  * Group that contains children tree items.
@@ -193,6 +192,8 @@ declare class Tree<V> {
193
192
  readonly softDisabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
194
193
  /** The delay in seconds before the typeahead search is reset. */
195
194
  readonly typeaheadDelay: _angular_core.InputSignal<number>;
195
+ /** The tabindex of the tree. */
196
+ readonly tabIndex: _angular_core.InputSignalWithTransform<number | undefined, string | number | undefined>;
196
197
  /** The values of the currently selected items. */
197
198
  readonly value: _angular_core.ModelSignal<V[]>;
198
199
  /** Text direction. */
@@ -206,12 +207,14 @@ declare class Tree<V> {
206
207
  readonly currentType: _angular_core.InputSignal<"page" | "step" | "location" | "date" | "time" | "true" | "false">;
207
208
  /** The UI pattern for the tree. */
208
209
  readonly _pattern: TreePattern<V>;
210
+ /** The ID of the active descendant in the tree. */
211
+ readonly activeDescendant: Signal<string | undefined>;
209
212
  constructor();
210
213
  _register(child: TreeItem<V>): void;
211
214
  _unregister(child: TreeItem<V>): void;
212
215
  scrollActiveItemIntoView(options?: ScrollIntoViewOptions): void;
213
216
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tree<any>, never>;
214
- 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: {}; }]>;
217
+ 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, [{ directive: typeof ComboboxPopup; inputs: {}; outputs: {}; }]>;
215
218
  }
216
219
 
217
220
  export { Tree, TreeItem, TreeItemGroup, ComboboxPopup as ɵɵComboboxPopup, DeferredContent as ɵɵDeferredContent };