@angular/aria 21.0.3 → 21.1.0-next.1

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/_adev_assets/aria-accordion.json +743 -0
  2. package/_adev_assets/aria-combobox.json +603 -0
  3. package/_adev_assets/aria-grid.json +893 -0
  4. package/_adev_assets/aria-listbox.json +540 -0
  5. package/_adev_assets/aria-menu.json +1049 -0
  6. package/_adev_assets/aria-tabs.json +880 -0
  7. package/_adev_assets/aria-toolbar.json +545 -0
  8. package/_adev_assets/aria-tree.json +853 -0
  9. package/fesm2022/_widget-chunk.mjs +246 -4
  10. package/fesm2022/_widget-chunk.mjs.map +1 -1
  11. package/fesm2022/accordion.mjs +4 -17
  12. package/fesm2022/accordion.mjs.map +1 -1
  13. package/fesm2022/aria.mjs +1 -1
  14. package/fesm2022/aria.mjs.map +1 -1
  15. package/fesm2022/combobox.mjs +120 -96
  16. package/fesm2022/combobox.mjs.map +1 -1
  17. package/fesm2022/grid.mjs +201 -225
  18. package/fesm2022/grid.mjs.map +1 -1
  19. package/fesm2022/listbox.mjs +161 -173
  20. package/fesm2022/listbox.mjs.map +1 -1
  21. package/fesm2022/menu.mjs +238 -256
  22. package/fesm2022/menu.mjs.map +1 -1
  23. package/fesm2022/private.mjs +932 -7
  24. package/fesm2022/private.mjs.map +1 -1
  25. package/fesm2022/tabs.mjs +168 -182
  26. package/fesm2022/tabs.mjs.map +1 -1
  27. package/fesm2022/toolbar.mjs +3 -15
  28. package/fesm2022/toolbar.mjs.map +1 -1
  29. package/fesm2022/tree.mjs +2 -4
  30. package/fesm2022/tree.mjs.map +1 -1
  31. package/package.json +3 -3
  32. package/types/_grid-chunk.d.ts +210 -3
  33. package/types/accordion.d.ts +49 -52
  34. package/types/combobox.d.ts +111 -25
  35. package/types/grid.d.ts +32 -37
  36. package/types/listbox.d.ts +5 -8
  37. package/types/menu.d.ts +113 -113
  38. package/types/private.d.ts +498 -10
  39. package/types/tabs.d.ts +84 -89
  40. package/types/toolbar.d.ts +66 -69
  41. package/types/tree.d.ts +103 -106
  42. package/fesm2022/_combobox-chunk.mjs +0 -425
  43. package/fesm2022/_combobox-chunk.mjs.map +0 -1
  44. package/fesm2022/_combobox-listbox-chunk.mjs +0 -522
  45. package/fesm2022/_combobox-listbox-chunk.mjs.map +0 -1
  46. package/fesm2022/_combobox-popup-chunk.mjs +0 -46
  47. package/fesm2022/_combobox-popup-chunk.mjs.map +0 -1
  48. package/fesm2022/_list-navigation-chunk.mjs +0 -116
  49. package/fesm2022/_list-navigation-chunk.mjs.map +0 -1
  50. package/fesm2022/_pointer-event-manager-chunk.mjs +0 -134
  51. package/fesm2022/_pointer-event-manager-chunk.mjs.map +0 -1
  52. package/types/_combobox-chunk.d.ts +0 -98
  53. package/types/_combobox-chunk.d2.ts +0 -193
  54. package/types/_list-chunk.d.ts +0 -212
  55. package/types/_list-navigation-chunk.d.ts +0 -212
  56. package/types/_listbox-chunk.d.ts +0 -106
package/types/tabs.d.ts CHANGED
@@ -1,60 +1,59 @@
1
+ import * as _angular_cdk_bidi from '@angular/cdk/bidi';
1
2
  import * as _angular_core from '@angular/core';
2
3
  import { OnInit, OnDestroy } from '@angular/core';
3
4
  import * as i1 from '@angular/aria/private';
4
- import { TabPattern, TabListPattern, TabPanelPattern } from '@angular/aria/private';
5
- import * as _angular_cdk_bidi from '@angular/cdk/bidi';
5
+ import { TabPattern, TabPanelPattern, TabListPattern } from '@angular/aria/private';
6
6
 
7
7
  interface HasElement {
8
8
  element: HTMLElement;
9
9
  }
