ng-primitives 0.120.4 → 0.121.0

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 (147) hide show
  1. package/example-theme/index.css +9 -0
  2. package/fesm2022/ng-primitives-a11y.mjs +5 -5
  3. package/fesm2022/ng-primitives-a11y.mjs.map +1 -1
  4. package/fesm2022/ng-primitives-accordion.mjs +34 -51
  5. package/fesm2022/ng-primitives-accordion.mjs.map +1 -1
  6. package/fesm2022/ng-primitives-ai.mjs +39 -52
  7. package/fesm2022/ng-primitives-ai.mjs.map +1 -1
  8. package/fesm2022/ng-primitives-autofill.mjs +4 -4
  9. package/fesm2022/ng-primitives-autofill.mjs.map +1 -1
  10. package/fesm2022/ng-primitives-avatar.mjs +14 -17
  11. package/fesm2022/ng-primitives-avatar.mjs.map +1 -1
  12. package/fesm2022/ng-primitives-breadcrumbs.mjs +21 -21
  13. package/fesm2022/ng-primitives-breadcrumbs.mjs.map +1 -1
  14. package/fesm2022/ng-primitives-button.mjs +7 -9
  15. package/fesm2022/ng-primitives-button.mjs.map +1 -1
  16. package/fesm2022/ng-primitives-checkbox.mjs +15 -30
  17. package/fesm2022/ng-primitives-checkbox.mjs.map +1 -1
  18. package/fesm2022/ng-primitives-combobox.mjs +60 -92
  19. package/fesm2022/ng-primitives-combobox.mjs.map +1 -1
  20. package/fesm2022/ng-primitives-common.mjs +4 -4
  21. package/fesm2022/ng-primitives-common.mjs.map +1 -1
  22. package/fesm2022/ng-primitives-context-menu.mjs +68 -121
  23. package/fesm2022/ng-primitives-context-menu.mjs.map +1 -1
  24. package/fesm2022/ng-primitives-date-picker.mjs +91 -115
  25. package/fesm2022/ng-primitives-date-picker.mjs.map +1 -1
  26. package/fesm2022/ng-primitives-dialog.mjs +35 -51
  27. package/fesm2022/ng-primitives-dialog.mjs.map +1 -1
  28. package/fesm2022/ng-primitives-file-upload.mjs +26 -53
  29. package/fesm2022/ng-primitives-file-upload.mjs.map +1 -1
  30. package/fesm2022/ng-primitives-focus-trap.mjs +5 -8
  31. package/fesm2022/ng-primitives-focus-trap.mjs.map +1 -1
  32. package/fesm2022/ng-primitives-form-field.mjs +39 -44
  33. package/fesm2022/ng-primitives-form-field.mjs.map +1 -1
  34. package/fesm2022/ng-primitives-input-otp.mjs +30 -43
  35. package/fesm2022/ng-primitives-input-otp.mjs.map +1 -1
  36. package/fesm2022/ng-primitives-input.mjs +6 -8
  37. package/fesm2022/ng-primitives-input.mjs.map +1 -1
  38. package/fesm2022/ng-primitives-interactions.mjs +31 -48
  39. package/fesm2022/ng-primitives-interactions.mjs.map +1 -1
  40. package/fesm2022/ng-primitives-internal.mjs +39 -35
  41. package/fesm2022/ng-primitives-internal.mjs.map +1 -1
  42. package/fesm2022/ng-primitives-listbox.mjs +34 -48
  43. package/fesm2022/ng-primitives-listbox.mjs.map +1 -1
  44. package/fesm2022/ng-primitives-menu.mjs +85 -151
  45. package/fesm2022/ng-primitives-menu.mjs.map +1 -1
  46. package/fesm2022/ng-primitives-meter.mjs +25 -36
  47. package/fesm2022/ng-primitives-meter.mjs.map +1 -1
  48. package/fesm2022/ng-primitives-navigation-menu.mjs +60 -108
  49. package/fesm2022/ng-primitives-navigation-menu.mjs.map +1 -1
  50. package/fesm2022/ng-primitives-number-field.mjs +35 -59
  51. package/fesm2022/ng-primitives-number-field.mjs.map +1 -1
  52. package/fesm2022/ng-primitives-pagination.mjs +270 -297
  53. package/fesm2022/ng-primitives-pagination.mjs.map +1 -1
  54. package/fesm2022/ng-primitives-popover.mjs +209 -223
  55. package/fesm2022/ng-primitives-popover.mjs.map +1 -1
  56. package/fesm2022/ng-primitives-portal.mjs +88 -59
  57. package/fesm2022/ng-primitives-portal.mjs.map +1 -1
  58. package/fesm2022/ng-primitives-progress.mjs +30 -41
  59. package/fesm2022/ng-primitives-progress.mjs.map +1 -1
  60. package/fesm2022/ng-primitives-radio.mjs +20 -30
  61. package/fesm2022/ng-primitives-radio.mjs.map +1 -1
  62. package/fesm2022/ng-primitives-resize.mjs +3 -3
  63. package/fesm2022/ng-primitives-resize.mjs.map +1 -1
  64. package/fesm2022/ng-primitives-roving-focus.mjs +20 -34
  65. package/fesm2022/ng-primitives-roving-focus.mjs.map +1 -1
  66. package/fesm2022/ng-primitives-search.mjs +9 -9
  67. package/fesm2022/ng-primitives-search.mjs.map +1 -1
  68. package/fesm2022/ng-primitives-select.mjs +720 -620
  69. package/fesm2022/ng-primitives-select.mjs.map +1 -1
  70. package/fesm2022/ng-primitives-separator.mjs +4 -6
  71. package/fesm2022/ng-primitives-separator.mjs.map +1 -1
  72. package/fesm2022/ng-primitives-slider.mjs +63 -100
  73. package/fesm2022/ng-primitives-slider.mjs.map +1 -1
  74. package/fesm2022/ng-primitives-state.mjs +3 -3
  75. package/fesm2022/ng-primitives-state.mjs.map +1 -1
  76. package/fesm2022/ng-primitives-switch.mjs +15 -21
  77. package/fesm2022/ng-primitives-switch.mjs.map +1 -1
  78. package/fesm2022/ng-primitives-tabs.mjs +31 -41
  79. package/fesm2022/ng-primitives-tabs.mjs.map +1 -1
  80. package/fesm2022/ng-primitives-textarea.mjs +5 -7
  81. package/fesm2022/ng-primitives-textarea.mjs.map +1 -1
  82. package/fesm2022/ng-primitives-toast.mjs +30 -23
  83. package/fesm2022/ng-primitives-toast.mjs.map +1 -1
  84. package/fesm2022/ng-primitives-toggle-group.mjs +20 -36
  85. package/fesm2022/ng-primitives-toggle-group.mjs.map +1 -1
  86. package/fesm2022/ng-primitives-toggle.mjs +10 -19
  87. package/fesm2022/ng-primitives-toggle.mjs.map +1 -1
  88. package/fesm2022/ng-primitives-toolbar.mjs +4 -6
  89. package/fesm2022/ng-primitives-toolbar.mjs.map +1 -1
  90. package/fesm2022/ng-primitives-tooltip.mjs +401 -402
  91. package/fesm2022/ng-primitives-tooltip.mjs.map +1 -1
  92. package/fesm2022/ng-primitives-utils.mjs +5 -4
  93. package/fesm2022/ng-primitives-utils.mjs.map +1 -1
  94. package/package.json +56 -55
  95. package/schematics/ng-generate/templates/select/select.__fileSuffix@dasherize__.ts.template +48 -48
  96. package/{a11y/index.d.ts → types/ng-primitives-a11y.d.ts} +18 -24
  97. package/{accordion/index.d.ts → types/ng-primitives-accordion.d.ts} +85 -98
  98. package/{autofill/index.d.ts → types/ng-primitives-autofill.d.ts} +3 -10
  99. package/{avatar/index.d.ts → types/ng-primitives-avatar.d.ts} +7 -30
  100. package/{breadcrumbs/index.d.ts → types/ng-primitives-breadcrumbs.d.ts} +15 -70
  101. package/{button/index.d.ts → types/ng-primitives-button.d.ts} +23 -29
  102. package/{checkbox/index.d.ts → types/ng-primitives-checkbox.d.ts} +68 -74
  103. package/{combobox/index.d.ts → types/ng-primitives-combobox.d.ts} +35 -35
  104. package/{context-menu/index.d.ts → types/ng-primitives-context-menu.d.ts} +2 -1
  105. package/{date-picker/index.d.ts → types/ng-primitives-date-picker.d.ts} +2 -2
  106. package/{dialog/index.d.ts → types/ng-primitives-dialog.d.ts} +7 -2
  107. package/{file-upload/index.d.ts → types/ng-primitives-file-upload.d.ts} +5 -20
  108. package/{focus-trap/index.d.ts → types/ng-primitives-focus-trap.d.ts} +3 -10
  109. package/{form-field/index.d.ts → types/ng-primitives-form-field.d.ts} +9 -40
  110. package/{input/index.d.ts → types/ng-primitives-input.d.ts} +3 -10
  111. package/{menu/index.d.ts → types/ng-primitives-menu.d.ts} +17 -63
  112. package/{navigation-menu/index.d.ts → types/ng-primitives-navigation-menu.d.ts} +15 -70
  113. package/{number-field/index.d.ts → types/ng-primitives-number-field.d.ts} +80 -110
  114. package/types/ng-primitives-pagination.d.ts +502 -0
  115. package/{popover/index.d.ts → types/ng-primitives-popover.d.ts} +244 -57
  116. package/{portal/index.d.ts → types/ng-primitives-portal.d.ts} +22 -13
  117. package/{progress/index.d.ts → types/ng-primitives-progress.d.ts} +3 -10
  118. package/{roving-focus/index.d.ts → types/ng-primitives-roving-focus.d.ts} +65 -79
  119. package/types/ng-primitives-select.d.ts +687 -0
  120. package/{separator/index.d.ts → types/ng-primitives-separator.d.ts} +3 -10
  121. package/{slider/index.d.ts → types/ng-primitives-slider.d.ts} +76 -138
  122. package/{state/index.d.ts → types/ng-primitives-state.d.ts} +26 -21
  123. package/{switch/index.d.ts → types/ng-primitives-switch.d.ts} +50 -64
  124. package/{tabs/index.d.ts → types/ng-primitives-tabs.d.ts} +9 -40
  125. package/{textarea/index.d.ts → types/ng-primitives-textarea.d.ts} +3 -10
  126. package/{toast/index.d.ts → types/ng-primitives-toast.d.ts} +13 -1
  127. package/{toggle-group/index.d.ts → types/ng-primitives-toggle-group.d.ts} +75 -89
  128. package/{toggle/index.d.ts → types/ng-primitives-toggle.d.ts} +50 -56
  129. package/{toolbar/index.d.ts → types/ng-primitives-toolbar.d.ts} +3 -10
  130. package/types/ng-primitives-tooltip.d.ts +691 -0
  131. package/pagination/index.d.ts +0 -211
  132. package/select/index.d.ts +0 -396
  133. package/tooltip/index.d.ts +0 -384
  134. /package/{ai/index.d.ts → types/ng-primitives-ai.d.ts} +0 -0
  135. /package/{common/index.d.ts → types/ng-primitives-common.d.ts} +0 -0
  136. /package/{date-time-luxon/index.d.ts → types/ng-primitives-date-time-luxon.d.ts} +0 -0
  137. /package/{date-time/index.d.ts → types/ng-primitives-date-time.d.ts} +0 -0
  138. /package/{input-otp/index.d.ts → types/ng-primitives-input-otp.d.ts} +0 -0
  139. /package/{interactions/index.d.ts → types/ng-primitives-interactions.d.ts} +0 -0
  140. /package/{internal/index.d.ts → types/ng-primitives-internal.d.ts} +0 -0
  141. /package/{listbox/index.d.ts → types/ng-primitives-listbox.d.ts} +0 -0
  142. /package/{meter/index.d.ts → types/ng-primitives-meter.d.ts} +0 -0
  143. /package/{radio/index.d.ts → types/ng-primitives-radio.d.ts} +0 -0
  144. /package/{resize/index.d.ts → types/ng-primitives-resize.d.ts} +0 -0
  145. /package/{search/index.d.ts → types/ng-primitives-search.d.ts} +0 -0
  146. /package/{utils/index.d.ts → types/ng-primitives-utils.d.ts} +0 -0
  147. /package/{index.d.ts → types/ng-primitives.d.ts} +0 -0
