@radix-ng/primitives 0.51.0 → 1.0.0-beta.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.
- package/fesm2022/radix-ng-primitives-accordion.mjs +105 -38
- package/fesm2022/radix-ng-primitives-accordion.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-alert-dialog.mjs +221 -129
- package/fesm2022/radix-ng-primitives-alert-dialog.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-arrow.mjs +20 -4
- package/fesm2022/radix-ng-primitives-arrow.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-aspect-ratio.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-avatar.mjs +54 -61
- package/fesm2022/radix-ng-primitives-avatar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-button.mjs +123 -0
- package/fesm2022/radix-ng-primitives-button.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-calendar.mjs +95 -83
- package/fesm2022/radix-ng-primitives-calendar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-checkbox.mjs +378 -54
- package/fesm2022/radix-ng-primitives-checkbox.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-collapsible.mjs +182 -81
- package/fesm2022/radix-ng-primitives-collapsible.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-collection.mjs +40 -57
- package/fesm2022/radix-ng-primitives-collection.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-config.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-context-menu.mjs +140 -424
- package/fesm2022/radix-ng-primitives-context-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-core.mjs +845 -744
- package/fesm2022/radix-ng-primitives-core.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-cropper.mjs +288 -308
- package/fesm2022/radix-ng-primitives-cropper.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-date-field.mjs +104 -58
- package/fesm2022/radix-ng-primitives-date-field.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-dialog.mjs +655 -327
- package/fesm2022/radix-ng-primitives-dialog.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-dismissable-layer.mjs +70 -46
- package/fesm2022/radix-ng-primitives-dismissable-layer.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-drawer.mjs +960 -0
- package/fesm2022/radix-ng-primitives-drawer.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-editable.mjs +304 -23
- package/fesm2022/radix-ng-primitives-editable.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-field.mjs +363 -0
- package/fesm2022/radix-ng-primitives-field.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-fieldset.mjs +79 -0
- package/fesm2022/radix-ng-primitives-fieldset.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-focus-scope.mjs +23 -8
- package/fesm2022/radix-ng-primitives-focus-scope.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-input.mjs +172 -0
- package/fesm2022/radix-ng-primitives-input.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-label.mjs +6 -6
- package/fesm2022/radix-ng-primitives-label.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-menu.mjs +1907 -363
- package/fesm2022/radix-ng-primitives-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-menubar.mjs +290 -162
- package/fesm2022/radix-ng-primitives-menubar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-meter.mjs +271 -0
- package/fesm2022/radix-ng-primitives-meter.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-navigation-menu.mjs +1052 -1553
- package/fesm2022/radix-ng-primitives-navigation-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-number-field.mjs +1102 -367
- package/fesm2022/radix-ng-primitives-number-field.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-pagination.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-popover.mjs +978 -989
- package/fesm2022/radix-ng-primitives-popover.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-popper.mjs +111 -44
- package/fesm2022/radix-ng-primitives-popper.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-portal.mjs +34 -10
- package/fesm2022/radix-ng-primitives-portal.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-presence.mjs +134 -246
- package/fesm2022/radix-ng-primitives-presence.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-preview-card.mjs +997 -0
- package/fesm2022/radix-ng-primitives-preview-card.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-progress.mjs +223 -84
- package/fesm2022/radix-ng-primitives-progress.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-radio.mjs +191 -51
- package/fesm2022/radix-ng-primitives-radio.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-roving-focus.mjs +96 -50
- package/fesm2022/radix-ng-primitives-roving-focus.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-scroll-area.mjs +923 -0
- package/fesm2022/radix-ng-primitives-scroll-area.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-select.mjs +791 -509
- package/fesm2022/radix-ng-primitives-select.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-separator.mjs +12 -35
- package/fesm2022/radix-ng-primitives-separator.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-slider.mjs +969 -717
- package/fesm2022/radix-ng-primitives-slider.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-stepper.mjs +15 -19
- package/fesm2022/radix-ng-primitives-stepper.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-switch.mjs +125 -113
- package/fesm2022/radix-ng-primitives-switch.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-tabs.mjs +390 -108
- package/fesm2022/radix-ng-primitives-tabs.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-time-field.mjs +55 -46
- package/fesm2022/radix-ng-primitives-time-field.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toast.mjs +839 -0
- package/fesm2022/radix-ng-primitives-toast.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-toggle-group.mjs +121 -247
- package/fesm2022/radix-ng-primitives-toggle-group.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toggle.mjs +98 -61
- package/fesm2022/radix-ng-primitives-toggle.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toolbar.mjs +303 -92
- package/fesm2022/radix-ng-primitives-toolbar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-tooltip.mjs +699 -1072
- package/fesm2022/radix-ng-primitives-tooltip.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-visually-hidden.mjs +25 -66
- package/fesm2022/radix-ng-primitives-visually-hidden.mjs.map +1 -1
- package/meter/README.md +3 -0
- package/navigation-menu/README.md +2 -1
- package/package.json +39 -18
- package/portal/README.md +2 -0
- package/preview-card/README.md +3 -0
- package/schematics/collection.json +1 -0
- package/schematics/ng-add/index.d.ts +3 -2
- package/schematics/ng-add/index.js +62 -31
- package/schematics/ng-add/index.js.map +1 -1
- package/schematics/ng-add/package-config.d.ts +4 -2
- package/schematics/ng-add/package-config.js +10 -2
- package/schematics/ng-add/package-config.js.map +1 -1
- package/schematics/ng-add/schema.d.ts +3 -0
- package/schematics/ng-add/schema.js +3 -0
- package/schematics/ng-add/schema.js.map +1 -0
- package/schematics/ng-add/schema.json +14 -0
- package/select/README.md +2 -0
- package/types/radix-ng-primitives-accordion.d.ts +51 -16
- package/types/radix-ng-primitives-alert-dialog.d.ts +95 -38
- package/types/radix-ng-primitives-arrow.d.ts +1 -1
- package/types/radix-ng-primitives-aspect-ratio.d.ts +1 -1
- package/types/radix-ng-primitives-avatar.d.ts +7 -11
- package/types/radix-ng-primitives-button.d.ts +73 -0
- package/types/radix-ng-primitives-calendar.d.ts +39 -20
- package/types/radix-ng-primitives-checkbox.d.ts +204 -35
- package/types/radix-ng-primitives-collapsible.d.ts +114 -40
- package/types/radix-ng-primitives-collection.d.ts +38 -34
- package/types/radix-ng-primitives-config.d.ts +1 -1
- package/types/radix-ng-primitives-context-menu.d.ts +61 -116
- package/types/radix-ng-primitives-core.d.ts +345 -235
- package/types/radix-ng-primitives-cropper.d.ts +89 -56
- package/types/radix-ng-primitives-date-field.d.ts +49 -28
- package/types/radix-ng-primitives-dialog.d.ts +283 -165
- package/types/radix-ng-primitives-dismissable-layer.d.ts +15 -7
- package/types/radix-ng-primitives-drawer.d.ts +426 -0
- package/types/radix-ng-primitives-editable.d.ts +91 -14
- package/types/radix-ng-primitives-field.d.ts +374 -0
- package/types/radix-ng-primitives-fieldset.d.ts +49 -0
- package/types/radix-ng-primitives-focus-scope.d.ts +15 -6
- package/types/radix-ng-primitives-input.d.ts +87 -0
- package/types/radix-ng-primitives-label.d.ts +0 -1
- package/types/radix-ng-primitives-menu.d.ts +584 -99
- package/types/radix-ng-primitives-menubar.d.ts +61 -50
- package/types/radix-ng-primitives-meter.d.ts +194 -0
- package/types/radix-ng-primitives-navigation-menu.d.ts +422 -340
- package/types/radix-ng-primitives-number-field.d.ts +405 -145
- package/types/radix-ng-primitives-pagination.d.ts +2 -2
- package/types/radix-ng-primitives-popover.d.ts +366 -351
- package/types/radix-ng-primitives-popper.d.ts +68 -11
- package/types/radix-ng-primitives-portal.d.ts +14 -6
- package/types/radix-ng-primitives-presence.d.ts +28 -76
- package/types/radix-ng-primitives-preview-card.d.ts +359 -0
- package/types/radix-ng-primitives-progress.d.ts +175 -48
- package/types/radix-ng-primitives-radio.d.ts +55 -25
- package/types/radix-ng-primitives-roving-focus.d.ts +33 -23
- package/types/radix-ng-primitives-scroll-area.d.ts +253 -0
- package/types/radix-ng-primitives-select.d.ts +475 -177
- package/types/radix-ng-primitives-separator.d.ts +7 -32
- package/types/radix-ng-primitives-slider.d.ts +315 -201
- package/types/radix-ng-primitives-stepper.d.ts +5 -7
- package/types/radix-ng-primitives-switch.d.ts +86 -71
- package/types/radix-ng-primitives-tabs.d.ts +213 -79
- package/types/radix-ng-primitives-time-field.d.ts +42 -27
- package/types/radix-ng-primitives-toast.d.ts +378 -0
- package/types/radix-ng-primitives-toggle-group.d.ts +86 -164
- package/types/radix-ng-primitives-toggle.d.ts +43 -53
- package/types/radix-ng-primitives-toolbar.d.ts +164 -38
- package/types/radix-ng-primitives-tooltip.d.ts +348 -384
- package/types/radix-ng-primitives-visually-hidden.d.ts +19 -19
- package/dropdown-menu/README.md +0 -1
- package/fesm2022/radix-ng-primitives-dropdown-menu.mjs +0 -581
- package/fesm2022/radix-ng-primitives-dropdown-menu.mjs.map +0 -1
- package/fesm2022/radix-ng-primitives-hover-card.mjs +0 -1238
- package/fesm2022/radix-ng-primitives-hover-card.mjs.map +0 -1
- package/fesm2022/radix-ng-primitives-select2.mjs +0 -897
- package/fesm2022/radix-ng-primitives-select2.mjs.map +0 -1
- package/fesm2022/radix-ng-primitives-tooltip2.mjs +0 -735
- package/fesm2022/radix-ng-primitives-tooltip2.mjs.map +0 -1
- package/hover-card/README.md +0 -3
- package/select2/README.md +0 -3
- package/tooltip2/README.md +0 -3
- package/types/radix-ng-primitives-dropdown-menu.d.ts +0 -171
- package/types/radix-ng-primitives-hover-card.d.ts +0 -471
- package/types/radix-ng-primitives-select2.d.ts +0 -511
- package/types/radix-ng-primitives-tooltip2.d.ts +0 -325
|
@@ -1,406 +1,488 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { TemplateRef, Signal, ElementRef } from '@angular/core';
|
|
3
|
+
import * as i1 from '@radix-ng/primitives/presence';
|
|
4
|
+
import * as _radix_ng_primitives_core from '@radix-ng/primitives/core';
|
|
5
|
+
import { RdxTransitionStatus, BooleanInput, NumberInput } from '@radix-ng/primitives/core';
|
|
6
|
+
import * as i1$1 from '@radix-ng/primitives/popper';
|
|
7
|
+
import { RdxPopperContentWrapper, RdxPopperAnchorElement } from '@radix-ng/primitives/popper';
|
|
6
8
|
import * as _radix_ng_primitives_navigation_menu from '@radix-ng/primitives/navigation-menu';
|
|
9
|
+
import * as i1$2 from '@radix-ng/primitives/roving-focus';
|
|
10
|
+
import * as i1$3 from '@radix-ng/primitives/portal';
|
|
11
|
+
import { RdxPortalContainer } from '@radix-ng/primitives/portal';
|
|
12
|
+
import * as i2 from '@radix-ng/primitives/dismissable-layer';
|
|
7
13
|
|
|
8
|
-
declare enum RdxNavigationMenuAnimationStatus {
|
|
9
|
-
OPEN_STARTED = "open_started",
|
|
10
|
-
OPEN_ENDED = "open_ended",
|
|
11
|
-
CLOSED_STARTED = "closed_started",
|
|
12
|
-
CLOSED_ENDED = "closed_ended"
|
|
13
|
-
}
|
|
14
14
|
/**
|
|
15
|
-
*
|
|
15
|
+
* Mounts the popup while the menu is open and waits for CSS exit keyframes before unmounting.
|
|
16
|
+
*
|
|
17
|
+
* ```html
|
|
18
|
+
* <ng-template rdxNavigationMenuPortalPresence>…</ng-template>
|
|
19
|
+
* ```
|
|
16
20
|
*/
|
|
17
|
-
declare
|
|
18
|
-
|
|
21
|
+
declare class RdxNavigationMenuPortalPresence {
|
|
22
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuPortalPresence, never>;
|
|
23
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuPortalPresence, "ng-template[rdxNavigationMenuPortalPresence]", never, {}, {}, never, never, true, [{ directive: typeof i1.RdxPresenceDirective; inputs: {}; outputs: {}; }]>;
|
|
19
24
|
}
|
|
20
25
|
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
26
|
+
type NavigationMenuOrientation = 'horizontal' | 'vertical';
|
|
27
|
+
type NavigationMenuDirection = 'ltr' | 'rtl';
|
|
28
|
+
type RdxNavigationMenuOpenChangeReason = 'trigger-hover' | 'trigger-focus' | 'trigger-press' | 'outside-press' | 'focus-out' | 'escape-key' | 'link-select' | 'list-leave' | 'none';
|
|
29
|
+
interface RdxNavigationMenuOpenChange {
|
|
30
|
+
value: string | null;
|
|
31
|
+
open: boolean;
|
|
32
|
+
reason: RdxNavigationMenuOpenChangeReason;
|
|
33
|
+
event: Event;
|
|
24
34
|
}
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
private closeTimerRef;
|
|
35
|
-
private skipDelayTimerRef;
|
|
36
|
-
private recentlyActivatedTimerRef;
|
|
37
|
-
private readonly recentlyActivatedItem;
|
|
38
|
-
private documentMouseLeaveHandler;
|
|
39
|
-
readonly actionSubject$: Subject<{
|
|
40
|
-
action: RdxNavigationMenuAction;
|
|
41
|
-
itemValue?: string;
|
|
42
|
-
}>;
|
|
43
|
-
orientation: 'horizontal' | 'vertical';
|
|
44
|
-
dir: 'ltr' | 'rtl';
|
|
45
|
-
clickIgnoreDuration: number;
|
|
46
|
-
delayDuration: number;
|
|
47
|
-
skipDelayDuration: number;
|
|
48
|
-
loop: boolean;
|
|
49
|
-
cssAnimation: boolean;
|
|
50
|
-
cssOpeningAnimation: boolean;
|
|
51
|
-
cssClosingAnimation: boolean;
|
|
52
|
-
readonly isRootMenu = true;
|
|
53
|
-
readonly cssAnimationStatus: WritableSignal<RdxNavigationMenuAnimationStatus | null>;
|
|
54
|
-
value: () => string;
|
|
55
|
-
previousValue: () => string;
|
|
56
|
-
rootNavigationMenu: () => HTMLElement | null;
|
|
57
|
-
indicatorTrack: () => HTMLElement | null;
|
|
58
|
-
viewport: () => HTMLElement | null;
|
|
59
|
-
viewportContent: () => Map<string, any>;
|
|
60
|
-
setTriggerPointerState: (isOver: boolean) => void;
|
|
61
|
-
setContentPointerState: (isOver: boolean) => void;
|
|
62
|
-
isPointerInSystem: () => boolean;
|
|
63
|
-
getCssAnimation: () => boolean;
|
|
64
|
-
getCssOpeningAnimation: () => boolean;
|
|
65
|
-
getCssClosingAnimation: () => boolean;
|
|
66
|
-
constructor();
|
|
67
|
-
ngOnDestroy(): void;
|
|
68
|
-
onIndicatorTrackChange(track: HTMLElement | null): void;
|
|
69
|
-
onViewportChange(viewport: HTMLElement | null): void;
|
|
70
|
-
onTriggerEnter(itemValue: string): void;
|
|
71
|
-
onTriggerLeave(): void;
|
|
72
|
-
onContentEnter(): void;
|
|
73
|
-
onContentLeave(): void;
|
|
74
|
-
handleClose(): void;
|
|
75
|
-
onItemSelect(itemValue: string): void;
|
|
76
|
-
onItemDismiss(): void;
|
|
77
|
-
onViewportContentChange(contentValue: string, contentData: any): void;
|
|
78
|
-
onViewportContentRemove(contentValue: string): void;
|
|
79
|
-
private setValue;
|
|
80
|
-
private startCloseTimer;
|
|
81
|
-
private handleOpen;
|
|
82
|
-
private handleDelayedOpen;
|
|
83
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<RdxNavigationMenuDirective, never>;
|
|
84
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxNavigationMenuDirective, "[rdxNavigationMenu]", ["rdxNavigationMenu"], { "orientation": { "alias": "orientation"; "required": false; }; "dir": { "alias": "dir"; "required": false; }; "clickIgnoreDuration": { "alias": "clickIgnoreDuration"; "required": false; }; "delayDuration": { "alias": "delayDuration"; "required": false; }; "skipDelayDuration": { "alias": "skipDelayDuration"; "required": false; }; "loop": { "alias": "loop"; "required": false; }; "cssAnimation": { "alias": "cssAnimation"; "required": false; }; "cssOpeningAnimation": { "alias": "cssOpeningAnimation"; "required": false; }; "cssClosingAnimation": { "alias": "cssClosingAnimation"; "required": false; }; }, {}, never, never, true, never>;
|
|
85
|
-
static ngAcceptInputType_clickIgnoreDuration: unknown;
|
|
86
|
-
static ngAcceptInputType_delayDuration: unknown;
|
|
87
|
-
static ngAcceptInputType_skipDelayDuration: unknown;
|
|
88
|
-
static ngAcceptInputType_loop: unknown;
|
|
89
|
-
static ngAcceptInputType_cssAnimation: unknown;
|
|
90
|
-
static ngAcceptInputType_cssOpeningAnimation: unknown;
|
|
91
|
-
static ngAcceptInputType_cssClosingAnimation: unknown;
|
|
35
|
+
/**
|
|
36
|
+
* A registered item content template, rendered into the shared viewport when its item is active.
|
|
37
|
+
*/
|
|
38
|
+
interface RdxNavigationMenuContentEntry {
|
|
39
|
+
value: string;
|
|
40
|
+
contentId: string;
|
|
41
|
+
triggerId: string;
|
|
42
|
+
templateRef: TemplateRef<unknown>;
|
|
43
|
+
forceMount: Signal<boolean>;
|
|
92
44
|
}
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
readonly
|
|
96
|
-
set defaultValue(val: string);
|
|
97
|
-
readonly valueChange: i0.OutputEmitterRef<string>;
|
|
98
|
-
readonly value: i0.WritableSignal<string>;
|
|
99
|
-
readonly previousValue: i0.WritableSignal<string>;
|
|
45
|
+
interface RdxNavigationMenuRootContext {
|
|
46
|
+
/** Whether this menu is nested inside another navigation menu's content. */
|
|
47
|
+
readonly nested: boolean;
|
|
100
48
|
readonly baseId: string;
|
|
101
|
-
readonly
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
49
|
+
readonly orientation: Signal<NavigationMenuOrientation>;
|
|
50
|
+
readonly dir: Signal<NavigationMenuDirection>;
|
|
51
|
+
readonly loop: Signal<boolean>;
|
|
52
|
+
/** Value of the currently open item, or `null` when closed. */
|
|
53
|
+
readonly value: Signal<string | null>;
|
|
54
|
+
/** Value of the previously open item (used for slide-direction morphing). */
|
|
55
|
+
readonly previousValue: Signal<string | null>;
|
|
56
|
+
readonly isOpen: Signal<boolean>;
|
|
57
|
+
readonly instant: Signal<boolean>;
|
|
58
|
+
readonly transitionStatus: Signal<RdxTransitionStatus>;
|
|
59
|
+
/** The active trigger element the popup is anchored to. */
|
|
60
|
+
readonly trigger: Signal<HTMLElement | undefined>;
|
|
61
|
+
readonly triggers: Signal<HTMLElement[]>;
|
|
62
|
+
readonly activeContent: Signal<RdxNavigationMenuContentEntry | undefined>;
|
|
63
|
+
contentId(value: string): string;
|
|
64
|
+
triggerId(value: string): string;
|
|
65
|
+
setValue(value: string | null, reason?: RdxNavigationMenuOpenChangeReason, event?: Event): void;
|
|
66
|
+
open(value: string, trigger: HTMLElement, reason?: RdxNavigationMenuOpenChangeReason, event?: Event): void;
|
|
67
|
+
close(reason?: RdxNavigationMenuOpenChangeReason, event?: Event): void;
|
|
68
|
+
toggle(value: string, trigger: HTMLElement, event?: Event): void;
|
|
69
|
+
openOnHover(value: string, trigger: HTMLElement, event: PointerEvent): void;
|
|
70
|
+
closeOnHover(): void;
|
|
71
|
+
cancelHoverOpen(): void;
|
|
72
|
+
cancelHoverClose(): void;
|
|
73
|
+
registerTrigger(value: string, trigger: HTMLElement): () => void;
|
|
74
|
+
registerContent(entry: RdxNavigationMenuContentEntry): () => void;
|
|
75
|
+
registerTransitionElement(element: HTMLElement): () => void;
|
|
76
|
+
registerViewport(onTriggerChange: (previous: HTMLElement, next: HTMLElement) => void): () => void;
|
|
111
77
|
}
|
|
78
|
+
declare const injectNavigationMenuRootContext: _radix_ng_primitives_core.InjectContext<RdxNavigationMenuRootContext>;
|
|
79
|
+
declare const provideNavigationMenuRootContext: (useFactory: () => RdxNavigationMenuRootContext) => _angular_core.Provider;
|
|
112
80
|
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
81
|
+
/**
|
|
82
|
+
* Groups all parts of the navigation menu.
|
|
83
|
+
*
|
|
84
|
+
* Holds the shared open state: `value` identifies the currently open item, and the menu is open
|
|
85
|
+
* whenever `value` is non-null. A single popup (Portal → Positioner → Popup → Viewport) is shared
|
|
86
|
+
* between every item and anchored to the active trigger.
|
|
87
|
+
*/
|
|
88
|
+
declare class RdxNavigationMenuRoot {
|
|
89
|
+
private readonly popper;
|
|
90
|
+
private readonly destroyRef;
|
|
91
|
+
private readonly parentRoot;
|
|
92
|
+
/** Whether this root is nested inside another navigation menu's content. */
|
|
93
|
+
readonly nested: boolean;
|
|
94
|
+
readonly baseId: string;
|
|
95
|
+
/**
|
|
96
|
+
* The value of the navigation menu item that should be currently open.
|
|
97
|
+
*/
|
|
98
|
+
readonly value: _angular_core.ModelSignal<string | null>;
|
|
99
|
+
/**
|
|
100
|
+
* The uncontrolled value of the item that should be initially open.
|
|
101
|
+
*/
|
|
102
|
+
readonly defaultValue: _angular_core.InputSignal<string | null>;
|
|
103
|
+
/**
|
|
104
|
+
* The orientation of the navigation menu.
|
|
105
|
+
*/
|
|
106
|
+
readonly orientation: _angular_core.InputSignal<NavigationMenuOrientation>;
|
|
107
|
+
/**
|
|
108
|
+
* The reading direction of the navigation menu.
|
|
109
|
+
*/
|
|
110
|
+
readonly dir: _angular_core.InputSignal<NavigationMenuDirection>;
|
|
117
111
|
/**
|
|
118
|
-
*
|
|
112
|
+
* Whether keyboard navigation loops from the last item back to the first and vice versa.
|
|
119
113
|
*/
|
|
120
|
-
readonly
|
|
121
|
-
readonly triggerRef: i0.WritableSignal<HTMLElement | null>;
|
|
122
|
-
readonly contentRef: i0.WritableSignal<HTMLElement | null>;
|
|
123
|
-
readonly focusProxyRef: i0.WritableSignal<HTMLElement | null>;
|
|
124
|
-
readonly wasEscapeCloseRef: i0.WritableSignal<boolean>;
|
|
125
|
-
private readonly _restoreContentTabOrderRef;
|
|
126
|
-
get restoreContentTabOrderRef(): Signal<(() => void) | null>;
|
|
114
|
+
readonly loop: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
|
|
127
115
|
/**
|
|
128
|
-
*
|
|
116
|
+
* How long to wait before opening the menu on hover, in milliseconds.
|
|
129
117
|
*/
|
|
130
|
-
|
|
131
|
-
focus(): void;
|
|
118
|
+
readonly delay: _angular_core.InputSignalWithTransform<number, NumberInput>;
|
|
132
119
|
/**
|
|
133
|
-
*
|
|
120
|
+
* How long to wait before closing the menu after the pointer leaves, in milliseconds.
|
|
134
121
|
*/
|
|
135
|
-
|
|
122
|
+
readonly closeDelay: _angular_core.InputSignalWithTransform<number, NumberInput>;
|
|
136
123
|
/**
|
|
137
|
-
*
|
|
138
|
-
* @param side Which side the focus is coming from (start = from trigger, end = from after content)
|
|
124
|
+
* Emits when the open item changes.
|
|
139
125
|
*/
|
|
140
|
-
|
|
126
|
+
readonly onValueChange: _angular_core.OutputEmitterRef<string | null>;
|
|
141
127
|
/**
|
|
142
|
-
*
|
|
143
|
-
* Remove elements from tab order when not focused
|
|
128
|
+
* Emits whenever the menu opens or closes.
|
|
144
129
|
*/
|
|
145
|
-
|
|
130
|
+
readonly onOpenChange: _angular_core.OutputEmitterRef<RdxNavigationMenuOpenChange>;
|
|
146
131
|
/**
|
|
147
|
-
*
|
|
132
|
+
* Emits after any enter/exit transition completes.
|
|
148
133
|
*/
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
134
|
+
readonly onOpenChangeComplete: _angular_core.OutputEmitterRef<boolean>;
|
|
135
|
+
private hasAppliedDefaultValue;
|
|
136
|
+
private openTimer;
|
|
137
|
+
private closeTimer;
|
|
138
|
+
private instantFrame;
|
|
139
|
+
private readonly transition;
|
|
140
|
+
readonly instant: _angular_core.WritableSignal<boolean>;
|
|
141
|
+
readonly transitionStatus: _angular_core.Signal<_radix_ng_primitives_core.RdxTransitionStatus>;
|
|
142
|
+
readonly previousValue: _angular_core.WritableSignal<string | null>;
|
|
143
|
+
readonly isOpen: _angular_core.Signal<boolean>;
|
|
144
|
+
readonly trigger: _angular_core.WritableSignal<HTMLElement | undefined>;
|
|
145
|
+
readonly triggers: _angular_core.WritableSignal<HTMLElement[]>;
|
|
146
|
+
readonly contents: _angular_core.WritableSignal<Map<string, RdxNavigationMenuContentEntry>>;
|
|
147
|
+
readonly activeContent: _angular_core.Signal<RdxNavigationMenuContentEntry | undefined>;
|
|
148
|
+
private readonly registeredTriggers;
|
|
149
|
+
private readonly viewportTriggerChange;
|
|
150
|
+
constructor();
|
|
151
|
+
contentId(value: string): string;
|
|
152
|
+
triggerId(value: string): string;
|
|
153
|
+
setValue(value: string | null, reason?: RdxNavigationMenuOpenChangeReason, event?: Event): void;
|
|
154
|
+
open(value: string, trigger: HTMLElement, reason?: RdxNavigationMenuOpenChangeReason, event?: Event): void;
|
|
155
|
+
close(reason?: RdxNavigationMenuOpenChangeReason, event?: Event): void;
|
|
156
|
+
toggle(value: string, trigger: HTMLElement, event?: Event): void;
|
|
157
|
+
openOnHover(value: string, trigger: HTMLElement, event: PointerEvent): void;
|
|
158
|
+
closeOnHover(): void;
|
|
159
|
+
cancelHoverOpen(): void;
|
|
160
|
+
cancelHoverClose(): void;
|
|
161
|
+
registerTrigger(value: string, trigger: HTMLElement): () => void;
|
|
162
|
+
registerContent(entry: RdxNavigationMenuContentEntry): () => void;
|
|
163
|
+
registerTransitionElement(element: HTMLElement): () => void;
|
|
164
|
+
registerViewport(onTriggerChange: (previous: HTMLElement, next: HTMLElement) => void): () => boolean;
|
|
165
|
+
private scheduleInstantReset;
|
|
166
|
+
private clearHoverTimers;
|
|
167
|
+
private clearOpenTimer;
|
|
168
|
+
private clearCloseTimer;
|
|
169
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuRoot, never>;
|
|
170
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuRoot, "[rdxNavigationMenuRoot]", ["rdxNavigationMenuRoot"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; "loop": { "alias": "loop"; "required": false; "isSignal": true; }; "delay": { "alias": "delay"; "required": false; "isSignal": true; }; "closeDelay": { "alias": "closeDelay"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; "onOpenChange": "onOpenChange"; "onOpenChangeComplete": "onOpenChangeComplete"; }, never, never, true, [{ directive: typeof i1$1.RdxPopper; inputs: {}; outputs: {}; }]>;
|
|
152
171
|
}
|
|
153
172
|
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
173
|
+
/**
|
|
174
|
+
* Contains the navigation menu items. Renders as a menubar with roving keyboard focus.
|
|
175
|
+
*/
|
|
176
|
+
declare class RdxNavigationMenuList {
|
|
177
|
+
protected readonly rootContext: _radix_ng_primitives_navigation_menu.RdxNavigationMenuRootContext;
|
|
158
178
|
private readonly rovingFocusGroup;
|
|
179
|
+
constructor();
|
|
180
|
+
protected onPointerLeave(event: PointerEvent): void;
|
|
181
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuList, never>;
|
|
182
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuList, "[rdxNavigationMenuList]", never, {}, {}, never, never, true, [{ directive: typeof i1$2.RdxRovingFocusGroupDirective; inputs: {}; outputs: {}; }]>;
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
/**
|
|
186
|
+
* A single navigation menu item. Holds a trigger + content pair, or a standalone link.
|
|
187
|
+
*/
|
|
188
|
+
declare class RdxNavigationMenuItem {
|
|
189
|
+
private readonly rootContext;
|
|
159
190
|
/**
|
|
160
|
-
*
|
|
161
|
-
* @ignore
|
|
191
|
+
* A unique value that identifies the item. Falls back to a generated id.
|
|
162
192
|
*/
|
|
163
|
-
readonly
|
|
193
|
+
readonly value: _angular_core.InputSignalWithTransform<string, string | undefined>;
|
|
194
|
+
/** The trigger element, set by the trigger directive. */
|
|
195
|
+
readonly triggerRef: _angular_core.WritableSignal<HTMLElement | null>;
|
|
196
|
+
/** Whether this item is the currently open one. */
|
|
197
|
+
readonly isOpen: _angular_core.Signal<boolean>;
|
|
198
|
+
readonly triggerId: _angular_core.Signal<string>;
|
|
199
|
+
readonly contentId: _angular_core.Signal<string>;
|
|
200
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuItem, never>;
|
|
201
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuItem, "[rdxNavigationMenuItem]", ["rdxNavigationMenuItem"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
/**
|
|
205
|
+
* A button that opens its item's content in the shared popup.
|
|
206
|
+
*/
|
|
207
|
+
declare class RdxNavigationMenuTrigger {
|
|
208
|
+
protected readonly item: RdxNavigationMenuItem;
|
|
209
|
+
private readonly rootContext;
|
|
210
|
+
private readonly rovingFocusItem;
|
|
211
|
+
private readonly elementRef;
|
|
212
|
+
private readonly document;
|
|
164
213
|
/**
|
|
165
|
-
*
|
|
214
|
+
* Whether the trigger should ignore user interaction.
|
|
166
215
|
*/
|
|
167
|
-
|
|
216
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
168
217
|
/**
|
|
169
|
-
*
|
|
218
|
+
* Whether the content should also open when the trigger is hovered.
|
|
170
219
|
*/
|
|
171
|
-
|
|
220
|
+
readonly openOnHover: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
221
|
+
protected readonly open: _angular_core.Signal<boolean>;
|
|
222
|
+
constructor();
|
|
223
|
+
protected onClick(event: MouseEvent): void;
|
|
224
|
+
protected onPointerEnter(event: PointerEvent): void;
|
|
225
|
+
protected onPointerLeave(event: PointerEvent): void;
|
|
172
226
|
/**
|
|
173
|
-
*
|
|
227
|
+
* Open-follows-focus: while the menu is already open, moving keyboard focus (arrow keys via
|
|
228
|
+
* roving) to another trigger switches the shared popup to that item — matching Base UI, so the
|
|
229
|
+
* open menu visibly responds to arrow-key navigation. Focus never *opens* a closed menu.
|
|
174
230
|
*/
|
|
175
|
-
|
|
231
|
+
protected onFocus(): void;
|
|
232
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
233
|
+
/** The key that moves focus from the trigger into the open content, based on orientation/dir. */
|
|
234
|
+
private entryKey;
|
|
235
|
+
private focusContent;
|
|
236
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuTrigger, never>;
|
|
237
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuTrigger, "button[rdxNavigationMenuTrigger]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "openOnHover": { "alias": "openOnHover"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$2.RdxRovingFocusItemDirective; inputs: {}; outputs: {}; }]>;
|
|
238
|
+
}
|
|
239
|
+
|
|
240
|
+
/**
|
|
241
|
+
* A visual indicator (e.g. a caret) rendered inside a trigger. Exposes the open state so the icon
|
|
242
|
+
* can rotate when its item opens.
|
|
243
|
+
*/
|
|
244
|
+
declare class RdxNavigationMenuIcon {
|
|
245
|
+
private readonly item;
|
|
246
|
+
protected readonly open: _angular_core.Signal<boolean>;
|
|
247
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuIcon, never>;
|
|
248
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuIcon, "[rdxNavigationMenuIcon]", never, {}, {}, never, never, true, never>;
|
|
249
|
+
}
|
|
250
|
+
|
|
251
|
+
/**
|
|
252
|
+
* The content shown when its item is open. Used as a structural directive; its template is rendered
|
|
253
|
+
* into the shared {@link RdxNavigationMenuViewport}.
|
|
254
|
+
*
|
|
255
|
+
* ```html
|
|
256
|
+
* <ng-container *rdxNavigationMenuContent>…</ng-container>
|
|
257
|
+
* ```
|
|
258
|
+
*/
|
|
259
|
+
declare class RdxNavigationMenuContent {
|
|
260
|
+
private readonly rootContext;
|
|
261
|
+
private readonly item;
|
|
262
|
+
private readonly templateRef;
|
|
176
263
|
/**
|
|
177
|
-
*
|
|
264
|
+
* Required by the structural directive syntax; the value is unused.
|
|
178
265
|
*/
|
|
179
|
-
|
|
266
|
+
readonly rdxNavigationMenuContent: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
180
267
|
/**
|
|
181
|
-
*
|
|
268
|
+
* Keep the content mounted in the viewport even when its item is closed.
|
|
182
269
|
*/
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
static
|
|
270
|
+
readonly forceMount: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
271
|
+
constructor();
|
|
272
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuContent, never>;
|
|
273
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuContent, "[rdxNavigationMenuContent]", never, { "rdxNavigationMenuContent": { "alias": "rdxNavigationMenuContent"; "required": false; "isSignal": true; }; "forceMount": { "alias": "forceMount"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
186
274
|
}
|
|
187
275
|
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
276
|
+
/**
|
|
277
|
+
* A navigation link. Closes the menu on selection unless prevented.
|
|
278
|
+
*
|
|
279
|
+
* Used both as a top-level menubar item and inside content. It is a plain tabbable anchor (not part
|
|
280
|
+
* of the menubar's arrow-key roving), matching Base UI.
|
|
281
|
+
*/
|
|
282
|
+
declare class RdxNavigationMenuLink {
|
|
283
|
+
private readonly rootContext;
|
|
193
284
|
private readonly elementRef;
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
readonly
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
onPointerEnter(): void;
|
|
211
|
-
onPointerMove(event: Event): void;
|
|
212
|
-
onPointerLeave(event: Event): void;
|
|
213
|
-
onClick(): void;
|
|
214
|
-
onKeydown(event: Event): void;
|
|
215
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<RdxNavigationMenuTriggerDirective, never>;
|
|
216
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxNavigationMenuTriggerDirective, "[rdxNavigationMenuTrigger]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "openOnHover": { "alias": "openOnHover"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.RdxRovingFocusItemDirective; inputs: {}; outputs: {}; }]>;
|
|
285
|
+
/**
|
|
286
|
+
* Whether the link represents the current page.
|
|
287
|
+
*/
|
|
288
|
+
readonly active: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
289
|
+
/**
|
|
290
|
+
* Whether selecting the link should close the menu.
|
|
291
|
+
*/
|
|
292
|
+
readonly closeOnClick: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
293
|
+
/**
|
|
294
|
+
* Emits when the link is selected. Call `preventDefault()` to keep the menu open.
|
|
295
|
+
*/
|
|
296
|
+
readonly onSelect: _angular_core.OutputEmitterRef<Event>;
|
|
297
|
+
protected onClick(event: Event): void;
|
|
298
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
299
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuLink, never>;
|
|
300
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuLink, "[rdxNavigationMenuLink]", never, { "active": { "alias": "active"; "required": false; "isSignal": true; }; "closeOnClick": { "alias": "closeOnClick"; "required": false; "isSignal": true; }; }, { "onSelect": "onSelect"; }, never, never, true, never>;
|
|
217
301
|
}
|
|
218
302
|
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
readonly
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
static
|
|
230
|
-
|
|
303
|
+
/**
|
|
304
|
+
* Moves the navigation menu popup to a different part of the DOM (by default `document.body`).
|
|
305
|
+
*/
|
|
306
|
+
declare class RdxNavigationMenuPortal {
|
|
307
|
+
protected readonly rootContext: _radix_ng_primitives_navigation_menu.RdxNavigationMenuRootContext;
|
|
308
|
+
/**
|
|
309
|
+
* Optional container to portal the popup into. Defaults to `document.body`.
|
|
310
|
+
*/
|
|
311
|
+
readonly container: _angular_core.InputSignal<RdxPortalContainer | undefined>;
|
|
312
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuPortal, never>;
|
|
313
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuPortal, "[rdxNavigationMenuPortal]", never, { "container": { "alias": "container"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$3.RdxPortal; inputs: { "container": "container"; }; outputs: {}; }]>;
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
/**
|
|
317
|
+
* An optional backdrop rendered behind the popup.
|
|
318
|
+
*/
|
|
319
|
+
declare class RdxNavigationMenuBackdrop {
|
|
320
|
+
protected readonly rootContext: _radix_ng_primitives_navigation_menu.RdxNavigationMenuRootContext;
|
|
321
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuBackdrop, never>;
|
|
322
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuBackdrop, "[rdxNavigationMenuBackdrop]", never, {}, {}, never, never, true, never>;
|
|
231
323
|
}
|
|
232
324
|
|
|
233
|
-
|
|
234
|
-
|
|
325
|
+
/**
|
|
326
|
+
* Positions the shared popup against the active trigger.
|
|
327
|
+
*/
|
|
328
|
+
declare class RdxNavigationMenuPositioner {
|
|
329
|
+
protected readonly rootContext: _radix_ng_primitives_navigation_menu.RdxNavigationMenuRootContext;
|
|
330
|
+
protected readonly wrapper: RdxPopperContentWrapper;
|
|
235
331
|
private readonly elementRef;
|
|
236
|
-
private readonly
|
|
332
|
+
private readonly triggerEl;
|
|
333
|
+
private readonly containerEl;
|
|
334
|
+
private readonly graceArea;
|
|
335
|
+
/**
|
|
336
|
+
* An element to position the popup against. Defaults to the active trigger.
|
|
337
|
+
*/
|
|
338
|
+
readonly anchor: _angular_core.InputSignal<RdxPopperAnchorElement>;
|
|
339
|
+
/**
|
|
340
|
+
* The preferred side of the trigger to render against when open.
|
|
341
|
+
*/
|
|
342
|
+
readonly side: _angular_core.InputSignal<"top" | "right" | "bottom" | "left">;
|
|
343
|
+
/**
|
|
344
|
+
* Distance between the trigger and the popup in pixels.
|
|
345
|
+
*/
|
|
346
|
+
readonly sideOffset: _angular_core.InputSignalWithTransform<number, NumberInput>;
|
|
347
|
+
/**
|
|
348
|
+
* How to align the popup relative to the specified side.
|
|
349
|
+
*/
|
|
350
|
+
readonly align: _angular_core.InputSignal<"start" | "center" | "end">;
|
|
351
|
+
/**
|
|
352
|
+
* An offset in pixels from the `start` or `end` alignment options.
|
|
353
|
+
*/
|
|
354
|
+
readonly alignOffset: _angular_core.InputSignalWithTransform<number, NumberInput>;
|
|
355
|
+
/**
|
|
356
|
+
* Minimum distance to maintain between the arrow and the edges of the popup.
|
|
357
|
+
*/
|
|
358
|
+
readonly arrowPadding: _angular_core.InputSignalWithTransform<number, NumberInput>;
|
|
359
|
+
/**
|
|
360
|
+
* Whether to override side and alignment preferences to prevent collisions.
|
|
361
|
+
*/
|
|
362
|
+
readonly avoidCollisions: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
|
|
363
|
+
/**
|
|
364
|
+
* The element used as the collision boundary.
|
|
365
|
+
*/
|
|
366
|
+
readonly collisionBoundary: _angular_core.InputSignal<ElementRef<HTMLElement> | ElementRef<HTMLElement>[] | undefined>;
|
|
367
|
+
/**
|
|
368
|
+
* Distance in pixels from the boundary edges where collision detection should occur.
|
|
369
|
+
*/
|
|
370
|
+
readonly collisionPadding: _angular_core.InputSignal<number | Partial<Record<"top" | "right" | "bottom" | "left", number>>>;
|
|
371
|
+
/**
|
|
372
|
+
* The sticky behavior on the alignment axis.
|
|
373
|
+
*/
|
|
374
|
+
readonly sticky: _angular_core.InputSignal<"always" | "partial">;
|
|
375
|
+
/**
|
|
376
|
+
* Whether to hide the popup when the trigger becomes fully occluded.
|
|
377
|
+
*/
|
|
378
|
+
readonly hideWhenDetached: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
|
|
237
379
|
/**
|
|
238
|
-
*
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
/** @ignore */
|
|
246
|
-
private readonly _activeTrigger;
|
|
247
|
-
/** @ignore */
|
|
248
|
-
private readonly _resizeObserver;
|
|
249
|
-
readonly isVisible: i0.Signal<boolean>;
|
|
380
|
+
* The CSS position strategy used by Floating UI.
|
|
381
|
+
*/
|
|
382
|
+
readonly positionStrategy: _angular_core.InputSignal<"fixed" | "absolute">;
|
|
383
|
+
/**
|
|
384
|
+
* Whether to update position on every animation frame.
|
|
385
|
+
*/
|
|
386
|
+
readonly updatePositionStrategy: _angular_core.InputSignal<"always" | "optimized">;
|
|
250
387
|
constructor();
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
/** @ignore */
|
|
254
|
-
private findAndSetActiveTrigger;
|
|
255
|
-
/** @ignore */
|
|
256
|
-
private updatePosition;
|
|
257
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<RdxNavigationMenuIndicatorDirective, never>;
|
|
258
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxNavigationMenuIndicatorDirective, "[rdxNavigationMenuIndicator]", never, { "forceMount": { "alias": "forceMount"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
388
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuPositioner, never>;
|
|
389
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuPositioner, "[rdxNavigationMenuPositioner]", never, { "anchor": { "alias": "anchor"; "required": false; "isSignal": true; }; "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; }; "positionStrategy": { "alias": "positionStrategy"; "required": false; "isSignal": true; }; "updatePositionStrategy": { "alias": "updatePositionStrategy"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1$1.RdxPopperContentWrapper; inputs: { "anchor": "anchor"; "side": "side"; "sideOffset": "sideOffset"; "align": "align"; "alignOffset": "alignOffset"; "arrowPadding": "arrowPadding"; "avoidCollisions": "avoidCollisions"; "collisionBoundary": "collisionBoundary"; "collisionPadding": "collisionPadding"; "sticky": "sticky"; "hideWhenDetached": "hideWhenDetached"; "positionStrategy": "positionStrategy"; "updatePositionStrategy": "updatePositionStrategy"; }; outputs: {}; }]>;
|
|
259
390
|
}
|
|
260
391
|
|
|
261
|
-
|
|
392
|
+
/**
|
|
393
|
+
* The shared container for the active item's content.
|
|
394
|
+
*/
|
|
395
|
+
declare class RdxNavigationMenuPopup {
|
|
396
|
+
protected readonly rootContext: _radix_ng_primitives_navigation_menu.RdxNavigationMenuRootContext;
|
|
397
|
+
private readonly dismissableLayer;
|
|
398
|
+
private readonly wrapper;
|
|
399
|
+
private readonly layersContext;
|
|
262
400
|
private readonly elementRef;
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
private
|
|
268
|
-
|
|
269
|
-
/**
|
|
270
|
-
*
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
readonly
|
|
277
|
-
/**
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
401
|
+
protected readonly side: _angular_core.Signal<"top" | "right" | "bottom" | "left" | undefined>;
|
|
402
|
+
protected readonly align: _angular_core.Signal<"start" | "center" | "end" | undefined>;
|
|
403
|
+
/** Names the menu after the active trigger so the `role="menu"` element has an accessible name. */
|
|
404
|
+
protected readonly labelledBy: _angular_core.Signal<string | undefined>;
|
|
405
|
+
private dismissReason;
|
|
406
|
+
private dismissEvent;
|
|
407
|
+
/**
|
|
408
|
+
* Event handler called when the escape key is down. Can be prevented.
|
|
409
|
+
*/
|
|
410
|
+
readonly escapeKeyDown: _angular_core.OutputRef<KeyboardEvent>;
|
|
411
|
+
/**
|
|
412
|
+
* Event handler called when a pointerdown event happens outside the popup. Can be prevented.
|
|
413
|
+
*/
|
|
414
|
+
readonly pointerDownOutside: _angular_core.OutputRef<PointerEvent>;
|
|
415
|
+
/**
|
|
416
|
+
* Event handler called when focus moves outside the popup. Can be prevented.
|
|
417
|
+
*/
|
|
418
|
+
readonly focusOutside: _angular_core.OutputRef<FocusEvent>;
|
|
419
|
+
constructor();
|
|
420
|
+
protected onPointerLeave(event: PointerEvent): void;
|
|
421
|
+
/**
|
|
422
|
+
* Keyboard navigation inside the open panel: Down/Up move between the panel's focusable items in
|
|
423
|
+
* DOM order, Home/End jump to the first/last, and Up from the first item returns focus to the
|
|
424
|
+
* trigger. (Tab keeps working natively; Escape is handled by the dismissable layer.)
|
|
425
|
+
*/
|
|
426
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
427
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuPopup, never>;
|
|
428
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuPopup, "[rdxNavigationMenuPopup]", never, {}, { "escapeKeyDown": "escapeKeyDown"; "pointerDownOutside": "pointerDownOutside"; "focusOutside": "focusOutside"; }, never, never, true, [{ directive: typeof i1$1.RdxPopperContent; inputs: {}; outputs: {}; }, { directive: typeof i2.RdxDismissableLayer; inputs: {}; outputs: {}; }]>;
|
|
289
429
|
}
|
|
290
430
|
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
431
|
+
/**
|
|
432
|
+
* An optional arrow element pointing toward the active trigger.
|
|
433
|
+
*/
|
|
434
|
+
declare class RdxNavigationMenuArrow {
|
|
435
|
+
protected readonly rootContext: _radix_ng_primitives_navigation_menu.RdxNavigationMenuRootContext;
|
|
436
|
+
private readonly wrapper;
|
|
437
|
+
protected readonly side: _angular_core.Signal<"top" | "right" | "bottom" | "left" | undefined>;
|
|
438
|
+
protected readonly align: _angular_core.Signal<"start" | "center" | "end" | undefined>;
|
|
439
|
+
protected readonly uncentered: _angular_core.Signal<boolean>;
|
|
440
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuArrow, never>;
|
|
441
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuArrow, "[rdxNavigationMenuArrow]", never, {}, {}, never, never, true, [{ directive: typeof i1$1.RdxPopperArrow; inputs: {}; outputs: {}; }]>;
|
|
442
|
+
}
|
|
443
|
+
|
|
444
|
+
/**
|
|
445
|
+
* Clips and animates the active item's content. A single viewport is shared between all items; when
|
|
446
|
+
* the active item changes the outgoing content is retained as `data-previous` until its CSS
|
|
447
|
+
* animation/transition completes, and the new content is marked `data-current`.
|
|
448
|
+
*/
|
|
449
|
+
declare class RdxNavigationMenuViewport {
|
|
450
|
+
protected readonly rootContext: _radix_ng_primitives_navigation_menu.RdxNavigationMenuRootContext;
|
|
295
451
|
private readonly elementRef;
|
|
296
452
|
private readonly viewContainerRef;
|
|
297
453
|
private readonly renderer;
|
|
298
|
-
private readonly zone;
|
|
299
|
-
private readonly destroyRef;
|
|
300
454
|
/**
|
|
301
|
-
*
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
readonly
|
|
306
|
-
|
|
307
|
-
private readonly _activeContentNode;
|
|
308
|
-
private readonly _leavingContentNode;
|
|
309
|
-
private readonly _viewportSize;
|
|
310
|
-
readonly activeContentValue: i0.Signal<string | null>;
|
|
311
|
-
readonly isOpen: i0.Signal<boolean>;
|
|
312
|
-
readonly dataState: i0.Signal<"open" | "closed">;
|
|
313
|
-
readonly viewportSize: i0.Signal<{
|
|
455
|
+
* Keep the viewport mounted even when the menu is closed.
|
|
456
|
+
*/
|
|
457
|
+
readonly forceMount: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
458
|
+
protected readonly activationDirection: _angular_core.WritableSignal<string | undefined>;
|
|
459
|
+
protected readonly transitioning: _angular_core.WritableSignal<boolean>;
|
|
460
|
+
protected readonly size: _angular_core.WritableSignal<{
|
|
314
461
|
width: number;
|
|
315
462
|
height: number;
|
|
316
463
|
} | null>;
|
|
317
|
-
private
|
|
464
|
+
private current;
|
|
465
|
+
private previousElement;
|
|
466
|
+
private pendingDirection;
|
|
467
|
+
private cleanupTimer;
|
|
468
|
+
private readonly resizeObserver;
|
|
469
|
+
private readonly activeContent;
|
|
318
470
|
constructor();
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
private addNodeToDOM;
|
|
327
|
-
private removeNodeFromDOM;
|
|
328
|
-
private setNodeState;
|
|
329
|
-
private applyA11yAttributes;
|
|
330
|
-
private startLeaveTransition;
|
|
331
|
-
/**
|
|
332
|
-
* Cleanup function called after leave animation finishes
|
|
333
|
-
* @param node The node that is leaving
|
|
334
|
-
*/
|
|
335
|
-
private cleanupAfterLeave;
|
|
336
|
-
/**
|
|
337
|
-
* Cancels an ongoing leave transition (e.g., if user hovers back)
|
|
338
|
-
* @param node The node that is leaving
|
|
339
|
-
*/
|
|
340
|
-
private cancelLeaveTransition;
|
|
341
|
-
/**
|
|
342
|
-
* Force completes a leave transition (e.g., if another leave starts)
|
|
343
|
-
* @param node The node that is leaving
|
|
344
|
-
*/
|
|
345
|
-
private forceCompleteLeaveTransition;
|
|
346
|
-
private updateSize;
|
|
347
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<RdxNavigationMenuViewportDirective, never>;
|
|
348
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxNavigationMenuViewportDirective, "[rdxNavigationMenuViewport]", never, { "forceMount": { "alias": "forceMount"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
349
|
-
}
|
|
350
|
-
|
|
351
|
-
declare class RdxNavigationMenuFocusProxyComponent {
|
|
352
|
-
triggerElement: HTMLElement | null;
|
|
353
|
-
contentElement: HTMLElement | null;
|
|
354
|
-
proxyFocus: EventEmitter<"start" | "end">;
|
|
355
|
-
onFocus(event: Event): void;
|
|
356
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<RdxNavigationMenuFocusProxyComponent, never>;
|
|
357
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<RdxNavigationMenuFocusProxyComponent, "rdx-navigation-menu-focus-proxy", never, { "triggerElement": { "alias": "triggerElement"; "required": false; }; "contentElement": { "alias": "contentElement"; "required": false; }; }, { "proxyFocus": "proxyFocus"; }, never, never, true, never>;
|
|
358
|
-
}
|
|
359
|
-
declare class RdxNavigationMenuAriaOwnsComponent {
|
|
360
|
-
contentId: string;
|
|
361
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<RdxNavigationMenuAriaOwnsComponent, never>;
|
|
362
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<RdxNavigationMenuAriaOwnsComponent, "rdx-navigation-menu-aria-owns", never, { "contentId": { "alias": "contentId"; "required": false; }; }, {}, never, never, true, never>;
|
|
363
|
-
}
|
|
364
|
-
|
|
365
|
-
interface NavigationMenuContext {
|
|
366
|
-
isRootMenu: boolean;
|
|
367
|
-
value: () => string;
|
|
368
|
-
previousValue: () => string;
|
|
369
|
-
baseId: string;
|
|
370
|
-
dir: 'ltr' | 'rtl';
|
|
371
|
-
orientation: 'horizontal' | 'vertical';
|
|
372
|
-
loop: boolean;
|
|
373
|
-
rootNavigationMenu: () => HTMLElement | null;
|
|
374
|
-
indicatorTrack?: () => HTMLElement | null;
|
|
375
|
-
onIndicatorTrackChange?: (track: HTMLElement | null) => void;
|
|
376
|
-
userDismissedByClick?: () => boolean;
|
|
377
|
-
resetUserDismissed?: () => void;
|
|
378
|
-
viewport?: () => HTMLElement | null;
|
|
379
|
-
onViewportChange?: (viewport: HTMLElement | null) => void;
|
|
380
|
-
viewportContent?: () => Map<string, any>;
|
|
381
|
-
onViewportContentChange?: (contentValue: string, contentData: any) => void;
|
|
382
|
-
onViewportContentRemove?: (contentValue: string) => void;
|
|
383
|
-
onTriggerEnter?: (itemValue: string) => void;
|
|
384
|
-
onTriggerLeave?: () => void;
|
|
385
|
-
onContentEnter?: () => void;
|
|
386
|
-
onContentLeave?: () => void;
|
|
387
|
-
onItemSelect?: (itemValue: string) => void;
|
|
388
|
-
onItemDismiss?: () => void;
|
|
389
|
-
handleClose?: (force?: boolean) => void;
|
|
390
|
-
setTriggerPointerState?: (isOver: boolean) => void;
|
|
391
|
-
setContentPointerState?: (isOver: boolean) => void;
|
|
392
|
-
isPointerInSystem?: () => boolean;
|
|
471
|
+
private render;
|
|
472
|
+
private startLeave;
|
|
473
|
+
private removePrevious;
|
|
474
|
+
private clearCleanupTimer;
|
|
475
|
+
private measure;
|
|
476
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuViewport, never>;
|
|
477
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxNavigationMenuViewport, "[rdxNavigationMenuViewport]", never, { "forceMount": { "alias": "forceMount"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
393
478
|
}
|
|
394
|
-
declare const RDX_NAVIGATION_MENU_TOKEN: InjectionToken<NavigationMenuContext>;
|
|
395
|
-
declare function injectNavigationMenu(): NavigationMenuContext;
|
|
396
|
-
declare function isRootNavigationMenu(context: NavigationMenuContext): boolean;
|
|
397
|
-
declare function provideNavigationMenuContext(provider: Type<RdxNavigationMenuDirective | RdxNavigationMenuSubDirective>): Provider;
|
|
398
479
|
|
|
480
|
+
declare const navigationMenuImports: (typeof RdxNavigationMenuPortalPresence)[];
|
|
399
481
|
declare class RdxNavigationMenuModule {
|
|
400
|
-
static ɵfac:
|
|
401
|
-
static ɵmod:
|
|
402
|
-
static ɵinj:
|
|
482
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxNavigationMenuModule, never>;
|
|
483
|
+
static ɵmod: _angular_core.ɵɵNgModuleDeclaration<RdxNavigationMenuModule, never, [typeof RdxNavigationMenuRoot, typeof RdxNavigationMenuList, typeof RdxNavigationMenuItem, typeof RdxNavigationMenuTrigger, typeof RdxNavigationMenuIcon, typeof RdxNavigationMenuContent, typeof RdxNavigationMenuLink, typeof RdxNavigationMenuPortal, typeof RdxNavigationMenuPortalPresence, typeof RdxNavigationMenuBackdrop, typeof RdxNavigationMenuPositioner, typeof RdxNavigationMenuPopup, typeof RdxNavigationMenuArrow, typeof RdxNavigationMenuViewport], [typeof RdxNavigationMenuRoot, typeof RdxNavigationMenuList, typeof RdxNavigationMenuItem, typeof RdxNavigationMenuTrigger, typeof RdxNavigationMenuIcon, typeof RdxNavigationMenuContent, typeof RdxNavigationMenuLink, typeof RdxNavigationMenuPortal, typeof RdxNavigationMenuPortalPresence, typeof RdxNavigationMenuBackdrop, typeof RdxNavigationMenuPositioner, typeof RdxNavigationMenuPopup, typeof RdxNavigationMenuArrow, typeof RdxNavigationMenuViewport]>;
|
|
484
|
+
static ɵinj: _angular_core.ɵɵInjectorDeclaration<RdxNavigationMenuModule>;
|
|
403
485
|
}
|
|
404
486
|
|
|
405
|
-
export {
|
|
406
|
-
export type {
|
|
487
|
+
export { RdxNavigationMenuArrow, RdxNavigationMenuBackdrop, RdxNavigationMenuContent, RdxNavigationMenuIcon, RdxNavigationMenuItem, RdxNavigationMenuLink, RdxNavigationMenuList, RdxNavigationMenuModule, RdxNavigationMenuPopup, RdxNavigationMenuPortal, RdxNavigationMenuPortalPresence, RdxNavigationMenuPositioner, RdxNavigationMenuRoot, RdxNavigationMenuTrigger, RdxNavigationMenuViewport, injectNavigationMenuRootContext, navigationMenuImports, provideNavigationMenuRootContext };
|
|
488
|
+
export type { NavigationMenuDirection, NavigationMenuOrientation, RdxNavigationMenuContentEntry, RdxNavigationMenuOpenChange, RdxNavigationMenuOpenChangeReason, RdxNavigationMenuRootContext };
|