10
-
11
10
  /**
12
- * A selectable tab in a TabList.
11
+ * A Tabs container.
13
12
  *
14
- * The `ngTab` directive represents an individual tab control within an `ngTabList`. It
15
- * requires a `value` that uniquely identifies it and links it to a corresponding `ngTabPanel`.
13
+ * The `ngTabs` directive represents a set of layered sections of content. It acts as the
14
+ * overarching container for a tabbed interface, coordinating the behavior of `ngTabList`,
15
+ * `ngTab`, and `ngTabPanel` directives.
16
16
  *
17
17
  * ```html
18
- * <li ngTab value="myTabId" [disabled]="isTabDisabled">
19
- * My Tab Label
20
- * </li>
18
+ * <div ngTabs>
19
+ * <ul ngTabList [(selectedTab)]="selectedTabValue">
20
+ * <li ngTab value="tab1">Tab 1</li>
21
+ * <li ngTab value="tab2">Tab 2</li>
22
+ * <li ngTab value="tab3">Tab 3</li>
23
+ * </ul>
24
+ *
25
+ * <div ngTabPanel value="tab1">
26
+ * <ng-template ngTabContent>Content for Tab 1</ng-template>
27
+ * </div>
28
+ * <div ngTabPanel value="tab2">
29
+ * <ng-template ngTabContent>Content for Tab 2</ng-template>
30
+ * </div>
31
+ * <div ngTabPanel value="tab3">
32
+ * <ng-template ngTabContent>Content for Tab 3</ng-template>
33
+ * </div>
34
+ * </div>
21
35
  * ```
22
36
  *
23
37
  * @developerPreview 21.0
24
38
  */