@@ -1,211 +0,0 @@
1
- import * as _angular_core from '@angular/core';
2
- import * as ng_primitives_state from 'ng-primitives/state';
3
- import * as ng_primitives_pagination from 'ng-primitives/pagination';
4
- import { NumberInput, BooleanInput } from '@angular/cdk/coercion';
5
-
6
- /**
7
- * The `NgpPaginationButton` directive is used to create a pagination button.
8
- */
9
- declare class NgpPaginationButton {
10
- /**
11
- * Access the pagination state.
12
- */
13
- protected readonly paginationState: _angular_core.Signal<ng_primitives_state.State<ng_primitives_pagination.NgpPagination>>;
14
- /**
15
- * Define the page this button represents.
16
- */
17
- readonly page: _angular_core.InputSignalWithTransform<number, NumberInput>;
18
- /**
19
- * Whether the button is disabled.
20
- */
21
- readonly buttonDisabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
22
- /**
23
- * Whether the button is disabled.
24
- */
25
- readonly disabled: _angular_core.Signal<boolean>;
26
- /**
27
- * Whether this page is the currently selected page.
28
- */
29
- protected readonly selected: _angular_core.Signal<boolean>;
30
- constructor();
31
- /**
32
- * Go to the page this button represents.
33
- */
34
- goToPage(): void;
35
- /**
36
- * A click event may not be fired if this is on an anchor tag and the href is empty.
37
- * This is a workaround to ensure the click event is fired.
38
- */
39
- protected onEnter(event: Event): void;
40
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPaginationButton, never>;
41
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPaginationButton, "[ngpPaginationButton]", ["ngpPaginationButton"], { "page": { "alias": "ngpPaginationButtonPage"; "required": true; "isSignal": true; }; "buttonDisabled": { "alias": "ngpPaginationButtonDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
42
- }
43
-
44
- /**
45
- * The `NgpPaginationFirst` directive is used to create a pagination button that navigates to the first page.
46
- */
47
- declare class NgpPaginationFirst {
48
- /**
49
- * Access the pagination state.
50
- */
51
- protected readonly paginationState: _angular_core.Signal<ng_primitives_state.State<ng_primitives_pagination.NgpPagination>>;
52
- /**
53
- * Whether the button is disabled.
54
- */
55
- readonly buttonDisabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
56
- readonly disabled: _angular_core.Signal<boolean>;
57
- constructor();
58
- /**
59
- * Go to the first page.
60
- */
61
- goToFirstPage(): void;
62
- /**
63
- * A click event may not be fired if this is on an anchor tag and the href is empty.
64
- * This is a workaround to ensure the click event is fired.
65
- */
66
- protected onEnter(event: Event): void;
67
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPaginationFirst, never>;
68
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPaginationFirst, "[ngpPaginationFirst]", ["ngpPaginationFirst"], { "buttonDisabled": { "alias": "ngpPaginationFirstDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
69
- }
70
-
71
- /**
72
- * The `NgpPaginationLast` directive is used to create a pagination button that navigates to the last page.
73
- */
74
- declare class NgpPaginationLast {
75
- /**
76
- * Access the pagination state.
77
- */
78
- protected readonly paginationState: _angular_core.Signal<ng_primitives_state.State<ng_primitives_pagination.NgpPagination>>;
79
- /**
80
- * Whether the button is disabled.
81
- */
82
- readonly buttonDisabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
83
- readonly disabled: _angular_core.Signal<boolean>;
84
- constructor();
85
- /**
86
- * Go to the last page.
87
- */
88
- goToLastPage(): void;
89
- /**
90
- * A click event may not be fired if this is on an anchor tag and the href is empty.
91
- * This is a workaround to ensure the click event is fired.
92
- */
93
- protected onEnter(event: Event): void;
94
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPaginationLast, never>;
95
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPaginationLast, "[ngpPaginationLast]", ["ngpPaginationLast"], { "buttonDisabled": { "alias": "ngpPaginationLastDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
96
- }
97
-
98
- /**
99
- * The `NgpPaginationNext` directive is used to create a pagination button that navigates to the next page.
100
- */
101
- declare class NgpPaginationNext {
102
- /**
103
- * Access the pagination state.
104
- */
105
- protected readonly paginationState: _angular_core.Signal<ng_primitives_state.State<ng_primitives_pagination.NgpPagination>>;
106
- /**
107
- * Whether the button is disabled.
108
- */
109
- readonly buttonDisabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
110
- /**
111
- * Whether the button is disabled.
112
- */
113
- readonly disabled: _angular_core.Signal<boolean>;
114
- constructor();
115
- /**
116
- * Go to the next page.
117
- */
118
- goToNextPage(): void;
119
- /**
120
- * A click event may not be fired if this is on an anchor tag and the href is empty.
121
- * This is a workaround to ensure the click event is fired.
122
- */
123
- protected onEnter(event: Event): void;
124
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPaginationNext, never>;
125
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPaginationNext, "[ngpPaginationNext]", ["ngpPaginationNext"], { "buttonDisabled": { "alias": "ngpPaginationNextDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
126
- }
127
-
128
- /**
129
- * The `NgpPaginationPrevious` directive is used to create a pagination button that navigates to the previous page.
130
- */
131
- declare class NgpPaginationPrevious {
132
- /**
133
- * Access the pagination state.
134
- */
135
- protected readonly paginationState: _angular_core.Signal<ng_primitives_state.State<ng_primitives_pagination.NgpPagination>>;
136
- /**
137
- * Whether the button is disabled.
138
- */
139
- readonly buttonDisabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
140
- /**
141
- * Whether the button is disabled.
142
- */
143
- readonly disabled: _angular_core.Signal<boolean>;
144
- constructor();
145
- /**
146
- * Go to the previous page.
147
- */
148
- goToPreviousPage(): void;
149
- /**
150
- * A click event may not be fired if this is on an anchor tag and the href is empty.
151
- * This is a workaround to ensure the click event is fired.
152
- */
153
- protected onEnter(event: Event): void;
154
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPaginationPrevious, never>;
155
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPaginationPrevious, "[ngpPaginationPrevious]", ["ngpPaginationPrevious"], { "buttonDisabled": { "alias": "ngpPaginationPreviousDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
156
- }
157
-
158
- /**
159
- * The `NgpPagination` directive is used to create a pagination control.
160
- */
161
- declare class NgpPagination {
162
- /**
163
- * The currently selected page.
164
- */
165
- readonly page: _angular_core.InputSignalWithTransform<number, NumberInput>;
166
- /**
167
- * The event that is fired when the page changes.
168
- */
169
- readonly pageChange: _angular_core.OutputEmitterRef<number>;
170
- /**
171
- * The total number of pages.
172
- */
173
- readonly pageCount: _angular_core.InputSignalWithTransform<number, NumberInput>;
174
- /**
175
- * Whether the pagination is disabled.
176
- */
177
- readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
178
- /**
179
- * Determine if we are on the first page.
180
- * @internal
181
- */
182
- readonly firstPage: _angular_core.Signal<boolean>;
183
- /**
184
- * Determine if we are on the last page.
185
- * @internal
186
- */
187
- readonly lastPage: _angular_core.Signal<boolean>;
188
- /**
189
- * The control state for the pagination.
190
- * @internal
191
- */
192
- protected readonly state: ng_primitives_state.CreatedState<NgpPagination>;
193
- /**
194
- * Go to the specified page.
195
- * @param page The page to go to.
196
- */
197
- goToPage(page: number): void;
198
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPagination, never>;
199
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPagination, "[ngpPagination]", ["ngpPagination"], { "page": { "alias": "ngpPaginationPage"; "required": false; "isSignal": true; }; "pageCount": { "alias": "ngpPaginationPageCount"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpPaginationDisabled"; "required": false; "isSignal": true; }; }, { "pageChange": "ngpPaginationPageChange"; }, never, never, true, never>;
200
- }
201
-
202
- /**
203
- * Provides the Pagination state.
204
- */
205
- declare const providePaginationState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
206
- /**
207
- * Injects the Pagination state.
208
- */
209
- declare const injectPaginationState: <U = NgpPagination>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
210
-
211
- export { NgpPagination, NgpPaginationButton, NgpPaginationFirst, NgpPaginationLast, NgpPaginationNext, NgpPaginationPrevious, injectPaginationState, providePaginationState };
package/select/index.d.ts DELETED
@@ -1,396 +0,0 @@
1
- import * as ng_primitives_state from 'ng-primitives/state';
2
- import * as _angular_core from '@angular/core';
3
- import { OnDestroy, Provider, Injector } from '@angular/core';
4
- import { BooleanInput } from '@angular/cdk/coercion';
5
- import * as ng_primitives_internal from 'ng-primitives/internal';
6
- import * as ng_primitives_select from 'ng-primitives/select';
7
- import * as ng_primitives_portal from 'ng-primitives/portal';
8
- import { NgpOverlay, NgpFlip, NgpOffset, NgpFlipInput, NgpOffsetInput } from 'ng-primitives/portal';
9
- import * as ng_primitives_a11y from 'ng-primitives/a11y';
10
- import { Placement } from '@floating-ui/dom';
11
-
12
- /**
13
- * Apply the `ngpNativeSelect` directive to a select element that you want to enhance.
14
- */
15
- declare class NgpNativeSelect {
16
- /**
17
- * The id of the select. If not provided, a unique id will be generated.
18
- */
19
- readonly id: _angular_core.InputSignal<string>;
20
- /**
21
- * Whether the select is disabled.
22
- */
23
- readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
24
- /**
25
- * The select state.
26
- */
27
- protected readonly state: ng_primitives_state.CreatedState<NgpNativeSelect>;
28
- constructor();
29
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpNativeSelect, never>;
30
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpNativeSelect, "select[ngpNativeSelect]", ["ngpNativeSelect"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpNativeSelectDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
31
- }
32
-
33
- /**
34
- * Provides the Select state.
35
- */
36
- declare const provideNativeSelectState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
37
- /**
38
- * Injects the Select state.
39
- */
40
- declare const injectNativeSelectState: <U = NgpNativeSelect>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
41
-
42
- declare class NgpSelectDropdown {
43
- /** Access the select state. */
44
- protected readonly state: _angular_core.Signal<ng_primitives_state.State<ng_primitives_select.NgpSelect>>;
45
- /** The dimensions of the select. */
46
- protected readonly selectDimensions: _angular_core.Signal<ng_primitives_internal.Dimensions>;
47
- /**
48
- * Access the element reference.
49
- * @internal
50
- */
51
- readonly elementRef: _angular_core.ElementRef<HTMLElement>;
52
- /** The id of the dropdown. */
53
- readonly id: _angular_core.InputSignal<string>;
54
- constructor();
55
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpSelectDropdown, never>;
56
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpSelectDropdown, "[ngpSelectDropdown]", ["ngpSelectDropdown"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
57
- }
58
-
59
- declare class NgpSelectOption implements OnDestroy {
60
- /** Access the select state. */
61
- protected readonly state: _angular_core.Signal<ng_primitives_state.State<ng_primitives_select.NgpSelect>>;
62
- /**
63
- * The element reference of the option.
64
- * @internal
65
- */
66
- readonly elementRef: _angular_core.ElementRef<HTMLElement>;
67
- /** The id of the option. */
68
- readonly id: _angular_core.InputSignal<string>;
69
- /** @required The value of the option. */
70
- readonly value: _angular_core.InputSignal<any>;
71
- /** The disabled state of the option. */
72
- readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
73
- /** The index of the option in the list. */
74
- readonly index: _angular_core.InputSignal<number | undefined>;
75
- /**
76
- * Event emitted when the option is activated via click or keyboard.
77
- * This is useful for options without values that need custom behavior.
78
- */
79
- readonly activated: _angular_core.OutputEmitterRef<void>;
80
- /**
81
- * Whether this option is the active descendant.
82
- * @internal
83
- */
84
- protected readonly active: _angular_core.Signal<boolean>;
85
- /** Whether this option is selected. */
86
- protected readonly selected: _angular_core.Signal<boolean>;
87
- constructor();
88
- ngOnDestroy(): void;
89
- /**
90
- * Select the option.
91
- * @internal
92
- */
93
- select(): void;
94
- /**
95
- * Scroll the option into view.
96
- * @internal
97
- */
98
- scrollIntoView(): void;
99
- /**
100
- * Whenever the pointer enters the option, activate it.
101
- * @internal
102
- */
103
- protected onPointerEnter(): void;
104
- /**
105
- * Whenever the pointer leaves the option, deactivate it.
106
- * @internal
107
- */
108
- protected onPointerLeave(): void;
109
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpSelectOption, never>;
110
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpSelectOption, "[ngpSelectOption]", ["ngpSelectOption"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "ngpSelectOptionValue"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpSelectOptionDisabled"; "required": false; "isSignal": true; }; "index": { "alias": "ngpSelectOptionIndex"; "required": false; "isSignal": true; }; }, { "activated": "ngpSelectOptionActivated"; }, never, never, true, never>;
111
- }
112
-
113
- declare class NgpSelectPortal implements OnDestroy {
114
- /** Access the select state. */
115
- private readonly state;
116
- /** Access the view container reference. */
117
- private readonly viewContainerRef;
118
- /** Access the template reference. */
119
- private readonly templateRef;
120
- /** Access the injector. */
121
- private readonly injector;
122
- /**
123
- * The overlay that manages the popover
124
- * @internal
125
- */
126
- readonly overlay: _angular_core.WritableSignal<NgpOverlay<void> | null>;
127
- constructor();
128
- /** Cleanup the portal. */
129
- ngOnDestroy(): void;
130
- /**
131
- * Attach the portal.
132
- * @internal
133
- */
134
- show(): Promise<void>;
135
- /**
136
- * Detach the portal.
137
- * @internal
138
- */
139
- detach(): Promise<void>;
140
- /**
141
- * Create the overlay that will contain the dropdown
142
- */
143
- private createOverlay;
144
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpSelectPortal, never>;
145
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpSelectPortal, "[ngpSelectPortal]", ["ngpSelectPortal"], {}, {}, never, never, true, never>;
146
- }
147
-
148
- interface NgpSelectConfig {
149
- /**
150
- * The default placement for the select dropdown.
151
- * @default 'bottom'
152
- */
153
- placement: Placement;
154
- /**
155
- * The container element or selector for the select dropdown.
156
- * This can be used to control where the dropdown is rendered in the DOM.
157
- * @default 'body'
158
- */
159
- container: HTMLElement | string | null;
160
- /**
161
- * Whether the select dropdown should flip when there is not enough space.
162
- * Can be a boolean to enable/disable, or an object with padding and fallbackPlacements options.
163
- * @default true
164
- */
165
- flip: NgpFlip;
166
- /**
167
- * Define the offset of the select dropdown relative to the trigger.
168
- * Can be a number (applies to mainAxis) or an object with mainAxis, crossAxis, and alignmentAxis.
169
- * @default 0
170
- */
171
- offset: NgpOffset;
172
- }
173
- /**
174
- * Provide the default Select configuration
175
- * @param config The Select configuration
176
- * @returns The provider
177
- */
178
- declare function provideSelectConfig(config: Partial<NgpSelectConfig>): Provider[];
179
- /**
180
- * Inject the Select configuration
181
- * @returns The global Select configuration
182
- */
183
- declare function injectSelectConfig(): NgpSelectConfig;
184
-
185
- /**
186
- * Ideally we would use a generic type here, unfortunately, unlike in React,
187
- * we cannot infer the type based on another input. For example, if multiple
188
- * is true, we cannot infer that the value is an array of T. Using a union
189
- * type is not ideal either because it requires the user to handle multiple cases.
190
- * Using a generic also isn't ideal because we need to use T as both an array and
191
- * a single value.
192
- *
193
- * Any seems to be used by Angular Material, ng-select, and other libraries
194
- * so we will use it here as well.
195
- */
196
- type T = any;
197
- declare class NgpSelect {
198
- /** Access the select configuration. */
199
- protected readonly config: NgpSelectConfig;
200
- /** @internal Access the select element. */
201
- readonly elementRef: _angular_core.ElementRef<HTMLElement>;
202
- /** Access the injector. */
203
- protected readonly injector: Injector;
204
- /** The unique id of the select. */
205
- readonly id: _angular_core.InputSignal<string>;
206
- /** The value of the select. */
207
- readonly value: _angular_core.InputSignal<any>;
208
- /** Event emitted when the value changes. */
209
- readonly valueChange: _angular_core.OutputEmitterRef<any>;
210
- /** Whether the select is multiple selection. */
211
- readonly multiple: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
212
- /** Whether the select is disabled. */
213
- readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
214
- /** Emit when the dropdown open state changes. */
215
- readonly openChange: _angular_core.OutputEmitterRef<boolean>;
216
- /** The comparator function used to compare options. */
217
- readonly compareWith: _angular_core.InputSignal<(a: T | undefined, b: T | undefined) => boolean>;
218
- /** The position of the dropdown. */
219
- readonly placement: _angular_core.InputSignal<Placement>;
220
- /** The container for the dropdown. */
221
- readonly container: _angular_core.InputSignal<string | HTMLElement | null>;
222
- /** Whether the dropdown should flip when there is not enough space. Can be a boolean to enable/disable, or an object with padding and fallbackPlacements options. */
223
- readonly flip: _angular_core.InputSignalWithTransform<NgpFlip, NgpFlipInput>;
224
- /**
225
- * Define the offset of the select dropdown relative to the trigger.
226
- * Can be a number (applies to mainAxis) or an object with mainAxis, crossAxis, and alignmentAxis.
227
- * @default 0
228
- */
229
- readonly offset: _angular_core.InputSignalWithTransform<NgpOffset, NgpOffsetInput>;
230
- /**
231
- * A function that will scroll the active option into view. This can be overridden
232
- * for cases such as virtual scrolling where we cannot scroll the option directly because
233
- * it may not be rendered.
234
- */
235
- readonly scrollToOption: _angular_core.InputSignal<((index: number) => void) | undefined>;
236
- /**
237
- * Provide all the option values to the select. This is useful for virtual scrolling scenarios
238
- * where not all options are rendered in the DOM. This is not an alternative to adding the options
239
- * in the DOM, it is only to provide the select with the full list of options. This list should match
240
- * the order of the options as they would appear in the DOM.
241
- */
242
- readonly allOptions: _angular_core.InputSignal<any[] | undefined>;
243
- /**
244
- * Store the select portal.
245
- * @internal
246
- */
247
- readonly portal: _angular_core.WritableSignal<NgpSelectPortal | undefined>;
248
- /**
249
- * Store the select dropdown.
250
- * @internal
251
- */
252
- readonly dropdown: _angular_core.WritableSignal<NgpSelectDropdown | undefined>;
253
- /**
254
- * Store the select options.
255
- * @internal
256
- */
257
- readonly options: _angular_core.WritableSignal<NgpSelectOption[]>;
258
- /**
259
- * Access the overlay
260
- * @internal
261
- */
262
- readonly overlay: _angular_core.Signal<ng_primitives_portal.NgpOverlay<void> | null | undefined>;
263
- /**
264
- * The open state of the select.
265
- * @internal
266
- */
267
- readonly open: _angular_core.Signal<boolean>;
268
- /**
269
- * The options sorted by their index or DOM position.
270
- * @internal
271
- */
272
- readonly sortedOptions: _angular_core.Signal<NgpSelectOption[]>;
273
- /**
274
- * The active key descendant manager.
275
- * @internal
276
- */
277
- readonly activeDescendantManager: {
278
- id: _angular_core.Signal<string | undefined>;
279
- index: _angular_core.WritableSignal<number>;
280
- activateByIndex: (index: number, { scroll, origin }?: ng_primitives_a11y.ActivationOptions) => void;
281
- activateById: (id: string, options?: ng_primitives_a11y.ActivationOptions) => void;
282
- first: (options?: ng_primitives_a11y.ActivationOptions) => void;
283
- last: (options?: ng_primitives_a11y.ActivationOptions) => void;
284
- next: (options?: ng_primitives_a11y.ActivationOptions) => void;
285
- previous: (options?: ng_primitives_a11y.ActivationOptions) => void;
286
- reset: ({ scroll, origin }?: ng_primitives_a11y.ActivationOptions) => void;
287
- validate: () => void;
288
- };
289
- /** The state of the select. */
290
- protected readonly state: ng_primitives_state.CreatedState<NgpSelect>;
291
- constructor();
292
- /**
293
- * Open the dropdown.
294
- * @internal
295
- */
296
- openDropdown(): Promise<void>;
297
- /**
298
- * Close the dropdown.
299
- * @internal
300
- */
301
- closeDropdown(): void;
302
- /**
303
- * Handles the dropdown being closed.
304
- * Emits the openChange event and resets the active descendant.
305
- * @internal
306
- */
307
- onOverlayClosed(): void;
308
- /**
309
- * Toggle the dropdown.
310
- * @internal
311
- */
312
- toggleDropdown(): Promise<void>;
313
- /**
314
- * Select an option.
315
- * @param index The index of the option to select.
316
- * @internal
317
- */
318
- selectOption(id: string): void;
319
- /**
320
- * Deselect an option.
321
- * @param option The option to deselect.
322
- * @internal
323
- */
324
- deselectOption(option: NgpSelectOption): void;
325
- /**
326
- * Toggle the selection of an option.
327
- * @param id The id of the option to toggle.
328
- * @internal
329
- */
330
- toggleOption(id: string): void;
331
- /**
332
- * Determine if an option is selected.
333
- * @param option The option to check.
334
- * @internal
335
- */
336
- isOptionSelected(option: T): boolean;
337
- /**
338
- * Activate the next option in the list if there is one.
339
- * If there is no option currently active, activate the selected option or the first option.
340
- * @internal
341
- */
342
- activateNextOption(): void;
343
- /**
344
- * Activate the previous option in the list if there is one.
345
- * @internal
346
- */
347
- activatePreviousOption(): void;
348
- /**
349
- * Register the dropdown portal with the select.
350
- * @param portal The dropdown portal.
351
- * @internal
352
- */
353
- registerPortal(portal: NgpSelectPortal): void;
354
- /**
355
- * Register the dropdown with the select.
356
- * @param dropdown The dropdown to register.
357
- * @internal
358
- */
359
- registerDropdown(dropdown: NgpSelectDropdown): void;
360
- /**
361
- * Register an option with the select.
362
- * @param option The option to register.
363
- * @internal
364
- */
365
- registerOption(option: NgpSelectOption): void;
366
- /**
367
- * Unregister an option from the select.
368
- * @param option The option to unregister.
369
- * @internal
370
- */
371
- unregisterOption(option: NgpSelectOption): void;
372
- /**
373
- * Focus the select.
374
- * @internal
375
- */
376
- focus(): void;
377
- /** Handle keydown events for accessibility. */
378
- protected handleKeydown(event: KeyboardEvent): void;
379
- protected onBlur(event: FocusEvent): void;
380
- private scrollTo;
381
- private getOptionAtIndex;
382
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpSelect, never>;
383
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpSelect, "[ngpSelect]", ["ngpSelect"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "ngpSelectValue"; "required": false; "isSignal": true; }; "multiple": { "alias": "ngpSelectMultiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpSelectDisabled"; "required": false; "isSignal": true; }; "compareWith": { "alias": "ngpSelectCompareWith"; "required": false; "isSignal": true; }; "placement": { "alias": "ngpSelectDropdownPlacement"; "required": false; "isSignal": true; }; "container": { "alias": "ngpSelectDropdownContainer"; "required": false; "isSignal": true; }; "flip": { "alias": "ngpSelectDropdownFlip"; "required": false; "isSignal": true; }; "offset": { "alias": "ngpSelectDropdownOffset"; "required": false; "isSignal": true; }; "scrollToOption": { "alias": "ngpSelectScrollToOption"; "required": false; "isSignal": true; }; "allOptions": { "alias": "ngpSelectOptions"; "required": false; "isSignal": true; }; }, { "valueChange": "ngpSelectValueChange"; "openChange": "ngpSelectOpenChange"; }, never, never, true, never>;
384
- }
385
-
386
- /**
387
- * Provides the Select state.
388
- */
389
- declare const provideSelectState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
390
- /**
391
- * Injects the Select state.
392
- */
393
- declare const injectSelectState: <U = NgpSelect>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
394
-
395
- export { NgpNativeSelect, NgpSelect, NgpSelectDropdown, NgpSelectOption, NgpSelectPortal, injectNativeSelectState, injectSelectConfig, injectSelectState, provideNativeSelectState, provideSelectConfig, provideSelectState };
396
- export type { NgpSelectConfig };