@radix-ng/primitives 1.0.0-beta.2 → 1.0.0-beta.4
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.
- package/LICENSE +1 -1
- package/README.md +76 -6
- package/fesm2022/radix-ng-primitives-accordion.mjs +5 -3
- package/fesm2022/radix-ng-primitives-accordion.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-alert-dialog.mjs +31 -24
- package/fesm2022/radix-ng-primitives-alert-dialog.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-autocomplete.mjs +1744 -0
- package/fesm2022/radix-ng-primitives-autocomplete.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-calendar.mjs +5 -3
- package/fesm2022/radix-ng-primitives-calendar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-combobox.mjs +1399 -606
- package/fesm2022/radix-ng-primitives-combobox.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-config.mjs +13 -4
- package/fesm2022/radix-ng-primitives-config.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-context-menu.mjs +51 -10
- package/fesm2022/radix-ng-primitives-context-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-core.mjs +1345 -64
- package/fesm2022/radix-ng-primitives-core.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-date-field.mjs +5 -3
- package/fesm2022/radix-ng-primitives-date-field.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-dialog.mjs +271 -145
- package/fesm2022/radix-ng-primitives-dialog.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-direction-provider.mjs +70 -0
- package/fesm2022/radix-ng-primitives-direction-provider.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-dismissable-layer.mjs +519 -184
- package/fesm2022/radix-ng-primitives-dismissable-layer.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-drawer.mjs +154 -64
- package/fesm2022/radix-ng-primitives-drawer.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-field.mjs +3 -2
- package/fesm2022/radix-ng-primitives-field.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-floating-focus-manager.mjs +517 -0
- package/fesm2022/radix-ng-primitives-floating-focus-manager.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-focus-scope.mjs +296 -70
- package/fesm2022/radix-ng-primitives-focus-scope.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-menu.mjs +894 -299
- package/fesm2022/radix-ng-primitives-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-menubar.mjs +32 -4
- package/fesm2022/radix-ng-primitives-menubar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-navigation-menu.mjs +176 -207
- package/fesm2022/radix-ng-primitives-navigation-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-popover.mjs +250 -250
- package/fesm2022/radix-ng-primitives-popover.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-popper.mjs +94 -45
- package/fesm2022/radix-ng-primitives-popper.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-portal.mjs +107 -17
- package/fesm2022/radix-ng-primitives-portal.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-presence.mjs +262 -79
- package/fesm2022/radix-ng-primitives-presence.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-preview-card.mjs +172 -218
- package/fesm2022/radix-ng-primitives-preview-card.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-roving-focus.mjs +4 -2
- package/fesm2022/radix-ng-primitives-roving-focus.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-scroll-area.mjs +5 -4
- package/fesm2022/radix-ng-primitives-scroll-area.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-select.mjs +303 -234
- package/fesm2022/radix-ng-primitives-select.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-slider.mjs +5 -3
- package/fesm2022/radix-ng-primitives-slider.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-stepper.mjs +5 -3
- package/fesm2022/radix-ng-primitives-stepper.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-time-field.mjs +5 -3
- package/fesm2022/radix-ng-primitives-time-field.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toast.mjs +15 -36
- package/fesm2022/radix-ng-primitives-toast.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toggle-group.mjs +5 -3
- package/fesm2022/radix-ng-primitives-toggle-group.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toolbar.mjs +5 -3
- package/fesm2022/radix-ng-primitives-toolbar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-tooltip.mjs +105 -145
- package/fesm2022/radix-ng-primitives-tooltip.mjs.map +1 -1
- package/package.json +14 -1
- package/types/radix-ng-primitives-accordion.d.ts +4 -3
- package/types/radix-ng-primitives-alert-dialog.d.ts +17 -11
- package/types/radix-ng-primitives-autocomplete.d.ts +661 -0
- package/types/radix-ng-primitives-calendar.d.ts +5 -3
- package/types/radix-ng-primitives-combobox.d.ts +727 -293
- package/types/radix-ng-primitives-config.d.ts +1 -1
- package/types/radix-ng-primitives-context-menu.d.ts +15 -5
- package/types/radix-ng-primitives-core.d.ts +762 -14
- package/types/radix-ng-primitives-date-field.d.ts +3 -2
- package/types/radix-ng-primitives-dialog.d.ts +107 -55
- package/types/radix-ng-primitives-direction-provider.d.ts +41 -0
- package/types/radix-ng-primitives-dismissable-layer.d.ts +147 -99
- package/types/radix-ng-primitives-drawer.d.ts +49 -22
- package/types/radix-ng-primitives-field.d.ts +1 -0
- package/types/radix-ng-primitives-floating-focus-manager.d.ts +175 -0
- package/types/radix-ng-primitives-focus-scope.d.ts +132 -1
- package/types/radix-ng-primitives-menu.d.ts +204 -112
- package/types/radix-ng-primitives-navigation-menu.d.ts +61 -101
- package/types/radix-ng-primitives-popover.d.ts +82 -115
- package/types/radix-ng-primitives-popper.d.ts +46 -10
- package/types/radix-ng-primitives-portal.d.ts +53 -8
- package/types/radix-ng-primitives-presence.d.ts +98 -17
- package/types/radix-ng-primitives-preview-card.d.ts +63 -95
- package/types/radix-ng-primitives-roving-focus.d.ts +7 -6
- package/types/radix-ng-primitives-scroll-area.d.ts +2 -2
- package/types/radix-ng-primitives-select.d.ts +192 -158
- package/types/radix-ng-primitives-slider.d.ts +5 -4
- package/types/radix-ng-primitives-stepper.d.ts +4 -3
- package/types/radix-ng-primitives-time-field.d.ts +3 -2
- package/types/radix-ng-primitives-toast.d.ts +7 -7
- package/types/radix-ng-primitives-toggle-group.d.ts +5 -4
- package/types/radix-ng-primitives-toolbar.d.ts +3 -2
- package/types/radix-ng-primitives-tooltip.d.ts +48 -84
|
@@ -1,18 +1,19 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
|
-
import { InjectionToken, OutputRef, ElementRef } from '@angular/core';
|
|
2
|
+
import { InjectionToken, OutputRef, Signal, ElementRef } from '@angular/core';
|
|
3
3
|
import * as _radix_ng_primitives_core from '@radix-ng/primitives/core';
|
|
4
|
-
import { AcceptableValue, Direction, ItemValueComparator } from '@radix-ng/primitives/core';
|
|
4
|
+
import { AcceptableValue, RdxFloatingRootContext, Direction, ItemValueComparator } from '@radix-ng/primitives/core';
|
|
5
5
|
import * as _radix_ng_primitives_select from '@radix-ng/primitives/select';
|
|
6
|
+
import * as _radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager from '@radix-ng/primitives/types/radix-ng-primitives-floating-focus-manager';
|
|
6
7
|
import * as i1 from '@radix-ng/primitives/collection';
|
|
7
8
|
import { RdxCollectionItem } from '@radix-ng/primitives/collection';
|
|
8
|
-
import
|
|
9
|
-
import * as
|
|
9
|
+
import { RdxOutsidePressDomEvent } from '@radix-ng/primitives/dismissable-layer';
|
|
10
|
+
import * as i1$1 from '@radix-ng/primitives/popper';
|
|
11
|
+
import { RdxPopperContentWrapper } from '@radix-ng/primitives/popper';
|
|
12
|
+
import * as i2 from '@radix-ng/primitives/focus-scope';
|
|
10
13
|
import * as _radix_ng_primitives_types_radix_ng_primitives_core from '@radix-ng/primitives/types/radix-ng-primitives-core';
|
|
14
|
+
import { RdxInteractionType } from '@radix-ng/primitives/floating-focus-manager';
|
|
11
15
|
import * as _radix_ng_primitives_types_radix_ng_primitives_collection from '@radix-ng/primitives/types/radix-ng-primitives-collection';
|
|
12
16
|
import * as i1$2 from '@radix-ng/primitives/portal';
|
|
13
|
-
import { RdxPortalContainer } from '@radix-ng/primitives/portal';
|
|
14
|
-
import * as i1$3 from '@radix-ng/primitives/presence';
|
|
15
|
-
import * as i1$4 from '@radix-ng/primitives/popper';
|
|
16
17
|
|
|
17
18
|
declare class RdxSelectGroupLabel {
|
|
18
19
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectGroupLabel, never>;
|
|
@@ -34,12 +35,16 @@ declare class RdxSelectBackdrop {
|
|
|
34
35
|
y: number;
|
|
35
36
|
} | null>;
|
|
36
37
|
contentId: string;
|
|
37
|
-
dir: _angular_core.
|
|
38
|
+
dir: _angular_core.Signal<_radix_ng_primitives_types_radix_ng_primitives_core.Direction>;
|
|
38
39
|
value: _angular_core.ModelSignal<_radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue | _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue[] | undefined>;
|
|
39
40
|
multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
40
41
|
isItemEqualToValue: _angular_core.InputSignal<_radix_ng_primitives_types_radix_ng_primitives_core.ItemValueComparator<_radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue> | undefined>;
|
|
41
42
|
itemToStringLabel: _angular_core.InputSignal<((value: _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue) => string) | undefined>;
|
|
42
43
|
open: _angular_core.ModelSignal<boolean>;
|
|
44
|
+
openedByTouch: _angular_core.WritableSignal<boolean>;
|
|
45
|
+
openMethod: _angular_core.Signal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
46
|
+
openInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
47
|
+
closeInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
43
48
|
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
44
49
|
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
45
50
|
isEmptyModelValue: _angular_core.Signal<boolean>;
|
|
@@ -48,10 +53,10 @@ declare class RdxSelectBackdrop {
|
|
|
48
53
|
optionsSet: _angular_core.WritableSignal<Set<_radix_ng_primitives_select.SelectOption>>;
|
|
49
54
|
onOptionAdd: (option: any) => void;
|
|
50
55
|
onOptionRemove: (option: any) => void;
|
|
51
|
-
onValueChange: (value: _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue) =>
|
|
56
|
+
onValueChange: (value: _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue, reason?: _radix_ng_primitives_select.RdxSelectValueChangeReason, event?: Event) => boolean;
|
|
52
57
|
onTriggerChange: (node: any) => void;
|
|
53
58
|
onValueElementChange: (node: any) => void;
|
|
54
|
-
onOpenChange: (value:
|
|
59
|
+
onOpenChange: (value: boolean, reason?: _radix_ng_primitives_select.RdxSelectOpenChangeReason, event?: Event) => boolean;
|
|
55
60
|
};
|
|
56
61
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectBackdrop, never>;
|
|
57
62
|
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectBackdrop, "[rdxSelectBackdrop]", ["rdxSelectBackdrop"], {}, {}, never, never, true, never>;
|
|
@@ -146,12 +151,16 @@ declare class RdxSelectItemText {
|
|
|
146
151
|
y: number;
|
|
147
152
|
} | null>;
|
|
148
153
|
contentId: string;
|
|
149
|
-
dir: _angular_core.
|
|
154
|
+
dir: _angular_core.Signal<_radix_ng_primitives_types_radix_ng_primitives_core.Direction>;
|
|
150
155
|
value: _angular_core.ModelSignal<_radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue | _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue[] | undefined>;
|
|
151
156
|
multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
152
157
|
isItemEqualToValue: _angular_core.InputSignal<_radix_ng_primitives_types_radix_ng_primitives_core.ItemValueComparator<_radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue> | undefined>;
|
|
153
158
|
itemToStringLabel: _angular_core.InputSignal<((value: _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue) => string) | undefined>;
|
|
154
159
|
open: _angular_core.ModelSignal<boolean>;
|
|
160
|
+
openedByTouch: _angular_core.WritableSignal<boolean>;
|
|
161
|
+
openMethod: _angular_core.Signal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
162
|
+
openInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
163
|
+
closeInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
155
164
|
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
156
165
|
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
157
166
|
isEmptyModelValue: _angular_core.Signal<boolean>;
|
|
@@ -160,10 +169,10 @@ declare class RdxSelectItemText {
|
|
|
160
169
|
optionsSet: _angular_core.WritableSignal<Set<_radix_ng_primitives_select.SelectOption>>;
|
|
161
170
|
onOptionAdd: (option: any) => void;
|
|
162
171
|
onOptionRemove: (option: any) => void;
|
|
163
|
-
onValueChange: (value: _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue) =>
|
|
172
|
+
onValueChange: (value: _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue, reason?: _radix_ng_primitives_select.RdxSelectValueChangeReason, event?: Event) => boolean;
|
|
164
173
|
onTriggerChange: (node: any) => void;
|
|
165
174
|
onValueElementChange: (node: any) => void;
|
|
166
|
-
onOpenChange: (value:
|
|
175
|
+
onOpenChange: (value: boolean, reason?: _radix_ng_primitives_select.RdxSelectOpenChangeReason, event?: Event) => boolean;
|
|
167
176
|
};
|
|
168
177
|
readonly contentContext: {
|
|
169
178
|
content: _angular_core.WritableSignal<HTMLElement | null>;
|
|
@@ -214,7 +223,7 @@ declare const context$1: () => {
|
|
|
214
223
|
isPositioned: _angular_core.WritableSignal<boolean>;
|
|
215
224
|
selectedItem: _angular_core.WritableSignal<HTMLElement | undefined>;
|
|
216
225
|
selectedItemText: _angular_core.WritableSignal<HTMLElement | undefined>;
|
|
217
|
-
highlightedItem:
|
|
226
|
+
highlightedItem: Signal<RdxCollectionItem<unknown> | null>;
|
|
218
227
|
isHighlighted: (item: RdxCollectionItem) => boolean;
|
|
219
228
|
highlightItem: (item: RdxCollectionItem) => void;
|
|
220
229
|
isKeyboardActive: () => boolean;
|
|
@@ -231,7 +240,7 @@ declare const injectSelectPopupContext: _radix_ng_primitives_core.InjectContext<
|
|
|
231
240
|
isPositioned: _angular_core.WritableSignal<boolean>;
|
|
232
241
|
selectedItem: _angular_core.WritableSignal<HTMLElement | undefined>;
|
|
233
242
|
selectedItemText: _angular_core.WritableSignal<HTMLElement | undefined>;
|
|
234
|
-
highlightedItem:
|
|
243
|
+
highlightedItem: Signal<RdxCollectionItem<unknown> | null>;
|
|
235
244
|
isHighlighted: (item: RdxCollectionItem) => boolean;
|
|
236
245
|
highlightItem: (item: RdxCollectionItem) => void;
|
|
237
246
|
isKeyboardActive: () => boolean;
|
|
@@ -247,7 +256,7 @@ declare const provideSelectPopupContext: (useFactory: () => {
|
|
|
247
256
|
isPositioned: _angular_core.WritableSignal<boolean>;
|
|
248
257
|
selectedItem: _angular_core.WritableSignal<HTMLElement | undefined>;
|
|
249
258
|
selectedItemText: _angular_core.WritableSignal<HTMLElement | undefined>;
|
|
250
|
-
highlightedItem:
|
|
259
|
+
highlightedItem: Signal<RdxCollectionItem<unknown> | null>;
|
|
251
260
|
isHighlighted: (item: RdxCollectionItem) => boolean;
|
|
252
261
|
highlightItem: (item: RdxCollectionItem) => void;
|
|
253
262
|
isKeyboardActive: () => boolean;
|
|
@@ -259,17 +268,31 @@ declare const provideSelectPopupContext: (useFactory: () => {
|
|
|
259
268
|
}) => _angular_core.Provider;
|
|
260
269
|
interface RdxPositionerImpl {
|
|
261
270
|
placed: OutputRef<any>;
|
|
271
|
+
/**
|
|
272
|
+
* Whether **item-aligned** positioning is currently active (Base UI `alignItemWithTriggerActive`).
|
|
273
|
+
* `true` only for the item-aligned positioner while open **and not touch-opened** — a touch open
|
|
274
|
+
* falls back to a plain anchored dropdown. The popper positioner omits this (always `false`). The
|
|
275
|
+
* scroll-lock policy locks an item-aligned popup even when `modal === false` (ADR 0016 §2 / AC #3).
|
|
276
|
+
*/
|
|
277
|
+
alignItemWithTriggerActive?: Signal<boolean>;
|
|
262
278
|
}
|
|
263
279
|
declare const RDX_SELECT_POSITIONER_TOKEN: InjectionToken<RdxPositionerImpl>;
|
|
264
280
|
/**
|
|
265
281
|
* The popup listbox. Holds DOM focus while open and navigates with the highlight model
|
|
266
|
-
* (`aria-activedescendant`) — items are not individually focusable.
|
|
267
|
-
*
|
|
282
|
+
* (`aria-activedescendant`) — items are not individually focusable.
|
|
283
|
+
*
|
|
284
|
+
* Since ADR 0010 §6 the popup is the **inner** element (the positioner is its ancestor): it carries
|
|
285
|
+
* `role="listbox"`, the `contentId`, and — via the composed {@link RdxPopperContent} — the
|
|
286
|
+
* `data-side` / `data-align` attributes and the until-positioned animation guard previously held by
|
|
287
|
+
* the deleted `rdxSelectPositionerContent`. `RdxPopperContent` also makes the popup the element the
|
|
288
|
+
* `RdxPopperContentWrapper` ancestor reads its content z-index from. In item-aligned mode there is no
|
|
289
|
+
* wrapper, so `RdxPopperContent` no-ops.
|
|
268
290
|
*
|
|
269
291
|
* @group Components
|
|
270
292
|
*/
|
|
271
293
|
declare class RdxSelectPopup {
|
|
272
|
-
private readonly
|
|
294
|
+
private readonly floatingContext;
|
|
295
|
+
private readonly registration;
|
|
273
296
|
private readonly currentElement;
|
|
274
297
|
private readonly collection;
|
|
275
298
|
private readonly injector;
|
|
@@ -281,26 +304,40 @@ declare class RdxSelectPopup {
|
|
|
281
304
|
y: number;
|
|
282
305
|
} | null>;
|
|
283
306
|
contentId: string;
|
|
284
|
-
dir:
|
|
307
|
+
dir: Signal<_radix_ng_primitives_core.Direction>;
|
|
285
308
|
value: _angular_core.ModelSignal<AcceptableValue | AcceptableValue[] | undefined>;
|
|
286
309
|
multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
287
310
|
isItemEqualToValue: _angular_core.InputSignal<_radix_ng_primitives_core.ItemValueComparator<AcceptableValue> | undefined>;
|
|
288
311
|
itemToStringLabel: _angular_core.InputSignal<((value: AcceptableValue) => string) | undefined>;
|
|
289
312
|
open: _angular_core.ModelSignal<boolean>;
|
|
313
|
+
openedByTouch: _angular_core.WritableSignal<boolean>;
|
|
314
|
+
openMethod: Signal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
315
|
+
openInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
316
|
+
closeInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
290
317
|
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
291
318
|
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
292
|
-
isEmptyModelValue:
|
|
293
|
-
transitionStatus:
|
|
319
|
+
isEmptyModelValue: Signal<boolean>;
|
|
320
|
+
transitionStatus: Signal<_radix_ng_primitives_core.RdxTransitionStatus>;
|
|
294
321
|
registerTransitionElement: (element: HTMLElement) => () => void;
|
|
295
322
|
optionsSet: _angular_core.WritableSignal<Set<_radix_ng_primitives_select.SelectOption>>;
|
|
296
323
|
onOptionAdd: (option: any) => void;
|
|
297
324
|
onOptionRemove: (option: any) => void;
|
|
298
|
-
onValueChange: (value: AcceptableValue) =>
|
|
325
|
+
onValueChange: (value: AcceptableValue, reason?: _radix_ng_primitives_select.RdxSelectValueChangeReason, event?: Event) => boolean;
|
|
299
326
|
onTriggerChange: (node: any) => void;
|
|
300
327
|
onValueElementChange: (node: any) => void;
|
|
301
|
-
onOpenChange: (value:
|
|
328
|
+
onOpenChange: (value: boolean, reason?: _radix_ng_primitives_select.RdxSelectOpenChangeReason, event?: Event) => boolean;
|
|
302
329
|
};
|
|
303
|
-
/**
|
|
330
|
+
/**
|
|
331
|
+
* The collected items (DOM order). Exposed so the `item-aligned` positioner — now the popup's
|
|
332
|
+
* **ancestor** — can read them without injecting {@link RdxCollectionProvider} (which the popup
|
|
333
|
+
* provides as a descendant, so an upward `inject` would not find it).
|
|
334
|
+
*/
|
|
335
|
+
readonly items: Signal<readonly RdxCollectionItem<any>[]>;
|
|
336
|
+
/**
|
|
337
|
+
* Highlight-model navigation over the collected items (DOM order). `loop` is disabled so arrow
|
|
338
|
+
* navigation stops at the first / last item instead of wrapping around — matching native
|
|
339
|
+
* `<select>` behavior.
|
|
340
|
+
*/
|
|
304
341
|
readonly highlight: _radix_ng_primitives_core.ListHighlight<RdxCollectionItem<unknown>>;
|
|
305
342
|
readonly selectedItem: _angular_core.WritableSignal<HTMLElement | undefined>;
|
|
306
343
|
readonly selectedItemText: _angular_core.WritableSignal<HTMLElement | undefined>;
|
|
@@ -312,14 +349,19 @@ declare class RdxSelectPopup {
|
|
|
312
349
|
* Event handler called when the escape key is down.
|
|
313
350
|
* Can be prevented.
|
|
314
351
|
*/
|
|
315
|
-
readonly escapeKeyDown:
|
|
352
|
+
readonly escapeKeyDown: _angular_core.OutputEmitterRef<KeyboardEvent>;
|
|
316
353
|
/**
|
|
317
|
-
* Event handler called when a `pointerdown` event happens outside of the
|
|
354
|
+
* Event handler called when a `pointerdown` event happens outside of the popup.
|
|
318
355
|
* Can be prevented.
|
|
319
356
|
*/
|
|
320
|
-
readonly pointerDownOutside:
|
|
357
|
+
readonly pointerDownOutside: _angular_core.OutputEmitterRef<RdxOutsidePressDomEvent>;
|
|
321
358
|
readonly content: _angular_core.WritableSignal<HTMLElement | null>;
|
|
322
|
-
|
|
359
|
+
/**
|
|
360
|
+
* The positioner — now an **ancestor** element — provides {@link RDX_SELECT_POSITIONER_TOKEN}
|
|
361
|
+
* (Popper or item-aligned). We react to its `placed` to highlight and scroll the selected item
|
|
362
|
+
* into view and flag the popup as positioned.
|
|
363
|
+
*/
|
|
364
|
+
private readonly positioner;
|
|
323
365
|
constructor();
|
|
324
366
|
/** Highlights the selected item (or the first enabled one) when the popup opens. */
|
|
325
367
|
highlightSelectedItem(): void;
|
|
@@ -328,112 +370,49 @@ declare class RdxSelectPopup {
|
|
|
328
370
|
isKeyboardActive(): boolean;
|
|
329
371
|
handleKeyDown(event: Event): void;
|
|
330
372
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectPopup, never>;
|
|
331
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectPopup, "[rdxSelectPopup]", never, {}, { "escapeKeyDown": "escapeKeyDown"; "pointerDownOutside": "pointerDownOutside"; },
|
|
373
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectPopup, "[rdxSelectPopup]", never, {}, { "escapeKeyDown": "escapeKeyDown"; "pointerDownOutside": "pointerDownOutside"; }, never, never, true, [{ directive: typeof i1$1.RdxPopperContent; inputs: {}; outputs: {}; }, { directive: typeof i2.RdxFocusScope; inputs: {}; outputs: {}; }, { directive: typeof _radix_ng_primitives_core.RdxFloatingNodeRegistration; inputs: {}; outputs: {}; }, { directive: typeof i1.RdxCollectionProvider; inputs: {}; outputs: {}; }]>;
|
|
332
374
|
}
|
|
333
375
|
|
|
376
|
+
/**
|
|
377
|
+
* Structural directive that teleports the select popup into a container (default `document.body`)
|
|
378
|
+
* while the select is open, and keeps it mounted until any CSS exit `@keyframes` finishes.
|
|
379
|
+
*
|
|
380
|
+
* Apply it with the `*` microsyntax on the popup — `<div *rdxSelectPortal rdxSelectPopup>` — or as an
|
|
381
|
+
* explicit `<ng-template rdxSelectPortal>`. For a custom container use the explicit form with
|
|
382
|
+
* `[container]`. Unlike the previous attribute portal it no longer parks an empty wrapper `<div>` in
|
|
383
|
+
* `document.body` while the select is closed.
|
|
384
|
+
*/
|
|
334
385
|
declare class RdxSelectPortal {
|
|
335
|
-
/**
|
|
336
|
-
* Optional container to portal the content into. Defaults to `document.body` when not set.
|
|
337
|
-
*/
|
|
338
|
-
readonly container: _angular_core.InputSignal<RdxPortalContainer | undefined>;
|
|
339
386
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectPortal, never>;
|
|
340
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectPortal, "[rdxSelectPortal]",
|
|
341
|
-
}
|
|
342
|
-
|
|
343
|
-
declare class RdxSelectPortalPresence {
|
|
344
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectPortalPresence, never>;
|
|
345
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectPortalPresence, "ng-template[rdxSelectPortalPresence]", never, {}, {}, never, never, true, [{ directive: typeof i1$3.RdxPresenceDirective; inputs: {}; outputs: {}; }]>;
|
|
387
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectPortal, "ng-template[rdxSelectPortal]", ["rdxSelectPortal"], {}, {}, never, never, true, [{ directive: typeof i1$2.RdxPortalPresence; inputs: { "container": "container"; }; outputs: {}; }]>;
|
|
346
388
|
}
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
*/
|
|
357
|
-
readonly sideOffset: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
358
|
-
/**
|
|
359
|
-
* The preferred alignment against the anchor. May change when collisions occur.
|
|
360
|
-
*/
|
|
361
|
-
readonly align: _angular_core.InputSignal<"center" | "end" | "start">;
|
|
362
|
-
/**
|
|
363
|
-
* An offset in pixels from the `start` or `end` alignment options.
|
|
364
|
-
*/
|
|
365
|
-
readonly alignOffset: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
366
|
-
/**
|
|
367
|
-
* The padding between the arrow and the edges of the content.
|
|
368
|
-
* If your content has border-radius, this will prevent it from overflowing the corners.
|
|
369
|
-
*/
|
|
370
|
-
readonly arrowPadding: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
371
|
-
/**
|
|
372
|
-
* When `true`, overrides the `side` and `align` preferences to prevent collisions with boundary edges.
|
|
373
|
-
*/
|
|
374
|
-
readonly avoidCollisions: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
375
|
-
/**
|
|
376
|
-
* The element used as the collision boundary.
|
|
377
|
-
* By default this is the viewport, though you can provide additional element(s) to be included in this check.
|
|
378
|
-
*/
|
|
379
|
-
readonly collisionBoundary: _angular_core.InputSignal<ElementRef<HTMLElement> | ElementRef<HTMLElement>[] | undefined>;
|
|
380
|
-
/**
|
|
381
|
-
* The distance in pixels from the boundary edges where collision detection should occur.
|
|
382
|
-
* Accepts a number (same for all sides), or a partial padding object, for example: `{ top: 20, left: 20 }`.
|
|
383
|
-
*/
|
|
384
|
-
readonly collisionPadding: _angular_core.InputSignal<number | Partial<Record<"top" | "right" | "bottom" | "left", number>>>;
|
|
385
|
-
/**
|
|
386
|
-
* The sticky behavior on the `align` axis.
|
|
387
|
-
* - `partial` will keep the content in the boundary as long as the trigger is at least partially in the boundary
|
|
388
|
-
* - `always` will keep the content in the boundary regardless.
|
|
389
|
-
*/
|
|
390
|
-
readonly sticky: _angular_core.InputSignal<"partial" | "always">;
|
|
391
|
-
/**
|
|
392
|
-
* Whether to hide the content when the trigger becomes fully occluded.
|
|
393
|
-
*/
|
|
394
|
-
readonly hideWhenDetached: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
395
|
-
/**
|
|
396
|
-
* Whether to update the position of the floating element on every animation frame if required.
|
|
397
|
-
*/
|
|
398
|
-
readonly updatePositionStrategy: _angular_core.InputSignal<"always" | "optimized">;
|
|
399
|
-
/**
|
|
400
|
-
* Emits when the element is placed.
|
|
401
|
-
*/
|
|
402
|
-
readonly placed: _angular_core.OutputRef<void>;
|
|
403
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectPositioner, never>;
|
|
404
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectPositioner, "[rdxSelectPositioner]", never, { "side": { "alias": "side"; "required": false; "isSignal": true; }; "sideOffset": { "alias": "sideOffset"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "alignOffset": { "alias": "alignOffset"; "required": false; "isSignal": true; }; "arrowPadding": { "alias": "arrowPadding"; "required": false; "isSignal": true; }; "avoidCollisions": { "alias": "avoidCollisions"; "required": false; "isSignal": true; }; "collisionBoundary": { "alias": "collisionBoundary"; "required": false; "isSignal": true; }; "collisionPadding": { "alias": "collisionPadding"; "required": false; "isSignal": true; }; "sticky": { "alias": "sticky"; "required": false; "isSignal": true; }; "hideWhenDetached": { "alias": "hideWhenDetached"; "required": false; "isSignal": true; }; "updatePositionStrategy": { "alias": "updatePositionStrategy"; "required": false; "isSignal": true; }; }, { "placed": "placed"; }, never, never, true, [{ directive: typeof i1$4.RdxPopperContentWrapper; inputs: { "side": "side"; "sideOffset": "sideOffset"; "align": "align"; "alignOffset": "alignOffset"; "arrowPadding": "arrowPadding"; "avoidCollisions": "avoidCollisions"; "collisionBoundary": "collisionBoundary"; "collisionPadding": "collisionPadding"; "sticky": "sticky"; "hideWhenDetached": "hideWhenDetached"; "updatePositionStrategy": "updatePositionStrategy"; }; outputs: {}; }]>;
|
|
389
|
+
/**
|
|
390
|
+
* Dev-mode guard: `rdxSelectPortal` used to be an attribute directive on a `<div>`. It is now
|
|
391
|
+
* structural, so the old `<div rdxSelectPortal>` markup would silently stop portaling — fail loudly
|
|
392
|
+
* instead.
|
|
393
|
+
*/
|
|
394
|
+
declare class RdxSelectPortalMisuseGuard {
|
|
395
|
+
constructor();
|
|
396
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectPortalMisuseGuard, never>;
|
|
397
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectPortalMisuseGuard, "[rdxSelectPortal]:not(ng-template)", never, {}, {}, never, never, true, never>;
|
|
405
398
|
}
|
|
406
399
|
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
isItemEqualToValue: _angular_core.InputSignal<_radix_ng_primitives_types_radix_ng_primitives_core.ItemValueComparator<_radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue> | undefined>;
|
|
420
|
-
itemToStringLabel: _angular_core.InputSignal<((value: _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue) => string) | undefined>;
|
|
421
|
-
open: _angular_core.ModelSignal<boolean>;
|
|
422
|
-
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
423
|
-
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
424
|
-
isEmptyModelValue: _angular_core.Signal<boolean>;
|
|
425
|
-
transitionStatus: _angular_core.Signal<_radix_ng_primitives_types_radix_ng_primitives_core.RdxTransitionStatus>;
|
|
426
|
-
registerTransitionElement: (element: HTMLElement) => () => void;
|
|
427
|
-
optionsSet: _angular_core.WritableSignal<Set<_radix_ng_primitives_select.SelectOption>>;
|
|
428
|
-
onOptionAdd: (option: any) => void;
|
|
429
|
-
onOptionRemove: (option: any) => void;
|
|
430
|
-
onValueChange: (value: _radix_ng_primitives_types_radix_ng_primitives_core.AcceptableValue) => void;
|
|
431
|
-
onTriggerChange: (node: any) => void;
|
|
432
|
-
onValueElementChange: (node: any) => void;
|
|
433
|
-
onOpenChange: (value: any) => void;
|
|
400
|
+
/**
|
|
401
|
+
* Positions the select popup against the trigger using the popper engine.
|
|
402
|
+
*
|
|
403
|
+
* A "thin" positioner (ADR 0012): it inherits the full popper positioning surface — the inputs
|
|
404
|
+
* (`side`, `sideOffset`, `align`, …), the `placed` output, and the host bindings — from
|
|
405
|
+
* {@link RdxPopperContentWrapper}, and declares select's Base UI-aligned defaults via the config
|
|
406
|
+
* provider. It also satisfies {@link RdxPositionerImpl} (via the inherited `placed`) so the popup can
|
|
407
|
+
* resolve it through {@link RDX_SELECT_POSITIONER_TOKEN}, the same as the item-aligned positioner.
|
|
408
|
+
*/
|
|
409
|
+
declare class RdxSelectPositioner extends RdxPopperContentWrapper implements RdxPositionerImpl {
|
|
410
|
+
protected readonly positionerStyle: {
|
|
411
|
+
boxSizing: string;
|
|
434
412
|
};
|
|
435
|
-
|
|
436
|
-
static
|
|
413
|
+
constructor();
|
|
414
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectPositioner, never>;
|
|
415
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectPositioner, "[rdxSelectPositioner]", never, {}, {}, never, never, true, never>;
|
|
437
416
|
}
|
|
438
417
|
|
|
439
418
|
interface SelectOption {
|
|
@@ -441,6 +420,25 @@ interface SelectOption {
|
|
|
441
420
|
disabled?: boolean;
|
|
442
421
|
textContent: string;
|
|
443
422
|
}
|
|
423
|
+
type RdxSelectOpenMethod = RdxInteractionType;
|
|
424
|
+
type RdxSelectOpenChangeReason = 'trigger-press' | 'item-press' | 'outside-press' | 'escape-key' | 'window-resize' | 'focus-out' | 'list-navigation' | 'cancel-open' | 'none';
|
|
425
|
+
type RdxSelectValueChangeReason = RdxSelectOpenChangeReason;
|
|
426
|
+
interface RdxSelectChangeEventDetails<Reason extends string = string> {
|
|
427
|
+
reason: Reason;
|
|
428
|
+
event: Event;
|
|
429
|
+
cancel: () => void;
|
|
430
|
+
isCanceled: () => boolean;
|
|
431
|
+
}
|
|
432
|
+
type RdxSelectOpenChangeEventDetails = RdxSelectChangeEventDetails<RdxSelectOpenChangeReason>;
|
|
433
|
+
interface RdxSelectOpenChangeEvent {
|
|
434
|
+
open: boolean;
|
|
435
|
+
eventDetails: RdxSelectOpenChangeEventDetails;
|
|
436
|
+
}
|
|
437
|
+
type RdxSelectValueChangeEventDetails = RdxSelectChangeEventDetails<RdxSelectValueChangeReason>;
|
|
438
|
+
interface RdxSelectValueChangeEvent {
|
|
439
|
+
value: AcceptableValue | AcceptableValue[];
|
|
440
|
+
eventDetails: RdxSelectValueChangeEventDetails;
|
|
441
|
+
}
|
|
444
442
|
declare const context: () => {
|
|
445
443
|
triggerElement: _angular_core.WritableSignal<HTMLElement | null>;
|
|
446
444
|
valueElement: _angular_core.WritableSignal<HTMLElement | null>;
|
|
@@ -449,24 +447,28 @@ declare const context: () => {
|
|
|
449
447
|
y: number;
|
|
450
448
|
} | null>;
|
|
451
449
|
contentId: string;
|
|
452
|
-
dir:
|
|
450
|
+
dir: Signal<Direction>;
|
|
453
451
|
value: _angular_core.ModelSignal<AcceptableValue | AcceptableValue[] | undefined>;
|
|
454
452
|
multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
455
453
|
isItemEqualToValue: _angular_core.InputSignal<ItemValueComparator<AcceptableValue> | undefined>;
|
|
456
454
|
itemToStringLabel: _angular_core.InputSignal<((value: AcceptableValue) => string) | undefined>;
|
|
457
455
|
open: _angular_core.ModelSignal<boolean>;
|
|
456
|
+
openedByTouch: _angular_core.WritableSignal<boolean>;
|
|
457
|
+
openMethod: Signal<RdxInteractionType>;
|
|
458
|
+
openInteractionType: _angular_core.WritableSignal<RdxInteractionType>;
|
|
459
|
+
closeInteractionType: _angular_core.WritableSignal<RdxInteractionType>;
|
|
458
460
|
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
459
461
|
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
460
|
-
isEmptyModelValue:
|
|
461
|
-
transitionStatus:
|
|
462
|
+
isEmptyModelValue: Signal<boolean>;
|
|
463
|
+
transitionStatus: Signal<_radix_ng_primitives_core.RdxTransitionStatus>;
|
|
462
464
|
registerTransitionElement: (element: HTMLElement) => () => void;
|
|
463
465
|
optionsSet: _angular_core.WritableSignal<Set<SelectOption>>;
|
|
464
466
|
onOptionAdd: (option: any) => void;
|
|
465
467
|
onOptionRemove: (option: any) => void;
|
|
466
|
-
onValueChange: (value: AcceptableValue) =>
|
|
468
|
+
onValueChange: (value: AcceptableValue, reason?: RdxSelectValueChangeReason, event?: Event) => boolean;
|
|
467
469
|
onTriggerChange: (node: any) => void;
|
|
468
470
|
onValueElementChange: (node: any) => void;
|
|
469
|
-
onOpenChange: (value:
|
|
471
|
+
onOpenChange: (value: boolean, reason?: RdxSelectOpenChangeReason, event?: Event) => boolean;
|
|
470
472
|
};
|
|
471
473
|
type RdxSelectRootContext = ReturnType<typeof context>;
|
|
472
474
|
declare const injectSelectRootContext: _radix_ng_primitives_core.InjectContext<{
|
|
@@ -477,24 +479,28 @@ declare const injectSelectRootContext: _radix_ng_primitives_core.InjectContext<{
|
|
|
477
479
|
y: number;
|
|
478
480
|
} | null>;
|
|
479
481
|
contentId: string;
|
|
480
|
-
dir:
|
|
482
|
+
dir: Signal<Direction>;
|
|
481
483
|
value: _angular_core.ModelSignal<AcceptableValue | AcceptableValue[] | undefined>;
|
|
482
484
|
multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
483
485
|
isItemEqualToValue: _angular_core.InputSignal<ItemValueComparator<AcceptableValue> | undefined>;
|
|
484
486
|
itemToStringLabel: _angular_core.InputSignal<((value: AcceptableValue) => string) | undefined>;
|
|
485
487
|
open: _angular_core.ModelSignal<boolean>;
|
|
488
|
+
openedByTouch: _angular_core.WritableSignal<boolean>;
|
|
489
|
+
openMethod: Signal<RdxInteractionType>;
|
|
490
|
+
openInteractionType: _angular_core.WritableSignal<RdxInteractionType>;
|
|
491
|
+
closeInteractionType: _angular_core.WritableSignal<RdxInteractionType>;
|
|
486
492
|
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
487
493
|
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
488
|
-
isEmptyModelValue:
|
|
489
|
-
transitionStatus:
|
|
494
|
+
isEmptyModelValue: Signal<boolean>;
|
|
495
|
+
transitionStatus: Signal<_radix_ng_primitives_core.RdxTransitionStatus>;
|
|
490
496
|
registerTransitionElement: (element: HTMLElement) => () => void;
|
|
491
497
|
optionsSet: _angular_core.WritableSignal<Set<SelectOption>>;
|
|
492
498
|
onOptionAdd: (option: any) => void;
|
|
493
499
|
onOptionRemove: (option: any) => void;
|
|
494
|
-
onValueChange: (value: AcceptableValue) =>
|
|
500
|
+
onValueChange: (value: AcceptableValue, reason?: RdxSelectValueChangeReason, event?: Event) => boolean;
|
|
495
501
|
onTriggerChange: (node: any) => void;
|
|
496
502
|
onValueElementChange: (node: any) => void;
|
|
497
|
-
onOpenChange: (value:
|
|
503
|
+
onOpenChange: (value: boolean, reason?: RdxSelectOpenChangeReason, event?: Event) => boolean;
|
|
498
504
|
}>;
|
|
499
505
|
declare const provideSelectRootContext: (useFactory: () => {
|
|
500
506
|
triggerElement: _angular_core.WritableSignal<HTMLElement | null>;
|
|
@@ -504,48 +510,67 @@ declare const provideSelectRootContext: (useFactory: () => {
|
|
|
504
510
|
y: number;
|
|
505
511
|
} | null>;
|
|
506
512
|
contentId: string;
|
|
507
|
-
dir:
|
|
513
|
+
dir: Signal<Direction>;
|
|
508
514
|
value: _angular_core.ModelSignal<AcceptableValue | AcceptableValue[] | undefined>;
|
|
509
515
|
multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
510
516
|
isItemEqualToValue: _angular_core.InputSignal<ItemValueComparator<AcceptableValue> | undefined>;
|
|
511
517
|
itemToStringLabel: _angular_core.InputSignal<((value: AcceptableValue) => string) | undefined>;
|
|
512
518
|
open: _angular_core.ModelSignal<boolean>;
|
|
519
|
+
openedByTouch: _angular_core.WritableSignal<boolean>;
|
|
520
|
+
openMethod: Signal<RdxInteractionType>;
|
|
521
|
+
openInteractionType: _angular_core.WritableSignal<RdxInteractionType>;
|
|
522
|
+
closeInteractionType: _angular_core.WritableSignal<RdxInteractionType>;
|
|
513
523
|
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
514
524
|
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
515
|
-
isEmptyModelValue:
|
|
516
|
-
transitionStatus:
|
|
525
|
+
isEmptyModelValue: Signal<boolean>;
|
|
526
|
+
transitionStatus: Signal<_radix_ng_primitives_core.RdxTransitionStatus>;
|
|
517
527
|
registerTransitionElement: (element: HTMLElement) => () => void;
|
|
518
528
|
optionsSet: _angular_core.WritableSignal<Set<SelectOption>>;
|
|
519
529
|
onOptionAdd: (option: any) => void;
|
|
520
530
|
onOptionRemove: (option: any) => void;
|
|
521
|
-
onValueChange: (value: AcceptableValue) =>
|
|
531
|
+
onValueChange: (value: AcceptableValue, reason?: RdxSelectValueChangeReason, event?: Event) => boolean;
|
|
522
532
|
onTriggerChange: (node: any) => void;
|
|
523
533
|
onValueElementChange: (node: any) => void;
|
|
524
|
-
onOpenChange: (value:
|
|
534
|
+
onOpenChange: (value: boolean, reason?: RdxSelectOpenChangeReason, event?: Event) => boolean;
|
|
525
535
|
}) => _angular_core.Provider;
|
|
526
536
|
declare class RdxSelectRoot {
|
|
527
537
|
readonly open: _angular_core.ModelSignal<boolean>;
|
|
538
|
+
/** Whether the current open was initiated by **touch** (ADR 0016 §3 — gates the anchored scroll lock). */
|
|
539
|
+
readonly openedByTouch: _angular_core.WritableSignal<boolean>;
|
|
540
|
+
/** How the select was opened. Base UI names this state `openMethod`. */
|
|
541
|
+
readonly openInteractionType: _angular_core.WritableSignal<RdxInteractionType>;
|
|
542
|
+
/** How the select was closed. */
|
|
543
|
+
readonly closeInteractionType: _angular_core.WritableSignal<RdxInteractionType>;
|
|
544
|
+
/** Public Base UI-aligned alias for the open interaction type. */
|
|
545
|
+
readonly openMethod: Signal<RdxSelectOpenMethod>;
|
|
546
|
+
/** Per-popup floating root context (ADR 0015) — `open` / `triggers` / reference for the dismissal engine. */
|
|
547
|
+
readonly floatingContext: RdxFloatingRootContext;
|
|
528
548
|
readonly value: _angular_core.ModelSignal<AcceptableValue | AcceptableValue[] | undefined>;
|
|
529
549
|
readonly multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
530
550
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
531
551
|
/** Whether the popup is modal: locks page scroll and makes outside content inert while open. */
|
|
532
552
|
readonly modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
533
|
-
readonly
|
|
553
|
+
readonly dirInput: _angular_core.InputSignal<Direction | undefined>;
|
|
554
|
+
readonly dir: Signal<Direction>;
|
|
534
555
|
/** How item values are compared for equality — a function `(a, b) => boolean` or an object key. */
|
|
535
556
|
readonly isItemEqualToValue: _angular_core.InputSignal<ItemValueComparator<AcceptableValue> | undefined>;
|
|
536
557
|
/** Converts a value to its display label (used by `RdxSelectValue`). */
|
|
537
558
|
readonly itemToStringLabel: _angular_core.InputSignal<((value: AcceptableValue) => string) | undefined>;
|
|
559
|
+
/** Emits before an open-state change is committed; call `eventDetails.cancel()` to veto it. */
|
|
560
|
+
readonly onOpenChange: _angular_core.OutputEmitterRef<RdxSelectOpenChangeEvent>;
|
|
561
|
+
/** Emits before a value change is committed; call `eventDetails.cancel()` to veto it. */
|
|
562
|
+
readonly onValueChange: _angular_core.OutputEmitterRef<RdxSelectValueChangeEvent>;
|
|
538
563
|
/** Emits after the open/close transition (including any exit animation) finishes. */
|
|
539
564
|
readonly onOpenChangeComplete: _angular_core.OutputEmitterRef<boolean>;
|
|
540
565
|
private readonly transition;
|
|
541
566
|
/** Open/close transition phase, for `data-starting-style` / `data-ending-style`. */
|
|
542
|
-
readonly transitionStatus:
|
|
567
|
+
readonly transitionStatus: Signal<_radix_ng_primitives_core.RdxTransitionStatus>;
|
|
543
568
|
/** Registers the popup element whose animation determines transition completion. */
|
|
544
569
|
readonly registerTransitionElement: (element: HTMLElement) => () => void;
|
|
545
|
-
readonly isEmptyModelValue:
|
|
570
|
+
readonly isEmptyModelValue: Signal<boolean>;
|
|
546
571
|
constructor();
|
|
547
572
|
readonly optionsSet: _angular_core.WritableSignal<Set<SelectOption>>;
|
|
548
|
-
readonly nativeSelectKey:
|
|
573
|
+
readonly nativeSelectKey: Signal<string>;
|
|
549
574
|
readonly triggerElement: _angular_core.WritableSignal<HTMLElement | null>;
|
|
550
575
|
readonly valueElement: _angular_core.WritableSignal<HTMLElement | null>;
|
|
551
576
|
readonly triggerPointerDownPosRef: _angular_core.WritableSignal<{
|
|
@@ -553,9 +578,10 @@ declare class RdxSelectRoot {
|
|
|
553
578
|
y: number;
|
|
554
579
|
} | null>;
|
|
555
580
|
getOption(value: SelectOption['value']): SelectOption | undefined;
|
|
556
|
-
|
|
581
|
+
setValue(value: AcceptableValue, reason?: RdxSelectValueChangeReason, event?: Event): boolean;
|
|
582
|
+
setOpen(open: boolean, reason?: RdxSelectOpenChangeReason, event?: Event): boolean;
|
|
557
583
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectRoot, never>;
|
|
558
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectRoot, "[rdxSelectRoot]", ["rdxSelectRoot"], { "open": { "alias": "open"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "modal": { "alias": "modal"; "required": false; "isSignal": true; }; "
|
|
584
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectRoot, "[rdxSelectRoot]", ["rdxSelectRoot"], { "open": { "alias": "open"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "modal": { "alias": "modal"; "required": false; "isSignal": true; }; "dirInput": { "alias": "dir"; "required": false; "isSignal": true; }; "isItemEqualToValue": { "alias": "isItemEqualToValue"; "required": false; "isSignal": true; }; "itemToStringLabel": { "alias": "itemToStringLabel"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "value": "valueChange"; "onOpenChange": "onOpenChange"; "onValueChange": "onValueChange"; "onOpenChangeComplete": "onOpenChangeComplete"; }, never, never, true, [{ directive: typeof i1$1.RdxPopper; inputs: {}; outputs: {}; }]>;
|
|
559
585
|
}
|
|
560
586
|
|
|
561
587
|
/**
|
|
@@ -577,12 +603,16 @@ declare class RdxSelectTrigger {
|
|
|
577
603
|
y: number;
|
|
578
604
|
} | null>;
|
|
579
605
|
contentId: string;
|
|
580
|
-
dir: _angular_core.
|
|
606
|
+
dir: _angular_core.Signal<_radix_ng_primitives_core.Direction>;
|
|
581
607
|
value: _angular_core.ModelSignal<_radix_ng_primitives_core.AcceptableValue | _radix_ng_primitives_core.AcceptableValue[] | undefined>;
|
|
582
608
|
multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
583
609
|
isItemEqualToValue: _angular_core.InputSignal<_radix_ng_primitives_core.ItemValueComparator<_radix_ng_primitives_core.AcceptableValue> | undefined>;
|
|
584
610
|
itemToStringLabel: _angular_core.InputSignal<((value: _radix_ng_primitives_core.AcceptableValue) => string) | undefined>;
|
|
585
611
|
open: _angular_core.ModelSignal<boolean>;
|
|
612
|
+
openedByTouch: _angular_core.WritableSignal<boolean>;
|
|
613
|
+
openMethod: _angular_core.Signal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
614
|
+
openInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
615
|
+
closeInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
586
616
|
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
587
617
|
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
588
618
|
isEmptyModelValue: _angular_core.Signal<boolean>;
|
|
@@ -591,10 +621,10 @@ declare class RdxSelectTrigger {
|
|
|
591
621
|
optionsSet: _angular_core.WritableSignal<Set<_radix_ng_primitives_select.SelectOption>>;
|
|
592
622
|
onOptionAdd: (option: any) => void;
|
|
593
623
|
onOptionRemove: (option: any) => void;
|
|
594
|
-
onValueChange: (value: _radix_ng_primitives_core.AcceptableValue) =>
|
|
624
|
+
onValueChange: (value: _radix_ng_primitives_core.AcceptableValue, reason?: _radix_ng_primitives_select.RdxSelectValueChangeReason, event?: Event) => boolean;
|
|
595
625
|
onTriggerChange: (node: any) => void;
|
|
596
626
|
onValueElementChange: (node: any) => void;
|
|
597
|
-
onOpenChange: (value:
|
|
627
|
+
onOpenChange: (value: boolean, reason?: _radix_ng_primitives_select.RdxSelectOpenChangeReason, event?: Event) => boolean;
|
|
598
628
|
};
|
|
599
629
|
readonly elementRef: ElementRef<HTMLElement>;
|
|
600
630
|
private readonly fieldRootContext;
|
|
@@ -608,7 +638,7 @@ declare class RdxSelectTrigger {
|
|
|
608
638
|
protected readonly focusedState: _angular_core.Signal<boolean>;
|
|
609
639
|
protected readonly describedBy: _angular_core.Signal<string | undefined>;
|
|
610
640
|
constructor();
|
|
611
|
-
handleOpen():
|
|
641
|
+
handleOpen(reason: 'trigger-press' | 'list-navigation', event: Event): boolean;
|
|
612
642
|
handlePointerOpen(event: Event): void;
|
|
613
643
|
onClickHandler(event: Event): void;
|
|
614
644
|
onPointerDown(event: Event): void;
|
|
@@ -618,7 +648,7 @@ declare class RdxSelectTrigger {
|
|
|
618
648
|
onBlur(): void;
|
|
619
649
|
protected readonly dataAttr: (value: boolean) => "" | undefined;
|
|
620
650
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSelectTrigger, never>;
|
|
621
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectTrigger, "button[rdxSelectTrigger]", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$
|
|
651
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSelectTrigger, "button[rdxSelectTrigger]", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$1.RdxPopperAnchor; inputs: {}; outputs: {}; }]>;
|
|
622
652
|
}
|
|
623
653
|
|
|
624
654
|
declare class RdxSelectValue {
|
|
@@ -630,12 +660,16 @@ declare class RdxSelectValue {
|
|
|
630
660
|
y: number;
|
|
631
661
|
} | null>;
|
|
632
662
|
contentId: string;
|
|
633
|
-
dir: _angular_core.
|
|
663
|
+
dir: _angular_core.Signal<_radix_ng_primitives_core.Direction>;
|
|
634
664
|
value: _angular_core.ModelSignal<AcceptableValue | AcceptableValue[] | undefined>;
|
|
635
665
|
multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
636
666
|
isItemEqualToValue: _angular_core.InputSignal<_radix_ng_primitives_core.ItemValueComparator<AcceptableValue> | undefined>;
|
|
637
667
|
itemToStringLabel: _angular_core.InputSignal<((value: AcceptableValue) => string) | undefined>;
|
|
638
668
|
open: _angular_core.ModelSignal<boolean>;
|
|
669
|
+
openedByTouch: _angular_core.WritableSignal<boolean>;
|
|
670
|
+
openMethod: _angular_core.Signal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
671
|
+
openInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
672
|
+
closeInteractionType: _angular_core.WritableSignal<_radix_ng_primitives_types_radix_ng_primitives_floating_focus_manager.RdxInteractionType>;
|
|
639
673
|
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
640
674
|
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
641
675
|
isEmptyModelValue: _angular_core.Signal<boolean>;
|
|
@@ -644,10 +678,10 @@ declare class RdxSelectValue {
|
|
|
644
678
|
optionsSet: _angular_core.WritableSignal<Set<_radix_ng_primitives_select.SelectOption>>;
|
|
645
679
|
onOptionAdd: (option: any) => void;
|
|
646
680
|
onOptionRemove: (option: any) => void;
|
|
647
|
-
onValueChange: (value: AcceptableValue) =>
|
|
681
|
+
onValueChange: (value: AcceptableValue, reason?: _radix_ng_primitives_select.RdxSelectValueChangeReason, event?: Event) => boolean;
|
|
648
682
|
onTriggerChange: (node: any) => void;
|
|
649
683
|
onValueElementChange: (node: any) => void;
|
|
650
|
-
onOpenChange: (value:
|
|
684
|
+
onOpenChange: (value: boolean, reason?: _radix_ng_primitives_select.RdxSelectOpenChangeReason, event?: Event) => boolean;
|
|
651
685
|
};
|
|
652
686
|
readonly elementRef: ElementRef<HTMLElement>;
|
|
653
687
|
readonly placeholder: _angular_core.InputSignal<string | undefined>;
|
|
@@ -668,5 +702,5 @@ declare function focusFirst(candidates: HTMLElement[]): void;
|
|
|
668
702
|
|
|
669
703
|
declare const _importsSelect: (typeof RdxSelectGroupLabel)[];
|
|
670
704
|
|
|
671
|
-
export { CONTENT_MARGIN, OPEN_KEYS, RDX_SELECT_POSITIONER_TOKEN, RdxSelectBackdrop, RdxSelectGroup, RdxSelectGroupLabel, RdxSelectIcon, RdxSelectItem, RdxSelectItemIndicator, RdxSelectItemText, RdxSelectList, RdxSelectPopup, RdxSelectPortal,
|
|
672
|
-
export type { RdxPositionerImpl, RdxSelectItemContext, RdxSelectPopupContext, RdxSelectRootContext, SelectEvent, SelectOption };
|
|
705
|
+
export { CONTENT_MARGIN, OPEN_KEYS, RDX_SELECT_POSITIONER_TOKEN, RdxSelectBackdrop, RdxSelectGroup, RdxSelectGroupLabel, RdxSelectIcon, RdxSelectItem, RdxSelectItemIndicator, RdxSelectItemText, RdxSelectList, RdxSelectPopup, RdxSelectPortal, RdxSelectPortalMisuseGuard, RdxSelectPositioner, RdxSelectRoot, RdxSelectSeparator, RdxSelectTrigger, RdxSelectValue, SELECTION_KEYS, _importsSelect, compare, focusFirst, injectSelectItemContext, injectSelectPopupContext, injectSelectRootContext, provideSelectItemContext, provideSelectPopupContext, provideSelectRootContext, shouldShowPlaceholder, valueComparator };
|
|
706
|
+
export type { RdxPositionerImpl, RdxSelectChangeEventDetails, RdxSelectItemContext, RdxSelectOpenChangeEvent, RdxSelectOpenChangeEventDetails, RdxSelectOpenChangeReason, RdxSelectOpenMethod, RdxSelectPopupContext, RdxSelectRootContext, RdxSelectValueChangeEvent, RdxSelectValueChangeEventDetails, RdxSelectValueChangeReason, SelectEvent, SelectOption };
|