25
- declare class Tab implements HasElement, OnInit, OnDestroy {
39
+ declare class Tabs {
26
40
  /** A reference to the host element. */
27
41
  private readonly _elementRef;
28
42
  /** A reference to the host element. */
29
43
  readonly element: HTMLElement;
30
- /** The parent Tabs. */
31
- private readonly _tabs;
32
- /** The parent TabList. */
33
- private readonly _tabList;
34
- /** A unique identifier for the widget. */
35
- readonly id: _angular_core.InputSignal<string>;
36
- /** The parent TabList UIPattern. */
37
- private readonly _tablistPattern;
38
- /** The TabPanel UIPattern associated with the tab */
39
- private readonly _tabpanelPattern;
40
- /** Whether a tab is disabled. */
41
- readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
42
- /** The remote tabpanel unique identifier. */
43
- readonly value: _angular_core.InputSignal<string>;
44
- /** Whether the tab is active. */
45
- readonly active: _angular_core.Signal<boolean>;
46
- /** Whether the tab is selected. */
47
- readonly selected: _angular_core.Signal<boolean>;
48
- /** The Tab UIPattern. */
49
- readonly _pattern: TabPattern;
50
- /** Opens this tab panel. */
51
- open(): void;
52
- ngOnInit(): void;
53
- ngOnDestroy(): void;
54
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tab, never>;
55
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Tab, "[ngTab]", ["ngTab"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
44
+ /** The TabList nested inside of the container. */
45
+ private readonly _tablist;
46
+ /** The TabPanels nested inside of the container. */
47
+ private readonly _unorderedPanels;
48
+ /** The Tab UIPattern of the child Tabs. */
49
+ readonly _tabPatterns: _angular_core.Signal<TabPattern[] | undefined>;
50
+ /** The TabPanel UIPattern of the child TabPanels. */
51
+ readonly _unorderedTabpanelPatterns: _angular_core.Signal<TabPanelPattern[]>;
52
+ _register(child: TabList | TabPanel): void;
53
+ _unregister(child: TabList | TabPanel): void;
54
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tabs, never>;
55
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Tabs, "[ngTabs]", ["ngTabs"], {}, {}, never, never, true, never>;
56
56
  }
57
-
58
57
  /**
59
58
  * A TabList container.
60
59
  *
@@ -83,7 +82,7 @@ declare class TabList implements OnInit, OnDestroy {
83
82
  /** Text direction. */
84
83
  readonly textDirection: _angular_core.WritableSignal<_angular_cdk_bidi.Direction>;
85
84
  /** The Tab UIPatterns of the child Tabs. */
86
- readonly _tabPatterns: _angular_core.Signal<i1.TabPattern[]>;
85
+ readonly _tabPatterns: _angular_core.Signal<TabPattern[]>;
87
86
  /** Whether the tablist is vertically or horizontally oriented. */
88
87
  readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
89
88
  /** Whether focus should wrap when navigating. */
@@ -124,7 +123,52 @@ declare class TabList implements OnInit, OnDestroy {
124
123
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabList, never>;
125
124
  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>;
126
125
  }
127
-
126
+ /**
127
+ * A selectable tab in a TabList.
128
+ *
129
+ * The `ngTab` directive represents an individual tab control within an `ngTabList`. It
130
+ * requires a `value` that uniquely identifies it and links it to a corresponding `ngTabPanel`.
131
+ *
132
+ * ```html
133
+ * <li ngTab value="myTabId" [disabled]="isTabDisabled">
134
+ * My Tab Label
135
+ * </li>
136
+ * ```
137
+ *
138
+ * @developerPreview 21.0
139
+ */
140
+ declare class Tab implements HasElement, OnInit, OnDestroy {
141
+ /** A reference to the host element. */
142
+ private readonly _elementRef;
143
+ /** A reference to the host element. */
144
+ readonly element: HTMLElement;
145
+ /** The parent Tabs. */
146
+ private readonly _tabs;
147
+ /** The parent TabList. */
148
+ private readonly _tabList;
149
+ /** A unique identifier for the widget. */
150
+ readonly id: _angular_core.InputSignal<string>;
151
+ /** The parent TabList UIPattern. */
152
+ private readonly _tablistPattern;
153
+ /** The TabPanel UIPattern associated with the tab */
154
+ private readonly _tabpanelPattern;
155
+ /** Whether a tab is disabled. */
156
+ readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
157
+ /** The remote tabpanel unique identifier. */
158
+ readonly value: _angular_core.InputSignal<string>;
159
+ /** Whether the tab is active. */
160
+ readonly active: _angular_core.Signal<boolean>;
161
+ /** Whether the tab is selected. */
162
+ readonly selected: _angular_core.Signal<boolean>;
163
+ /** The Tab UIPattern. */
164
+ readonly _pattern: TabPattern;
165
+ /** Opens this tab panel. */
166
+ open(): void;
167
+ ngOnInit(): void;
168
+ ngOnDestroy(): void;
169
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tab, never>;
170
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Tab, "[ngTab]", ["ngTab"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
171
+ }
128
172
  /**
129
173
  * A TabPanel container for the resources of layered content associated with a tab.
130
174
  *
@@ -150,7 +194,7 @@ declare class TabPanel implements OnInit, OnDestroy {
150
194
  /** The DeferredContentAware host directive. */
151
195
  private readonly _deferredContentAware;
152
196
  /** The parent Tabs. */
153
- private readonly _tabs;
197
+ private readonly _Tabs;
154
198
  /** A global unique identifier for the tab. */
155
199
  readonly id: _angular_core.InputSignal<string>;
156
200
  /** The Tab UIPattern associated with the tabpanel */
@@ -167,55 +211,6 @@ declare class TabPanel implements OnInit, OnDestroy {
167
211
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabPanel, never>;
168
212
  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 i1.DeferredContentAware; inputs: { "preserveContent": "preserveContent"; }; outputs: {}; }]>;
169
213
  }
170
-
171
- /**
172
- * A Tabs container.
173
- *
174
- * The `ngTabs` directive represents a set of layered sections of content. It acts as the
175
- * overarching container for a tabbed interface, coordinating the behavior of `ngTabList`,
176
- * `ngTab`, and `ngTabPanel` directives.
177
- *
178
- * ```html
179
- * <div ngTabs>
180
- * <ul ngTabList [(selectedTab)]="selectedTabValue">
181
- * <li ngTab value="tab1">Tab 1</li>
182
- * <li ngTab value="tab2">Tab 2</li>
183
- * <li ngTab value="tab3">Tab 3</li>
184
- * </ul>
185
- *
186
- * <div ngTabPanel value="tab1">
187
- * <ng-template ngTabContent>Content for Tab 1</ng-template>
188
- * </div>
189
- * <div ngTabPanel value="tab2">
190
- * <ng-template ngTabContent>Content for Tab 2</ng-template>
191
- * </div>
192
- * <div ngTabPanel value="tab3">
193
- * <ng-template ngTabContent>Content for Tab 3</ng-template>
194
- * </div>
195
- * </div>
196
- * ```
197
- *
198
- * @developerPreview 21.0
199
- */
200
- declare class Tabs {
201
- /** A reference to the host element. */
202
- private readonly _elementRef;
203
- /** A reference to the host element. */
204
- readonly element: HTMLElement;
205
- /** The TabList nested inside of the container. */
206
- private readonly _tablist;
207
- /** The TabPanels nested inside of the container. */
208
- private readonly _unorderedPanels;
209
- /** The Tab UIPattern of the child Tabs. */
210
- readonly _tabPatterns: _angular_core.Signal<i1.TabPattern[] | undefined>;
211
- /** The TabPanel UIPattern of the child TabPanels. */
212
- readonly _unorderedTabpanelPatterns: _angular_core.Signal<i1.TabPanelPattern[]>;
213
- _register(child: TabList | TabPanel): void;
214
- _unregister(child: TabList | TabPanel): void;
215
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tabs, never>;
216
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Tabs, "[ngTabs]", ["ngTabs"], {}, {}, never, never, true, never>;
217
- }
218
-
219
214
  /**
220
215
  * A TabContent container for the lazy-loaded content.
221
216
  *
@@ -1,38 +1,65 @@
1
- import * as i1 from '@angular/aria/private';
2
- import { ToolbarWidgetGroupPattern, ToolbarWidgetPattern, ToolbarPattern } from '@angular/aria/private';
3
1
  import * as _angular_core from '@angular/core';
4
2
  import { OnInit, OnDestroy } from '@angular/core';
5
3
  import * as _angular_cdk_bidi from '@angular/cdk/bidi';
4
+ import { ToolbarWidgetPattern, ToolbarPattern, ToolbarWidgetGroupPattern } from '@angular/aria/private';
6
5
 
7
6
  /**
8
- * A directive that groups toolbar widgets, used for more complex widgets like radio groups
9
- * that have their own internal navigation.
7
+ * A toolbar widget container for a group of interactive widgets, such as
8
+ * buttons or radio groups. It provides a single point of reference for keyboard navigation
9
+ * and focus management. It supports various orientations and disabled states.
10
+ *
11
+ * ```html
12
+ * <div ngToolbar orientation="horizontal" [wrap]="true">
13
+ * <button ngToolbarWidget value="save">Save</button>
14
+ * <button ngToolbarWidget value="print">Print</button>
15
+ *
16
+ * <div ngToolbarWidgetGroup [(value)]="selectedAlignment">
17
+ * <button ngToolbarWidget value="left">Left</button>
18
+ * <button ngToolbarWidget value="center">Center</button>
19
+ * <button ngToolbarWidget value="right">Right</button>
20
+ * </div>
21
+ * </div>
22
+ * ```
10
23
  *
11
24
  * @developerPreview 21.0
12
25
  */
13
- declare class ToolbarWidgetGroup<V> {
26
+ declare class Toolbar<V> {
14
27
  /** A reference to the host element. */
15
28
  private readonly _elementRef;
16
29
  /** A reference to the host element. */
17
30
  readonly element: HTMLElement;
18
- /** The parent Toolbar. */
19
- private readonly _toolbar;
20
- /** The list of child widgets within the group. */
31
+ /** The TabList nested inside of the container. */
21
32
  private readonly _widgets;
22
- /** The parent Toolbar UIPattern. */
23
- private readonly _toolbarPattern;
24
- /** Whether the widget group is disabled. */
33
+ /** Text direction. */
34
+ readonly textDirection: _angular_core.WritableSignal<_angular_cdk_bidi.Direction>;
35
+ /** Sorted UIPatterns of the child widgets */
36
+ readonly _itemPatterns: _angular_core.Signal<ToolbarWidgetPattern<V>[]>;
37
+ /** Whether the toolbar is vertically or horizontally oriented. */
38
+ readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
39
+ /**
40
+ * Whether to allow disabled items to receive focus. When `true`, disabled items are
41
+ * focusable but not interactive. When `false`, disabled items are skipped during navigation.
42
+ */
43
+ softDisabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
44
+ /** Whether the toolbar is disabled. */
25
45
  readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
26
- /** The list of toolbar items within the group. */
27
- private readonly _itemPatterns;
28
- /** Whether the group allows multiple widgets to be selected. */
29
- readonly multi: _angular_core.InputSignalWithTransform<boolean, unknown>;
30
- /** The ToolbarWidgetGroup UIPattern. */
31
- readonly _pattern: ToolbarWidgetGroupPattern<ToolbarWidgetPattern<V>, V>;
32
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<ToolbarWidgetGroup<any>, never>;
33
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ToolbarWidgetGroup<any>, "[ngToolbarWidgetGroup]", ["ngToolbarWidgetGroup"], { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "multi": { "alias": "multi"; "required": false; "isSignal": true; }; }, {}, ["_widgets"], never, true, never>;
46
+ /** Whether focus should wrap when navigating. */
47
+ readonly wrap: _angular_core.InputSignalWithTransform<boolean, unknown>;
48
+ /** The values of the selected widgets within the toolbar. */
49
+ readonly values: _angular_core.ModelSignal<V[]>;
50
+ /** The toolbar UIPattern. */
51
+ readonly _pattern: ToolbarPattern<V>;
52
+ /** Whether the toolbar has received focus yet. */
53
+ private _hasBeenFocused;
54
+ constructor();
55
+ _onFocus(): void;
56
+ _register(widget: ToolbarWidget<V>): void;
57
+ _unregister(widget: ToolbarWidget<V>): void;
58
+ /** Finds the toolbar item associated with a given element. */
59
+ private _getItem;
60
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<Toolbar<any>, never>;
61
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Toolbar<any>, "[ngToolbar]", ["ngToolbar"], { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "softDisabled": { "alias": "softDisabled"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "wrap": { "alias": "wrap"; "required": false; "isSignal": true; }; "values": { "alias": "values"; "required": false; "isSignal": true; }; }, { "values": "valuesChange"; }, never, never, true, never>;
34
62
  }
35
-
36
63
  /**
37
64
  * A widget within a toolbar.
38
65
  *
@@ -58,13 +85,13 @@ declare class ToolbarWidget<V> implements OnInit, OnDestroy {
58
85
  /** A unique identifier for the widget. */
59
86
  readonly id: _angular_core.InputSignal<string>;
60
87
  /** The parent Toolbar UIPattern. */
61
- readonly _toolbarPattern: _angular_core.Signal<i1.ToolbarPattern<V>>;
88
+ readonly _toolbarPattern: _angular_core.Signal<ToolbarPattern<any>>;
62
89
  /** Whether the widget is disabled. */
63
90
  readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
64
91
  /** Whether the widget is 'hard' disabled, which is different from `aria-disabled`. A hard disabled widget cannot receive focus. */
65
92
  readonly hardDisabled: _angular_core.Signal<boolean>;
66
93
  /** The optional ToolbarWidgetGroup this widget belongs to. */
67
- readonly _group: ToolbarWidgetGroup<V> | null;
94
+ readonly _group: ToolbarWidgetGroup<any> | null;
68
95
  /** The value associated with the widget. */
69
96
  readonly value: _angular_core.InputSignal<V>;
70
97
  /** Whether the widget is currently active (focused). */
@@ -79,63 +106,33 @@ declare class ToolbarWidget<V> implements OnInit, OnDestroy {
79
106
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<ToolbarWidget<any>, never>;
80
107
  static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ToolbarWidget<any>, "[ngToolbarWidget]", ["ngToolbarWidget"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
81
108
  }
82
-
83
109
  /**
84
- * A toolbar widget container for a group of interactive widgets, such as
85
- * buttons or radio groups. It provides a single point of reference for keyboard navigation
86
- * and focus management. It supports various orientations and disabled states.
87
- *
88
- * ```html
89
- * <div ngToolbar orientation="horizontal" [wrap]="true">
90
- * <button ngToolbarWidget value="save">Save</button>
91
- * <button ngToolbarWidget value="print">Print</button>
92
- *
93
- * <div ngToolbarWidgetGroup [(value)]="selectedAlignment">
94
- * <button ngToolbarWidget value="left">Left</button>
95
- * <button ngToolbarWidget value="center">Center</button>
96
- * <button ngToolbarWidget value="right">Right</button>
97
- * </div>
98
- * </div>
99
- * ```
110
+ * A directive that groups toolbar widgets, used for more complex widgets like radio groups
111
+ * that have their own internal navigation.
100
112
  *
101
113
  * @developerPreview 21.0
102
114
  */
103
- declare class Toolbar<V> {
115
+ declare class ToolbarWidgetGroup<V> {
104
116
  /** A reference to the host element. */
105
117
  private readonly _elementRef;
106
118
  /** A reference to the host element. */
107
119
  readonly element: HTMLElement;
108
- /** The TabList nested inside of the container. */
120
+ /** The parent Toolbar. */
121
+ private readonly _toolbar;
122
+ /** The list of child widgets within the group. */
109
123
  private readonly _widgets;
110
- /** Text direction. */
111
- readonly textDirection: _angular_core.WritableSignal<_angular_cdk_bidi.Direction>;
112
- /** Sorted UIPatterns of the child widgets */
113
- readonly _itemPatterns: _angular_core.Signal<i1.ToolbarWidgetPattern<V>[]>;
114
- /** Whether the toolbar is vertically or horizontally oriented. */
115
- readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
116
- /**
117
- * Whether to allow disabled items to receive focus. When `true`, disabled items are
118
- * focusable but not interactive. When `false`, disabled items are skipped during navigation.
119
- */
120
- softDisabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
121
- /** Whether the toolbar is disabled. */
124
+ /** The parent Toolbar UIPattern. */
125
+ private readonly _toolbarPattern;
126
+ /** Whether the widget group is disabled. */
122
127
  readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
123
- /** Whether focus should wrap when navigating. */
124
- readonly wrap: _angular_core.InputSignalWithTransform<boolean, unknown>;
125
- /** The values of the selected widgets within the toolbar. */
126
- readonly values: _angular_core.ModelSignal<V[]>;
127
- /** The toolbar UIPattern. */
128
- readonly _pattern: ToolbarPattern<V>;
129
- /** Whether the toolbar has received focus yet. */
130
- private _hasBeenFocused;
131
- constructor();
132
- _onFocus(): void;
133
- _register(widget: ToolbarWidget<V>): void;
134
- _unregister(widget: ToolbarWidget<V>): void;
135
- /** Finds the toolbar item associated with a given element. */
136
- private _getItem;
137
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<Toolbar<any>, never>;
138
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<Toolbar<any>, "[ngToolbar]", ["ngToolbar"], { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "softDisabled": { "alias": "softDisabled"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "wrap": { "alias": "wrap"; "required": false; "isSignal": true; }; "values": { "alias": "values"; "required": false; "isSignal": true; }; }, { "values": "valuesChange"; }, never, never, true, never>;
128
+ /** The list of toolbar items within the group. */
129
+ private readonly _itemPatterns;
130
+ /** Whether the group allows multiple widgets to be selected. */
131
+ readonly multi: _angular_core.InputSignalWithTransform<boolean, unknown>;
132
+ /** The ToolbarWidgetGroup UIPattern. */
133
+ readonly _pattern: ToolbarWidgetGroupPattern<ToolbarWidgetPattern<V>, V>;
134
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<ToolbarWidgetGroup<any>, never>;
135
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ToolbarWidgetGroup<any>, "[ngToolbarWidgetGroup]", ["ngToolbarWidgetGroup"], { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "multi": { "alias": "multi"; "required": false; "isSignal": true; }; }, {}, ["_widgets"], never, true, never>;
139
136
  }
140
137
 
141
138
  export { Toolbar, ToolbarWidget, ToolbarWidgetGroup };
package/types/tree.d.ts CHANGED
@@ -2,115 +2,12 @@ import * as _angular_cdk_bidi from '@angular/cdk/bidi';
2
2
  import * as _angular_core from '@angular/core';
3
3
  import { OnInit, OnDestroy, Signal } from '@angular/core';
4
4
  import * as i1 from '@angular/aria/private';
5
- import { TreeItemPattern, DeferredContentAware, TreePattern } from '@angular/aria/private';
6
- import { ComboboxPopup } from './_combobox-chunk.js';
7
-
8
- /**
9
- * Group that contains children tree items.
10
- *
11
- * The `ngTreeItemGroup` structural directive should be applied to an `ng-template` that
12
- * wraps the child `ngTreeItem` elements. It is used to define a group of children for an
13
- * expandable `ngTreeItem`. The `ownedBy` input links the group to its parent `ngTreeItem`.
14
- *
15
- * ```html
16
- * <li ngTreeItem [value]="'parent-id'">
17
- * Parent Item
18
- * <ul role="group">
19
- * <ng-template ngTreeItemGroup [ownedBy]="parentTreeItemRef">
20
- * <li ngTreeItem [value]="'child-id'">Child Item</li>
21
- * </ng-template>
22
- * </ul>
23
- * </li>
24
- * ```
25
- *
26
- * @developerPreview 21.0
27
- */
28
- declare class TreeItemGroup<V> implements OnInit, OnDestroy {
29
- /** A reference to the host element. */
30
- private readonly _elementRef;
31
- /** A reference to the host element. */
32
- readonly element: HTMLElement;
33
- /** The DeferredContent host directive. */
34
- private readonly _deferredContent;
35
- /** All groupable items that are descendants of the group. */
36
- private readonly _unorderedItems;
37
- /** Child items within this group. */
38
- readonly _childPatterns: _angular_core.Signal<TreeItemPattern<V>[]>;
39
- /** Tree item that owns the group. */
40
- readonly ownedBy: _angular_core.InputSignal<TreeItem<V>>;
41
- ngOnInit(): void;
42
- ngOnDestroy(): void;
43
- _register(child: TreeItem<V>): void;
44
- _unregister(child: TreeItem<V>): void;
45
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<TreeItemGroup<any>, never>;
46
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TreeItemGroup<any>, "ng-template[ngTreeItemGroup]", ["ngTreeItemGroup"], { "ownedBy": { "alias": "ownedBy"; "required": true; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.DeferredContent; inputs: {}; outputs: {}; }]>;
47
- }
5
+ import { TreePattern, DeferredContentAware, TreeItemPattern } from '@angular/aria/private';
6
+ import { ComboboxPopup } from './combobox.js';
48
7
 
49
8
  interface HasElement {
50
9
  element: HTMLElement;
51
10
  }
52
-
53
- /**
54
- * A selectable and expandable item in an `ngTree`.
55
- *
56
- * The `ngTreeItem` directive represents an individual node within an `ngTree`. It can be
57
- * selected, expanded (if it has children), and disabled. The `parent` input establishes
58
- * the hierarchical relationship within the tree.
59
- *
60
- * ```html
61
- * <li ngTreeItem [parent]="parentTreeOrGroup" value="item-id" label="Item Label">
62
- * Item Label
63
- * </li>
64
- * ```
65
- *
66
- * @developerPreview 21.0
67
- */
68
- declare class TreeItem<V> extends DeferredContentAware implements OnInit, OnDestroy, HasElement {
69
- /** A reference to the host element. */
70
- private readonly _elementRef;
71
- /** A reference to the host element. */
72
- readonly element: HTMLElement;
73
- /** The owned tree item group. */
74
- private readonly _group;
75
- /** A unique identifier for the tree item. */
76
- readonly id: _angular_core.InputSignal<string>;
77
- /** The value of the tree item. */
78
- readonly value: _angular_core.InputSignal<V>;
79
- /** The parent tree root or tree item group. */
80
- readonly parent: _angular_core.InputSignal<TreeItemGroup<V> | Tree<V>>;
81
- /** Whether the tree item is disabled. */
82
- readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
83
- /** Whether the tree item is selectable. */
84
- readonly selectable: _angular_core.InputSignal<boolean>;
85
- /** Whether the tree item is expanded. */
86
- readonly expanded: _angular_core.ModelSignal<boolean>;
87
- /** Optional label for typeahead. Defaults to the element's textContent. */
88
- readonly label: _angular_core.InputSignal<string | undefined>;
89
- /** Search term for typeahead. */
90
- readonly searchTerm: Signal<string>;
91
- /** The tree root. */
92
- readonly tree: Signal<Tree<V>>;
93
- /** Whether the item is active. */
94
- readonly active: Signal<boolean>;
95
- /** The level of the current item in a tree. */
96
- readonly level: Signal<number>;
97
- /** Whether the item is selected. */
98
- readonly selected: Signal<boolean | undefined>;
99
- /** Whether this item is visible due to all of its parents being expanded. */
100
- readonly visible: Signal<boolean>;
101
- /** Whether the tree is expanded. Use this value for aria-expanded. */
102
- protected readonly _expanded: Signal<boolean | undefined>;
103
- /** The UI pattern for this item. */
104
- _pattern: TreeItemPattern<V>;
105
- constructor();
106
- ngOnInit(): void;
107
- ngOnDestroy(): void;
108
- _register(group: TreeItemGroup<V>): void;
109
- _unregister(): void;
110
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<TreeItem<any>, never>;
111
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TreeItem<any>, "[ngTreeItem]", ["ngTreeItem"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; "parent": { "alias": "parent"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "expanded": "expandedChange"; }, never, never, true, never>;
112
- }
113
-
114
11
  /**
115
12
  * A container that transforms nested lists into an accessible, ARIA-compliant tree structure.
116
13
  * It manages the overall state of the tree, including selection, expansion, and keyboard
@@ -167,7 +64,7 @@ declare class Tree<V> {
167
64
  * - `explicit`: Items are selected explicitly by the user (e.g., via click or spacebar).
168
65
  * - `follow`: The focused item is automatically selected.
169
66
  */
170
- readonly selectionMode: _angular_core.InputSignal<"follow" | "explicit">;
67
+ readonly selectionMode: _angular_core.InputSignal<"explicit" | "follow">;
171
68
  /**
172
69
  * The focus strategy used by the tree.
173
70
  * - `roving`: Focus is moved to the active item using `tabindex`.
@@ -206,5 +103,105 @@ declare class Tree<V> {
206
103
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tree<any>, never>;
207
104
  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; }; "values": { "alias": "values"; "required": false; "isSignal": true; }; "nav": { "alias": "nav"; "required": false; "isSignal": true; }; "currentType": { "alias": "currentType"; "required": false; "isSignal": true; }; }, { "values": "valuesChange"; }, never, never, true, [{ directive: typeof ComboboxPopup; inputs: {}; outputs: {}; }]>;
208
105
  }
106
+ /**
107
+ * A selectable and expandable item in an `ngTree`.
108
+ *
109
+ * The `ngTreeItem` directive represents an individual node within an `ngTree`. It can be
110
+ * selected, expanded (if it has children), and disabled. The `parent` input establishes
111
+ * the hierarchical relationship within the tree.
112
+ *
113
+ * ```html
114
+ * <li ngTreeItem [parent]="parentTreeOrGroup" value="item-id" label="Item Label">
115
+ * Item Label
116
+ * </li>
117
+ * ```
118
+ *
119
+ * @developerPreview 21.0
120
+ */
121
+ declare class TreeItem<V> extends DeferredContentAware implements OnInit, OnDestroy, HasElement {
122
+ /** A reference to the host element. */
123
+ private readonly _elementRef;
124
+ /** A reference to the host element. */
125
+ readonly element: HTMLElement;
126
+ /** The owned tree item group. */
127
+ private readonly _group;
128
+ /** A unique identifier for the tree item. */
129
+ readonly id: _angular_core.InputSignal<string>;
130
+ /** The value of the tree item. */
131
+ readonly value: _angular_core.InputSignal<V>;
132
+ /** The parent tree root or tree item group. */
133
+ readonly parent: _angular_core.InputSignal<TreeItemGroup<V> | Tree<V>>;
134
+ /** Whether the tree item is disabled. */
135
+ readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
136
+ /** Whether the tree item is selectable. */
137
+ readonly selectable: _angular_core.InputSignal<boolean>;
138
+ /** Whether the tree item is expanded. */
139
+ readonly expanded: _angular_core.ModelSignal<boolean>;
140
+ /** Optional label for typeahead. Defaults to the element's textContent. */
141
+ readonly label: _angular_core.InputSignal<string | undefined>;
142
+ /** Search term for typeahead. */
143
+ readonly searchTerm: Signal<string>;
144
+ /** The tree root. */
145
+ readonly tree: Signal<Tree<V>>;
146
+ /** Whether the item is active. */
147
+ readonly active: Signal<boolean>;
148
+ /** The level of the current item in a tree. */
149
+ readonly level: Signal<number>;
150
+ /** Whether the item is selected. */
151
+ readonly selected: Signal<boolean | undefined>;
152
+ /** Whether this item is visible due to all of its parents being expanded. */
153
+ readonly visible: Signal<boolean>;
154
+ /** Whether the tree is expanded. Use this value for aria-expanded. */
155
+ protected readonly _expanded: Signal<boolean | undefined>;
156
+ /** The UI pattern for this item. */
157
+ _pattern: TreeItemPattern<V>;
158
+ constructor();
159
+ ngOnInit(): void;
160
+ ngOnDestroy(): void;
161
+ _register(group: TreeItemGroup<V>): void;
162
+ _unregister(): void;
163
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TreeItem<any>, never>;
164
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TreeItem<any>, "[ngTreeItem]", ["ngTreeItem"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; "parent": { "alias": "parent"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "expanded": "expandedChange"; }, never, never, true, never>;
165
+ }
166
+ /**
167
+ * Group that contains children tree items.
168
+ *
169
+ * The `ngTreeItemGroup` structural directive should be applied to an `ng-template` that
170
+ * wraps the child `ngTreeItem` elements. It is used to define a group of children for an
171
+ * expandable `ngTreeItem`. The `ownedBy` input links the group to its parent `ngTreeItem`.
172
+ *
173
+ * ```html
174
+ * <li ngTreeItem [value]="'parent-id'">
175
+ * Parent Item
176
+ * <ul role="group">
177
+ * <ng-template ngTreeItemGroup [ownedBy]="parentTreeItemRef">
178
+ * <li ngTreeItem [value]="'child-id'">Child Item</li>
179
+ * </ng-template>
180
+ * </ul>
181
+ * </li>
182
+ * ```
183
+ *
184
+ * @developerPreview 21.0
185
+ */
186
+ declare class TreeItemGroup<V> implements OnInit, OnDestroy {
187
+ /** A reference to the host element. */
188
+ private readonly _elementRef;
189
+ /** A reference to the host element. */
190
+ readonly element: HTMLElement;
191
+ /** The DeferredContent host directive. */
192
+ private readonly _deferredContent;
193
+ /** All groupable items that are descendants of the group. */
194
+ private readonly _unorderedItems;
195
+ /** Child items within this group. */
196
+ readonly _childPatterns: Signal<TreeItemPattern<V>[]>;
197
+ /** Tree item that owns the group. */
198
+ readonly ownedBy: _angular_core.InputSignal<TreeItem<V>>;
199
+ ngOnInit(): void;
200
+ ngOnDestroy(): void;
201
+ _register(child: TreeItem<V>): void;
202
+ _unregister(child: TreeItem<V>): void;
203
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TreeItemGroup<any>, never>;
204
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TreeItemGroup<any>, "ng-template[ngTreeItemGroup]", ["ngTreeItemGroup"], { "ownedBy": { "alias": "ownedBy"; "required": true; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.DeferredContent; inputs: {}; outputs: {}; }]>;
205
+ }
209
206
 
210
207
  export { Tree, TreeItem, TreeItemGroup };