ng-primitives 0.34.0 → 0.36.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/a11y/index.d.ts +1 -1
- package/a11y/visually-hidden/visually-hidden-state.d.ts +52 -0
- package/a11y/visually-hidden/visually-hidden.d.ts +1 -0
- package/accordion/accordion/accordion-state.d.ts +1 -1
- package/accordion/accordion-item/accordion-item-state.d.ts +1 -1
- package/avatar/avatar/avatar-state.d.ts +1 -1
- package/avatar/avatar-image/avatar-image.d.ts +36 -1
- package/button/button/button-state.d.ts +12 -2
- package/button/button/button.d.ts +1 -2
- package/button/index.d.ts +1 -1
- package/checkbox/checkbox/checkbox-state.d.ts +1 -1
- package/checkbox/checkbox/checkbox.d.ts +3 -4
- package/date-picker/date-picker/date-picker-state.d.ts +1 -1
- package/date-picker/date-picker-date-button/date-picker-date-button.d.ts +1 -2
- package/date-picker/date-picker-next-month/date-picker-next-month.d.ts +2 -2
- package/date-picker/date-picker-previous-month/date-picker-previous-month.d.ts +2 -2
- package/date-picker/index.d.ts +5 -9
- package/dialog/dialog/dialog-state.d.ts +1 -1
- package/dialog/index.d.ts +0 -4
- package/fesm2022/ng-primitives-a11y.mjs +20 -9
- package/fesm2022/ng-primitives-a11y.mjs.map +1 -1
- package/fesm2022/ng-primitives-avatar.mjs +3 -3
- package/fesm2022/ng-primitives-avatar.mjs.map +1 -1
- package/fesm2022/ng-primitives-button.mjs +18 -5
- package/fesm2022/ng-primitives-button.mjs.map +1 -1
- package/fesm2022/ng-primitives-checkbox.mjs +13 -8
- package/fesm2022/ng-primitives-checkbox.mjs.map +1 -1
- package/fesm2022/ng-primitives-date-picker.mjs +13 -65
- package/fesm2022/ng-primitives-date-picker.mjs.map +1 -1
- package/fesm2022/ng-primitives-dialog.mjs +5 -41
- package/fesm2022/ng-primitives-dialog.mjs.map +1 -1
- package/fesm2022/ng-primitives-file-upload.mjs +12 -5
- package/fesm2022/ng-primitives-file-upload.mjs.map +1 -1
- package/fesm2022/ng-primitives-focus-trap.mjs +3 -12
- package/fesm2022/ng-primitives-focus-trap.mjs.map +1 -1
- package/fesm2022/ng-primitives-form-field.mjs +103 -93
- package/fesm2022/ng-primitives-form-field.mjs.map +1 -1
- package/fesm2022/ng-primitives-input.mjs +34 -21
- package/fesm2022/ng-primitives-input.mjs.map +1 -1
- package/fesm2022/ng-primitives-interactions.mjs +14 -80
- package/fesm2022/ng-primitives-interactions.mjs.map +1 -1
- package/fesm2022/ng-primitives-internal.mjs +93 -65
- package/fesm2022/ng-primitives-internal.mjs.map +1 -1
- package/fesm2022/ng-primitives-listbox.mjs +19 -48
- package/fesm2022/ng-primitives-listbox.mjs.map +1 -1
- package/fesm2022/ng-primitives-menu.mjs +1 -5
- package/fesm2022/ng-primitives-menu.mjs.map +1 -1
- package/fesm2022/ng-primitives-pagination.mjs +53 -147
- package/fesm2022/ng-primitives-pagination.mjs.map +1 -1
- package/fesm2022/ng-primitives-popover.mjs +105 -96
- package/fesm2022/ng-primitives-popover.mjs.map +1 -1
- package/fesm2022/ng-primitives-progress.mjs +4 -18
- package/fesm2022/ng-primitives-progress.mjs.map +1 -1
- package/fesm2022/ng-primitives-radio.mjs +9 -5
- package/fesm2022/ng-primitives-radio.mjs.map +1 -1
- package/fesm2022/ng-primitives-roving-focus.mjs +2 -12
- package/fesm2022/ng-primitives-roving-focus.mjs.map +1 -1
- package/fesm2022/ng-primitives-select.mjs +35 -21
- package/fesm2022/ng-primitives-select.mjs.map +1 -1
- package/fesm2022/ng-primitives-separator.mjs +2 -11
- package/fesm2022/ng-primitives-separator.mjs.map +1 -1
- package/fesm2022/ng-primitives-slider.mjs +62 -120
- package/fesm2022/ng-primitives-slider.mjs.map +1 -1
- package/fesm2022/ng-primitives-state.mjs +10 -3
- package/fesm2022/ng-primitives-state.mjs.map +1 -1
- package/fesm2022/ng-primitives-switch.mjs +22 -35
- package/fesm2022/ng-primitives-switch.mjs.map +1 -1
- package/fesm2022/ng-primitives-tabs.mjs +17 -22
- package/fesm2022/ng-primitives-tabs.mjs.map +1 -1
- package/fesm2022/ng-primitives-textarea.mjs +34 -21
- package/fesm2022/ng-primitives-textarea.mjs.map +1 -1
- package/fesm2022/ng-primitives-toast.mjs +27 -16
- package/fesm2022/ng-primitives-toast.mjs.map +1 -1
- package/fesm2022/ng-primitives-toggle-group.mjs +26 -49
- package/fesm2022/ng-primitives-toggle-group.mjs.map +1 -1
- package/fesm2022/ng-primitives-toggle.mjs +4 -18
- package/fesm2022/ng-primitives-toggle.mjs.map +1 -1
- package/fesm2022/ng-primitives-toolbar.mjs +3 -18
- package/fesm2022/ng-primitives-toolbar.mjs.map +1 -1
- package/fesm2022/ng-primitives-tooltip.mjs +103 -82
- package/fesm2022/ng-primitives-tooltip.mjs.map +1 -1
- package/fesm2022/ng-primitives-utils.mjs +18 -0
- package/fesm2022/ng-primitives-utils.mjs.map +1 -1
- package/file-upload/file-dropzone/file-dropzone-state.d.ts +2 -2
- package/file-upload/file-dropzone/file-dropzone.d.ts +3 -2
- package/file-upload/file-upload/file-upload-state.d.ts +2 -2
- package/file-upload/file-upload/file-upload.d.ts +3 -2
- package/focus-trap/index.d.ts +0 -1
- package/form-field/description/description.d.ts +25 -1
- package/form-field/error/error.d.ts +25 -1
- package/form-field/form-control/form-control-state.d.ts +58 -0
- package/form-field/form-control/form-control.d.ts +36 -7
- package/form-field/form-field/form-field-state.d.ts +41 -0
- package/form-field/form-field/form-field.d.ts +4 -0
- package/form-field/index.d.ts +2 -5
- package/form-field/label/label.d.ts +26 -2
- package/input/index.d.ts +1 -1
- package/input/input/input-state.d.ts +30 -0
- package/input/input/input.d.ts +7 -5
- package/interactions/focus/focus.d.ts +0 -4
- package/interactions/focus-visible/focus-visible.d.ts +0 -4
- package/interactions/hover/hover.d.ts +0 -4
- package/interactions/index.d.ts +0 -5
- package/interactions/move/move.d.ts +0 -4
- package/interactions/press/press.d.ts +0 -4
- package/internal/exit-animation/exit-animation-manager.d.ts +17 -0
- package/internal/exit-animation/exit-animation.d.ts +4 -17
- package/internal/index.d.ts +3 -2
- package/internal/interactions/interactions.d.ts +5 -1
- package/internal/signals/sync-state.d.ts +2 -0
- package/listbox/index.d.ts +0 -4
- package/listbox/listbox/listbox-state.d.ts +2 -2
- package/package.json +9 -9
- package/pagination/index.d.ts +0 -6
- package/pagination/pagination/pagination-state.d.ts +2 -2
- package/pagination/pagination/pagination.d.ts +5 -5
- package/pagination/pagination-button/pagination-button.d.ts +4 -8
- package/pagination/pagination-first/pagination-first.d.ts +4 -8
- package/pagination/pagination-last/pagination-last.d.ts +3 -7
- package/pagination/pagination-next/pagination-next.d.ts +4 -8
- package/pagination/pagination-previous/pagination-previous.d.ts +4 -8
- package/popover/index.d.ts +1 -2
- package/popover/popover/popover-token.d.ts +8 -5
- package/popover/popover/popover.d.ts +3 -2
- package/popover/popover-trigger/popover-trigger-state.d.ts +5 -3
- package/popover/popover-trigger/popover-trigger.d.ts +27 -19
- package/progress/index.d.ts +0 -1
- package/progress/progress/progress-state.d.ts +1 -1
- package/radio/radio-group/radio-group-state.d.ts +1 -1
- package/radio/radio-group/radio-group.d.ts +2 -2
- package/radio/radio-item/radio-item-state.d.ts +1 -1
- package/roving-focus/index.d.ts +2 -3
- package/roving-focus/roving-focus-group/roving-focus-group-state.d.ts +1 -1
- package/schematics/ng-generate/schema.d.ts +4 -1
- package/schematics/ng-generate/schema.json +4 -1
- package/schematics/ng-generate/templates/toast/toast.__fileSuffix@dasherize__.ts.template +111 -0
- package/schematics/ng-generate/templates/toolbar/toolbar-button.__fileSuffix@dasherize__.ts.template +58 -0
- package/schematics/ng-generate/templates/toolbar/toolbar.__fileSuffix@dasherize__.ts.template +29 -0
- package/schematics/ng-generate/templates/tooltip/tooltip-trigger.__fileSuffix@dasherize__.ts.template +35 -0
- package/schematics/ng-generate/templates/tooltip/tooltip.__fileSuffix@dasherize__.ts.template +60 -0
- package/search/search/search-state.d.ts +1 -1
- package/select/index.d.ts +1 -1
- package/select/select/select-state.d.ts +20 -0
- package/select/select/select.d.ts +7 -4
- package/separator/index.d.ts +1 -2
- package/slider/index.d.ts +0 -4
- package/slider/slider/slider-state.d.ts +1 -1
- package/slider/slider/slider.d.ts +2 -2
- package/slider/slider-range/slider-range.d.ts +1 -1
- package/slider/slider-thumb/slider-thumb.d.ts +3 -7
- package/slider/slider-track/slider-track.d.ts +1 -5
- package/state/index.d.ts +7 -1
- package/switch/index.d.ts +0 -1
- package/switch/switch/switch-state.d.ts +1 -1
- package/switch/switch/switch.d.ts +3 -4
- package/switch/switch-thumb/switch-thumb.d.ts +2 -2
- package/tabs/index.d.ts +1 -2
- package/tabs/tab-button/tab-button.d.ts +2 -2
- package/tabs/tabset/tabset-state.d.ts +1 -1
- package/textarea/index.d.ts +1 -1
- package/textarea/textarea/textarea-state.d.ts +20 -0
- package/textarea/textarea/textarea.d.ts +7 -4
- package/toast/index.d.ts +0 -1
- package/toast/toast/toast.d.ts +21 -1
- package/toggle/index.d.ts +0 -1
- package/toggle/toggle/toggle-state.d.ts +1 -1
- package/toggle-group/index.d.ts +0 -2
- package/toggle-group/toggle-group/toggle-group-state.d.ts +1 -1
- package/toggle-group/toggle-group-item/toggle-group-item-state.d.ts +15 -2
- package/toggle-group/toggle-group-item/toggle-group-item.d.ts +1 -1
- package/toolbar/index.d.ts +0 -1
- package/tooltip/index.d.ts +1 -2
- package/tooltip/tooltip/tooltip-token.d.ts +8 -5
- package/tooltip/tooltip/tooltip.d.ts +2 -1
- package/tooltip/tooltip-trigger/tooltip-trigger-state.d.ts +3 -3
- package/tooltip/tooltip-trigger/tooltip-trigger.d.ts +43 -22
- package/a11y/visually-hidden/visually-hidden-token.d.ts +0 -7
- package/date-picker/date-picker-cell/date-picker-cell-token.d.ts +0 -7
- package/date-picker/date-picker-grid/date-picker-grid-token.d.ts +0 -7
- package/date-picker/date-picker-next-month/date-picker-next-month-token.d.ts +0 -7
- package/date-picker/date-picker-previous-month/date-picker-previous-month-token.d.ts +0 -7
- package/dialog/dialog-description/dialog-description-token.d.ts +0 -7
- package/dialog/dialog-overlay/dialog-overlay-token.d.ts +0 -7
- package/dialog/dialog-title/dialog-title-token.d.ts +0 -7
- package/dialog/dialog-trigger/dialog-trigger-token.d.ts +0 -7
- package/focus-trap/focus-trap/focus-trap-token.d.ts +0 -7
- package/form-field/description/description-token.d.ts +0 -7
- package/form-field/error/error-token.d.ts +0 -7
- package/form-field/form-control/form-control-token.d.ts +0 -7
- package/form-field/form-field/form-field-token.d.ts +0 -8
- package/form-field/label/label-token.d.ts +0 -7
- package/input/input/input-token.d.ts +0 -7
- package/interactions/focus/focus-token.d.ts +0 -7
- package/interactions/focus-visible/focus-visible-token.d.ts +0 -7
- package/interactions/hover/hover-token.d.ts +0 -8
- package/interactions/move/move-token.d.ts +0 -7
- package/interactions/press/press-token.d.ts +0 -7
- package/internal/disabled/disabled.d.ts +0 -14
- package/listbox/listbox/listbox-token.d.ts +0 -7
- package/listbox/listbox-option/listbox-option-token.d.ts +0 -7
- package/listbox/listbox-section/listbox-section-token.d.ts +0 -7
- package/listbox/listbox-trigger/listbox-trigger-token.d.ts +0 -7
- package/pagination/pagination/pagination-token.d.ts +0 -8
- package/pagination/pagination-button/pagination-button-token.d.ts +0 -7
- package/pagination/pagination-first/pagination-first-token.d.ts +0 -7
- package/pagination/pagination-last/pagination-last-token.d.ts +0 -7
- package/pagination/pagination-next/pagination-next-token.d.ts +0 -7
- package/pagination/pagination-previous/pagination-previous-token.d.ts +0 -7
- package/popover/popover-trigger/popover-trigger-token.d.ts +0 -12
- package/progress/progress/progress-token.d.ts +0 -11
- package/roving-focus/roving-focus-item/roving-focus-item-token.d.ts +0 -8
- package/select/select/select-token.d.ts +0 -7
- package/separator/separator/separator-token.d.ts +0 -7
- package/slider/slider/slider-token.d.ts +0 -8
- package/slider/slider-range/slider-range-token.d.ts +0 -8
- package/slider/slider-thumb/slider-thumb-token.d.ts +0 -8
- package/slider/slider-track/slider-track-token.d.ts +0 -8
- package/switch/switch/switch-token.d.ts +0 -11
- package/tabs/tabset/tabset-token.d.ts +0 -11
- package/textarea/textarea/textarea-token.d.ts +0 -7
- package/toast/toast/toast-token.d.ts +0 -7
- package/toggle/toggle/toggle-token.d.ts +0 -11
- package/toggle-group/toggle-group/toggle-group-token.d.ts +0 -11
- package/toggle-group/toggle-group-item/toggle-group-item-token.d.ts +0 -11
- package/toolbar/toolbar/toolbar-token.d.ts +0 -11
- package/tooltip/tooltip-trigger/tooltip-trigger-token.d.ts +0 -15
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { InjectionToken, inject, ElementRef, ViewContainerRef, Injector, input, booleanAttribute,
|
|
3
|
-
import { TemplatePortal, DomPortalOutlet } from '@angular/cdk/portal';
|
|
2
|
+
import { InjectionToken, inject, ElementRef, ViewContainerRef, Injector, input, booleanAttribute, numberAttribute, computed, signal, TemplateRef, Type, ComponentRef, Directive, PLATFORM_ID, isDevMode } from '@angular/core';
|
|
3
|
+
import { TemplatePortal, ComponentPortal, DomPortalOutlet } from '@angular/cdk/portal';
|
|
4
4
|
import { DOCUMENT, isPlatformBrowser } from '@angular/common';
|
|
5
5
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
6
6
|
import { offset, shift, flip, autoUpdate, computePosition } from '@floating-ui/dom';
|
|
7
|
+
import * as i1 from 'ng-primitives/internal';
|
|
8
|
+
import { injectExitAnimationManager, provideExitAnimationManager, NgpExitAnimation } from 'ng-primitives/internal';
|
|
7
9
|
import { fromResizeEvent } from 'ng-primitives/resize';
|
|
8
|
-
import { injectDisposables
|
|
10
|
+
import { injectDisposables } from 'ng-primitives/utils';
|
|
9
11
|
import { createStateToken, createStateProvider, createStateInjector, createState } from 'ng-primitives/state';
|
|
10
12
|
import { getTransformOrigin } from 'ng-primitives/popover';
|
|
11
13
|
|
|
@@ -39,6 +41,20 @@ function injectTooltipConfig() {
|
|
|
39
41
|
return inject(NgpTooltipConfigToken, { optional: true }) ?? defaultTooltipConfig;
|
|
40
42
|
}
|
|
41
43
|
|
|
44
|
+
const NgpTooltipContextToken = new InjectionToken('NgpTooltipContextToken');
|
|
45
|
+
/**
|
|
46
|
+
* Inject the Tooltip context
|
|
47
|
+
*/
|
|
48
|
+
function injectTooltipContext() {
|
|
49
|
+
return inject(NgpTooltipContextToken);
|
|
50
|
+
}
|
|
51
|
+
/**
|
|
52
|
+
* Provide the Tooltip directive instance
|
|
53
|
+
*/
|
|
54
|
+
function provideTooltipContext(context) {
|
|
55
|
+
return { provide: NgpTooltipContextToken, useValue: context };
|
|
56
|
+
}
|
|
57
|
+
|
|
42
58
|
/**
|
|
43
59
|
* The state token for the TooltipTrigger primitive.
|
|
44
60
|
*/
|
|
@@ -56,26 +72,15 @@ const injectTooltipTriggerState = createStateInjector(NgpTooltipTriggerStateToke
|
|
|
56
72
|
*/
|
|
57
73
|
const tooltipTriggerState = createState(NgpTooltipTriggerStateToken);
|
|
58
74
|
|
|
59
|
-
const NgpTooltipTriggerToken = new InjectionToken('NgpTooltipTriggerToken');
|
|
60
|
-
/**
|
|
61
|
-
* Inject the TooltipTrigger directive instance
|
|
62
|
-
*/
|
|
63
|
-
function injectTooltipTrigger() {
|
|
64
|
-
return inject(NgpTooltipTriggerToken);
|
|
65
|
-
}
|
|
66
|
-
/**
|
|
67
|
-
* Provides the TooltipTrigger directive instance
|
|
68
|
-
* @param trigger
|
|
69
|
-
*/
|
|
70
|
-
function provideTooltipTrigger(trigger) {
|
|
71
|
-
return { provide: NgpTooltipTriggerToken, useValue: trigger };
|
|
72
|
-
}
|
|
73
|
-
|
|
74
75
|
/**
|
|
75
76
|
* Apply the `ngpTooltipTrigger` directive to an element that triggers the tooltip to show.
|
|
76
77
|
*/
|
|
77
78
|
class NgpTooltipTrigger {
|
|
78
79
|
constructor() {
|
|
80
|
+
/**
|
|
81
|
+
* Access the exit animation manager.
|
|
82
|
+
*/
|
|
83
|
+
this.exitAnimationManager = injectExitAnimationManager();
|
|
79
84
|
/**
|
|
80
85
|
* Access the trigger element
|
|
81
86
|
*/
|
|
@@ -103,23 +108,9 @@ class NgpTooltipTrigger {
|
|
|
103
108
|
/**
|
|
104
109
|
* Access the tooltip template ref.
|
|
105
110
|
*/
|
|
106
|
-
this.tooltip = input
|
|
111
|
+
this.tooltip = input(null, {
|
|
107
112
|
alias: 'ngpTooltipTrigger',
|
|
108
113
|
});
|
|
109
|
-
/**
|
|
110
|
-
* The open state of the tooltip.
|
|
111
|
-
* @default false
|
|
112
|
-
*/
|
|
113
|
-
this.open = input(false, {
|
|
114
|
-
alias: 'ngpTooltipTriggerOpen',
|
|
115
|
-
transform: booleanAttribute,
|
|
116
|
-
});
|
|
117
|
-
/**
|
|
118
|
-
* Emit an event when the tooltip is opened or closed.
|
|
119
|
-
*/
|
|
120
|
-
this.openChange = output({
|
|
121
|
-
alias: 'ngpTooltipTriggerOpenChange',
|
|
122
|
-
});
|
|
123
114
|
/**
|
|
124
115
|
* Define if the trigger should be disabled.
|
|
125
116
|
* @default false
|
|
@@ -174,6 +165,13 @@ class NgpTooltipTrigger {
|
|
|
174
165
|
this.container = input(this.config.container, {
|
|
175
166
|
alias: 'ngpTooltipTriggerContainer',
|
|
176
167
|
});
|
|
168
|
+
/**
|
|
169
|
+
* Provide context to the tooltip.
|
|
170
|
+
* @default null
|
|
171
|
+
*/
|
|
172
|
+
this.context = input(null, {
|
|
173
|
+
alias: 'ngpTooltipTriggerContext',
|
|
174
|
+
});
|
|
177
175
|
/**
|
|
178
176
|
* Store the tooltip view ref.
|
|
179
177
|
*/
|
|
@@ -197,17 +195,15 @@ class NgpTooltipTrigger {
|
|
|
197
195
|
y: 0,
|
|
198
196
|
});
|
|
199
197
|
/**
|
|
200
|
-
* Store the state of the tooltip.
|
|
201
198
|
* @internal
|
|
199
|
+
* Store the trigger width.
|
|
202
200
|
*/
|
|
203
|
-
this.
|
|
201
|
+
this.width = signal(null);
|
|
204
202
|
/**
|
|
203
|
+
* Store the state of the tooltip.
|
|
205
204
|
* @internal
|
|
206
|
-
* Store the trigger width.
|
|
207
205
|
*/
|
|
208
|
-
this.
|
|
209
|
-
// any time the open state changes then show or hide the tooltip
|
|
210
|
-
onBooleanChange(this.state.open, this.show.bind(this), this.hide.bind(this));
|
|
206
|
+
this.state = tooltipTriggerState(this);
|
|
211
207
|
// update the width of the trigger when it resizes
|
|
212
208
|
fromResizeEvent(this.trigger.nativeElement)
|
|
213
209
|
.pipe(takeUntilDestroyed())
|
|
@@ -216,33 +212,72 @@ class NgpTooltipTrigger {
|
|
|
216
212
|
ngOnDestroy() {
|
|
217
213
|
this.destroyTooltip();
|
|
218
214
|
}
|
|
215
|
+
/**
|
|
216
|
+
* Show the tooltip.
|
|
217
|
+
*/
|
|
219
218
|
show() {
|
|
219
|
+
// if closing is in progress then clear the timeout to stop the popover from closing
|
|
220
|
+
if (this.closeTimeout) {
|
|
221
|
+
this.closeTimeout();
|
|
222
|
+
this.closeTimeout = undefined;
|
|
223
|
+
}
|
|
220
224
|
// if the trigger is disabled or the tooltip is already open then do not show the tooltip
|
|
221
|
-
if (this.state.disabled() || this.
|
|
225
|
+
if (this.state.disabled() || this.openTimeout) {
|
|
226
|
+
return;
|
|
227
|
+
}
|
|
228
|
+
// if the tooltip exists in the DOM then do not create it again
|
|
229
|
+
if (this.viewRef) {
|
|
222
230
|
return;
|
|
223
231
|
}
|
|
224
|
-
this.
|
|
225
|
-
this.openChange.emit(true);
|
|
226
|
-
this.disposables.setTimeout(() => this.createTooltip(), this.state.showDelay());
|
|
232
|
+
this.openTimeout = this.disposables.setTimeout(() => this.createTooltip(), this.state.showDelay());
|
|
227
233
|
}
|
|
234
|
+
/**
|
|
235
|
+
* Hide the tooltip.
|
|
236
|
+
*/
|
|
228
237
|
hide() {
|
|
238
|
+
// if closing is in progress then clear the timeout to stop the popover from opening
|
|
239
|
+
if (this.openTimeout) {
|
|
240
|
+
this.openTimeout();
|
|
241
|
+
this.openTimeout = undefined;
|
|
242
|
+
}
|
|
229
243
|
// if the trigger is disabled or the tooltip is already closed then do not hide the tooltip
|
|
230
|
-
if (this.state.disabled() ||
|
|
244
|
+
if (this.state.disabled() || this.closeTimeout) {
|
|
231
245
|
return;
|
|
232
246
|
}
|
|
233
|
-
this.
|
|
234
|
-
this.openChange.emit(false);
|
|
235
|
-
this.disposables.setTimeout(() => this.destroyTooltip(), this.state.hideDelay());
|
|
247
|
+
this.closeTimeout = this.disposables.setTimeout(() => this.destroyTooltip(), this.state.hideDelay());
|
|
236
248
|
}
|
|
237
249
|
createTooltip() {
|
|
238
|
-
|
|
239
|
-
const
|
|
250
|
+
this.openTimeout = undefined;
|
|
251
|
+
const tooltip = this.state.tooltip();
|
|
252
|
+
let portal;
|
|
253
|
+
// Create a new inject with the tooltip context
|
|
254
|
+
const injector = Injector.create({
|
|
240
255
|
parent: this.injector,
|
|
241
|
-
providers: [
|
|
242
|
-
})
|
|
256
|
+
providers: [provideTooltipContext(this.state.context())],
|
|
257
|
+
});
|
|
258
|
+
if (tooltip instanceof TemplateRef) {
|
|
259
|
+
portal = new TemplatePortal(tooltip, this.viewContainerRef, { $implicit: this.state.context() }, injector);
|
|
260
|
+
}
|
|
261
|
+
else if (tooltip instanceof Type) {
|
|
262
|
+
portal = new ComponentPortal(tooltip, this.viewContainerRef, injector);
|
|
263
|
+
}
|
|
264
|
+
else {
|
|
265
|
+
throw new Error('Tooltip must be either a TemplateRef or a ComponentType');
|
|
266
|
+
}
|
|
267
|
+
const domOutlet = new DomPortalOutlet(this.state.container() ?? this.document.body, undefined, undefined, injector);
|
|
243
268
|
this.viewRef = domOutlet.attach(portal);
|
|
244
|
-
|
|
245
|
-
|
|
269
|
+
let outletElement = null;
|
|
270
|
+
if (this.viewRef instanceof ComponentRef) {
|
|
271
|
+
this.viewRef.changeDetectorRef.detectChanges();
|
|
272
|
+
outletElement = this.viewRef.location.nativeElement;
|
|
273
|
+
}
|
|
274
|
+
else if (this.viewRef) {
|
|
275
|
+
this.viewRef.detectChanges();
|
|
276
|
+
outletElement = this.viewRef.rootNodes[0];
|
|
277
|
+
}
|
|
278
|
+
if (!outletElement) {
|
|
279
|
+
throw new Error('Outlet element is not available.');
|
|
280
|
+
}
|
|
246
281
|
// we want to determine the strategy to use. If the tooltip has position: fixed then we want to use
|
|
247
282
|
// fixed positioning. Otherwise we want to use absolute positioning.
|
|
248
283
|
const strategy = getComputedStyle(outletElement).position === 'fixed' ? 'fixed' : 'absolute';
|
|
@@ -255,31 +290,25 @@ class NgpTooltipTrigger {
|
|
|
255
290
|
this.position.set({ x: position.x, y: position.y });
|
|
256
291
|
});
|
|
257
292
|
}
|
|
258
|
-
destroyTooltip() {
|
|
259
|
-
this.
|
|
260
|
-
this.
|
|
293
|
+
async destroyTooltip() {
|
|
294
|
+
this.closeTimeout = undefined;
|
|
295
|
+
await this.exitAnimationManager.exit();
|
|
261
296
|
this.viewRef?.destroy();
|
|
262
297
|
this.viewRef = null;
|
|
263
298
|
this.dispose?.();
|
|
264
299
|
}
|
|
265
300
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTooltipTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
266
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.7", type: NgpTooltipTrigger, isStandalone: true, selector: "[ngpTooltipTrigger]", inputs: { tooltip: { classPropertyName: "tooltip", publicName: "ngpTooltipTrigger", isSignal: true, isRequired:
|
|
267
|
-
provideTooltipTriggerState(),
|
|
268
|
-
{ provide: NgpTooltipTriggerToken, useExisting: NgpTooltipTrigger },
|
|
269
|
-
], exportAs: ["ngpTooltipTrigger"], ngImport: i0 }); }
|
|
301
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.7", type: NgpTooltipTrigger, isStandalone: true, selector: "[ngpTooltipTrigger]", inputs: { tooltip: { classPropertyName: "tooltip", publicName: "ngpTooltipTrigger", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpTooltipTriggerDisabled", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "ngpTooltipTriggerPlacement", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "ngpTooltipTriggerOffset", isSignal: true, isRequired: false, transformFunction: null }, showDelay: { classPropertyName: "showDelay", publicName: "ngpTooltipTriggerShowDelay", isSignal: true, isRequired: false, transformFunction: null }, hideDelay: { classPropertyName: "hideDelay", publicName: "ngpTooltipTriggerHideDelay", isSignal: true, isRequired: false, transformFunction: null }, flip: { classPropertyName: "flip", publicName: "ngpTooltipTriggerFlip", isSignal: true, isRequired: false, transformFunction: null }, container: { classPropertyName: "container", publicName: "ngpTooltipTriggerContainer", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "ngpTooltipTriggerContext", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "show()", "mouseleave": "hide()", "focus": "show()", "blur": "hide()" }, properties: { "attr.data-open": "viewRef !== null ? \"\" : null", "attr.data-disabled": "state.disabled() ? \"\" : null" } }, providers: [provideTooltipTriggerState(), provideExitAnimationManager()], exportAs: ["ngpTooltipTrigger"], ngImport: i0 }); }
|
|
270
302
|
}
|
|
271
303
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTooltipTrigger, decorators: [{
|
|
272
304
|
type: Directive,
|
|
273
305
|
args: [{
|
|
274
306
|
selector: '[ngpTooltipTrigger]',
|
|
275
307
|
exportAs: 'ngpTooltipTrigger',
|
|
276
|
-
providers: [
|
|
277
|
-
provideTooltipTriggerState(),
|
|
278
|
-
{ provide: NgpTooltipTriggerToken, useExisting: NgpTooltipTrigger },
|
|
279
|
-
],
|
|
308
|
+
providers: [provideTooltipTriggerState(), provideExitAnimationManager()],
|
|
280
309
|
host: {
|
|
281
|
-
'[attr.data-open]': '
|
|
282
|
-
'[attr.data-disabled]': 'disabled() ? "" : null',
|
|
310
|
+
'[attr.data-open]': 'viewRef !== null ? "" : null',
|
|
311
|
+
'[attr.data-disabled]': 'state.disabled() ? "" : null',
|
|
283
312
|
'(mouseenter)': 'show()',
|
|
284
313
|
'(mouseleave)': 'hide()',
|
|
285
314
|
'(focus)': 'show()',
|
|
@@ -288,14 +317,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
|
|
|
288
317
|
}]
|
|
289
318
|
}], ctorParameters: () => [] });
|
|
290
319
|
|
|
291
|
-
const NgpTooltipToken = new InjectionToken('NgpTooltipToken');
|
|
292
|
-
/**
|
|
293
|
-
* Inject the Tooltip directive instance
|
|
294
|
-
*/
|
|
295
|
-
function injectTooltip() {
|
|
296
|
-
return inject(NgpTooltipToken);
|
|
297
|
-
}
|
|
298
|
-
|
|
299
320
|
/**
|
|
300
321
|
* Apply the `ngpTooltip` directive to an element that represents the tooltip. This typically would be a `div` inside an `ng-template`.
|
|
301
322
|
*/
|
|
@@ -312,19 +333,19 @@ class NgpTooltip {
|
|
|
312
333
|
/**
|
|
313
334
|
* Access the trigger instance.
|
|
314
335
|
*/
|
|
315
|
-
this.trigger =
|
|
336
|
+
this.trigger = injectTooltipTriggerState();
|
|
316
337
|
/**
|
|
317
338
|
* Compute the x position of the tooltip.
|
|
318
339
|
*/
|
|
319
|
-
this.x = computed(() => this.trigger.position().x);
|
|
340
|
+
this.x = computed(() => this.trigger().position().x);
|
|
320
341
|
/**
|
|
321
342
|
* Compute the y position of the tooltip.
|
|
322
343
|
*/
|
|
323
|
-
this.y = computed(() => this.trigger.position().y);
|
|
344
|
+
this.y = computed(() => this.trigger().position().y);
|
|
324
345
|
/**
|
|
325
346
|
* Derive the transform origin of the popover.
|
|
326
347
|
*/
|
|
327
|
-
this.transformOrigin = computed(() => getTransformOrigin(this.trigger.placement()));
|
|
348
|
+
this.transformOrigin = computed(() => getTransformOrigin(this.trigger().placement()));
|
|
328
349
|
}
|
|
329
350
|
ngOnInit() {
|
|
330
351
|
// if the element does not have a fixed position then throw a warning in dev mode
|
|
@@ -336,19 +357,19 @@ class NgpTooltip {
|
|
|
336
357
|
}
|
|
337
358
|
}
|
|
338
359
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTooltip, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
339
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NgpTooltip, isStandalone: true, selector: "[ngpTooltip]", host: { attributes: { "role": "tooltip" }, properties: { "style.left.px": "x()", "style.top.px": "y()", "style.--ngp-tooltip-trigger-width.px": "trigger.width()", "style.--ngp-tooltip-transform-origin": "transformOrigin()" } },
|
|
360
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NgpTooltip, isStandalone: true, selector: "[ngpTooltip]", host: { attributes: { "role": "tooltip" }, properties: { "style.left.px": "x()", "style.top.px": "y()", "style.--ngp-tooltip-trigger-width.px": "trigger().width()", "style.--ngp-tooltip-transform-origin": "transformOrigin()" } }, exportAs: ["ngpTooltip"], hostDirectives: [{ directive: i1.NgpExitAnimation }], ngImport: i0 }); }
|
|
340
361
|
}
|
|
341
362
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTooltip, decorators: [{
|
|
342
363
|
type: Directive,
|
|
343
364
|
args: [{
|
|
344
365
|
selector: '[ngpTooltip]',
|
|
345
366
|
exportAs: 'ngpTooltip',
|
|
346
|
-
|
|
367
|
+
hostDirectives: [NgpExitAnimation],
|
|
347
368
|
host: {
|
|
348
369
|
role: 'tooltip',
|
|
349
370
|
'[style.left.px]': 'x()',
|
|
350
371
|
'[style.top.px]': 'y()',
|
|
351
|
-
'[style.--ngp-tooltip-trigger-width.px]': 'trigger.width()',
|
|
372
|
+
'[style.--ngp-tooltip-trigger-width.px]': 'trigger().width()',
|
|
352
373
|
'[style.--ngp-tooltip-transform-origin]': 'transformOrigin()',
|
|
353
374
|
},
|
|
354
375
|
}]
|
|
@@ -358,5 +379,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
|
|
|
358
379
|
* Generated bundle index. Do not edit.
|
|
359
380
|
*/
|
|
360
381
|
|
|
361
|
-
export { NgpTooltip,
|
|
382
|
+
export { NgpTooltip, NgpTooltipContextToken, NgpTooltipTrigger, injectTooltipContext, injectTooltipTriggerState, provideTooltipConfig, provideTooltipContext, provideTooltipTriggerState };
|
|
362
383
|
//# sourceMappingURL=ng-primitives-tooltip.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-primitives-tooltip.mjs","sources":["../../../../packages/ng-primitives/tooltip/src/config/tooltip-config.ts","../../../../packages/ng-primitives/tooltip/src/tooltip-trigger/tooltip-trigger-state.ts","../../../../packages/ng-primitives/tooltip/src/tooltip-trigger/tooltip-trigger-token.ts","../../../../packages/ng-primitives/tooltip/src/tooltip-trigger/tooltip-trigger.ts","../../../../packages/ng-primitives/tooltip/src/tooltip/tooltip-token.ts","../../../../packages/ng-primitives/tooltip/src/tooltip/tooltip.ts","../../../../packages/ng-primitives/tooltip/src/ng-primitives-tooltip.ts"],"sourcesContent":["import { InjectionToken, Provider, inject } from '@angular/core';\nimport { type Placement } from '@floating-ui/dom';\n\nexport interface NgpTooltipConfig {\n /**\n * Define the offset of the tooltip relative to the trigger.\n * @default 4\n */\n offset: number;\n\n /**\n * Define the placement of the tooltip relative to the trigger.\n * @default 'top'\n */\n placement: Placement;\n\n /**\n * Define the delay before the tooltip is shown.\n * @default 0\n */\n showDelay: number;\n\n /**\n * Define the delay before the tooltip is hidden.\n * @default 0\n */\n hideDelay: number;\n\n /**\n * Define whether the tooltip should flip when there is not enough space for the tooltip.\n * @default true\n */\n flip: boolean;\n\n /**\n * Define the container in to which the tooltip should be attached.\n * @default document.body\n */\n container: HTMLElement | null;\n}\n\nexport const defaultTooltipConfig: NgpTooltipConfig = {\n offset: 4,\n placement: 'top',\n showDelay: 0,\n hideDelay: 0,\n flip: true,\n container: null,\n};\n\nexport const NgpTooltipConfigToken = new InjectionToken<NgpTooltipConfig>('NgpTooltipConfigToken');\n\n/**\n * Provide the default Tooltip configuration\n * @param config The Tooltip configuration\n * @returns The provider\n */\nexport function provideTooltipConfig(config: Partial<NgpTooltipConfig>): Provider[] {\n return [\n {\n provide: NgpTooltipConfigToken,\n useValue: { ...defaultTooltipConfig, ...config },\n },\n ];\n}\n\n/**\n * Inject the Tooltip configuration\n * @returns The global Tooltip configuration\n */\nexport function injectTooltipConfig(): NgpTooltipConfig {\n return inject(NgpTooltipConfigToken, { optional: true }) ?? defaultTooltipConfig;\n}\n","import { Signal } from '@angular/core';\nimport {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n State,\n} from 'ng-primitives/state';\nimport type { NgpTooltipTrigger } from './tooltip-trigger';\n\n/**\n * The state token for the TooltipTrigger primitive.\n */\nexport const NgpTooltipTriggerStateToken = createStateToken<NgpTooltipTrigger>('TooltipTrigger');\n\n/**\n * Provides the TooltipTrigger state.\n */\nexport const provideTooltipTriggerState = createStateProvider(NgpTooltipTriggerStateToken);\n\n/**\n * Injects the TooltipTrigger state.\n */\nexport const injectTooltipTriggerState = createStateInjector(\n NgpTooltipTriggerStateToken,\n) as () => Signal<State<NgpTooltipTrigger>>;\n\n/**\n * The TooltipTrigger state registration function.\n */\nexport const tooltipTriggerState = createState(NgpTooltipTriggerStateToken);\n","import { InjectionToken, inject } from '@angular/core';\nimport type { NgpTooltipTrigger } from './tooltip-trigger';\n\nexport const NgpTooltipTriggerToken = new InjectionToken<NgpTooltipTrigger>(\n 'NgpTooltipTriggerToken',\n);\n\n/**\n * Inject the TooltipTrigger directive instance\n */\nexport function injectTooltipTrigger(): NgpTooltipTrigger {\n return inject(NgpTooltipTriggerToken);\n}\n\n/**\n * Provides the TooltipTrigger directive instance\n * @param trigger\n */\nexport function provideTooltipTrigger(trigger: NgpTooltipTrigger) {\n return { provide: NgpTooltipTriggerToken, useValue: trigger };\n}\n","import { BooleanInput, NumberInput } from '@angular/cdk/coercion';\nimport { DomPortalOutlet, TemplatePortal } from '@angular/cdk/portal';\nimport { DOCUMENT } from '@angular/common';\nimport {\n Directive,\n ElementRef,\n EmbeddedViewRef,\n Injector,\n OnDestroy,\n TemplateRef,\n ViewContainerRef,\n booleanAttribute,\n computed,\n inject,\n input,\n numberAttribute,\n output,\n signal,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport {\n Middleware,\n Placement,\n autoUpdate,\n computePosition,\n flip,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport { fromResizeEvent } from 'ng-primitives/resize';\nimport { injectDisposables, onBooleanChange } from 'ng-primitives/utils';\nimport { injectTooltipConfig } from '../config/tooltip-config';\nimport { provideTooltipTriggerState, tooltipTriggerState } from './tooltip-trigger-state';\nimport { NgpTooltipTriggerToken, provideTooltipTrigger } from './tooltip-trigger-token';\n\n/**\n * Apply the `ngpTooltipTrigger` directive to an element that triggers the tooltip to show.\n */\n@Directive({\n selector: '[ngpTooltipTrigger]',\n exportAs: 'ngpTooltipTrigger',\n providers: [\n provideTooltipTriggerState(),\n { provide: NgpTooltipTriggerToken, useExisting: NgpTooltipTrigger },\n ],\n host: {\n '[attr.data-open]': 'state.open() ? \"\" : null',\n '[attr.data-disabled]': 'disabled() ? \"\" : null',\n '(mouseenter)': 'show()',\n '(mouseleave)': 'hide()',\n '(focus)': 'show()',\n '(blur)': 'hide()',\n },\n})\nexport class NgpTooltipTrigger implements OnDestroy {\n /**\n * Access the trigger element\n */\n private readonly trigger = inject(ElementRef<HTMLElement>);\n\n /**\n * Access the view container ref.\n */\n private readonly viewContainerRef = inject(ViewContainerRef);\n\n /**\n * Access the document.\n */\n private readonly document = inject(DOCUMENT);\n\n /**\n * Access the injector.\n */\n private readonly injector = inject(Injector);\n\n /**\n * Access the global tooltip configuration.\n */\n private readonly config = injectTooltipConfig();\n\n /**\n * Access the disposable utilities\n */\n private readonly disposables = injectDisposables();\n\n /**\n * Access the tooltip template ref.\n */\n readonly tooltip = input.required<TemplateRef<void>>({\n alias: 'ngpTooltipTrigger',\n });\n\n /**\n * The open state of the tooltip.\n * @default false\n */\n readonly open = input<boolean, BooleanInput>(false, {\n alias: 'ngpTooltipTriggerOpen',\n transform: booleanAttribute,\n });\n\n /**\n * Emit an event when the tooltip is opened or closed.\n */\n readonly openChange = output<boolean>({\n alias: 'ngpTooltipTriggerOpenChange',\n });\n\n /**\n * Define if the trigger should be disabled.\n * @default false\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpTooltipTriggerDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * Define the placement of the tooltip relative to the trigger.\n * @default 'top'\n */\n readonly placement = input<Placement>(this.config.placement, {\n alias: 'ngpTooltipTriggerPlacement',\n });\n\n /**\n * Define the offset of the tooltip relative to the trigger.\n * @default 0\n */\n readonly offset = input<number, NumberInput>(this.config.offset, {\n alias: 'ngpTooltipTriggerOffset',\n transform: numberAttribute,\n });\n\n /**\n * Define the delay before the tooltip is displayed.\n * @default 0\n */\n readonly showDelay = input<number, NumberInput>(this.config.showDelay, {\n alias: 'ngpTooltipTriggerShowDelay',\n transform: numberAttribute,\n });\n\n /**\n * Define the delay before the tooltip is hidden.\n * @default 0\n */\n readonly hideDelay = input<number, NumberInput>(this.config.hideDelay, {\n alias: 'ngpTooltipTriggerHideDelay',\n transform: numberAttribute,\n });\n\n /**\n * Define whether the tooltip should flip when there is not enough space for the tooltip.\n * @default true\n */\n readonly flip = input<boolean, BooleanInput>(this.config.flip, {\n alias: 'ngpTooltipTriggerFlip',\n transform: booleanAttribute,\n });\n\n /**\n * Define the container in which the tooltip should be attached.\n * @default document.body\n */\n readonly container = input<HTMLElement | null>(this.config.container, {\n alias: 'ngpTooltipTriggerContainer',\n });\n\n /**\n * Store the tooltip view ref.\n */\n private viewRef: EmbeddedViewRef<void> | null = null;\n\n /**\n * Derive the tooltip middleware from the provided configuration.\n */\n private readonly middleware = computed(() => {\n const middleware: Middleware[] = [offset(this.state.offset()), shift()];\n\n if (this.state.flip()) {\n middleware.push(flip());\n }\n\n return middleware;\n });\n\n /**\n * Store the computed position of the tooltip.\n * @internal\n */\n readonly position = signal<{ x: number; y: number }>({\n x: 0,\n y: 0,\n });\n\n /**\n * Store the state of the tooltip.\n * @internal\n */\n readonly state = tooltipTriggerState<NgpTooltipTrigger>(this);\n\n /**\n * The dispose function to stop computing the position of the tooltip.\n */\n private dispose?: () => void;\n\n /**\n * @internal\n * Store the trigger width.\n */\n readonly width = signal<number | null>(null);\n\n constructor() {\n // any time the open state changes then show or hide the tooltip\n onBooleanChange(this.state.open, this.show.bind(this), this.hide.bind(this));\n\n // update the width of the trigger when it resizes\n fromResizeEvent(this.trigger.nativeElement)\n .pipe(takeUntilDestroyed())\n .subscribe(() => this.width.set(this.trigger.nativeElement.offsetWidth));\n }\n\n ngOnDestroy(): void {\n this.destroyTooltip();\n }\n\n private show(): void {\n // if the trigger is disabled or the tooltip is already open then do not show the tooltip\n if (this.state.disabled() || this.state.open()) {\n return;\n }\n\n this.state.open.set(true);\n this.openChange.emit(true);\n this.disposables.setTimeout(() => this.createTooltip(), this.state.showDelay());\n }\n\n private hide(): void {\n // if the trigger is disabled or the tooltip is already closed then do not hide the tooltip\n if (this.state.disabled() || !this.state.open()) {\n return;\n }\n\n this.state.open.set(false);\n this.openChange.emit(false);\n this.disposables.setTimeout(() => this.destroyTooltip(), this.state.hideDelay());\n }\n\n private createTooltip(): void {\n const portal = new TemplatePortal(\n this.tooltip(),\n this.viewContainerRef,\n undefined,\n this.injector,\n );\n\n const domOutlet = new DomPortalOutlet(\n this.state.container() ?? this.document.body,\n undefined,\n undefined,\n Injector.create({\n parent: this.injector,\n providers: [provideTooltipTrigger(this)],\n }),\n );\n\n this.viewRef = domOutlet.attach(portal);\n this.viewRef.detectChanges();\n\n const outletElement = this.viewRef.rootNodes[0];\n\n // we want to determine the strategy to use. If the tooltip has position: fixed then we want to use\n // fixed positioning. Otherwise we want to use absolute positioning.\n const strategy = getComputedStyle(outletElement).position === 'fixed' ? 'fixed' : 'absolute';\n\n this.dispose = autoUpdate(this.trigger.nativeElement, outletElement, async () => {\n const position = await computePosition(this.trigger.nativeElement, outletElement, {\n placement: this.state.placement(),\n middleware: this.middleware(),\n strategy,\n });\n\n this.position.set({ x: position.x, y: position.y });\n });\n }\n\n private destroyTooltip(): void {\n this.state.open.set(false);\n this.openChange.emit(false);\n this.viewRef?.destroy();\n this.viewRef = null;\n this.dispose?.();\n }\n}\n","import { InjectionToken, inject } from '@angular/core';\nimport type { NgpTooltip } from './tooltip';\n\nexport const NgpTooltipToken = new InjectionToken<NgpTooltip>('NgpTooltipToken');\n\n/**\n * Inject the Tooltip directive instance\n */\nexport function injectTooltip(): NgpTooltip {\n return inject(NgpTooltipToken);\n}\n","import { isPlatformBrowser } from '@angular/common';\nimport {\n Directive,\n ElementRef,\n OnInit,\n PLATFORM_ID,\n computed,\n inject,\n isDevMode,\n} from '@angular/core';\nimport { getTransformOrigin } from 'ng-primitives/popover';\nimport { injectTooltipTrigger } from '../tooltip-trigger/tooltip-trigger-token';\nimport { NgpTooltipToken } from './tooltip-token';\n\n/**\n * Apply the `ngpTooltip` directive to an element that represents the tooltip. This typically would be a `div` inside an `ng-template`.\n */\n@Directive({\n selector: '[ngpTooltip]',\n exportAs: 'ngpTooltip',\n providers: [{ provide: NgpTooltipToken, useExisting: NgpTooltip }],\n host: {\n role: 'tooltip',\n '[style.left.px]': 'x()',\n '[style.top.px]': 'y()',\n '[style.--ngp-tooltip-trigger-width.px]': 'trigger.width()',\n '[style.--ngp-tooltip-transform-origin]': 'transformOrigin()',\n },\n})\nexport class NgpTooltip implements OnInit {\n /**\n * Access the tooltip element.\n */\n private readonly tooltip = inject(ElementRef<HTMLElement>);\n\n /**\n * Access the platform.\n */\n private readonly platform = inject(PLATFORM_ID);\n\n /**\n * Access the trigger instance.\n */\n private readonly trigger = injectTooltipTrigger();\n\n /**\n * Compute the x position of the tooltip.\n */\n protected readonly x = computed(() => this.trigger.position().x);\n\n /**\n * Compute the y position of the tooltip.\n */\n protected readonly y = computed(() => this.trigger.position().y);\n\n /**\n * Derive the transform origin of the popover.\n */\n protected readonly transformOrigin = computed(() => getTransformOrigin(this.trigger.placement()));\n\n ngOnInit(): void {\n // if the element does not have a fixed position then throw a warning in dev mode\n if (isDevMode() && isPlatformBrowser(this.platform)) {\n const { position } = getComputedStyle(this.tooltip.nativeElement);\n\n if (position !== 'absolute' && position !== 'fixed') {\n console.warn(\n `The tooltip element must have an absolute or fixed position. The current position is ${position}.`,\n );\n }\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ng-primitives-tooltip.mjs","sources":["../../../../packages/ng-primitives/tooltip/src/config/tooltip-config.ts","../../../../packages/ng-primitives/tooltip/src/tooltip/tooltip-token.ts","../../../../packages/ng-primitives/tooltip/src/tooltip-trigger/tooltip-trigger-state.ts","../../../../packages/ng-primitives/tooltip/src/tooltip-trigger/tooltip-trigger.ts","../../../../packages/ng-primitives/tooltip/src/tooltip/tooltip.ts","../../../../packages/ng-primitives/tooltip/src/ng-primitives-tooltip.ts"],"sourcesContent":["import { InjectionToken, Provider, inject } from '@angular/core';\nimport { type Placement } from '@floating-ui/dom';\n\nexport interface NgpTooltipConfig {\n /**\n * Define the offset of the tooltip relative to the trigger.\n * @default 4\n */\n offset: number;\n\n /**\n * Define the placement of the tooltip relative to the trigger.\n * @default 'top'\n */\n placement: Placement;\n\n /**\n * Define the delay before the tooltip is shown.\n * @default 0\n */\n showDelay: number;\n\n /**\n * Define the delay before the tooltip is hidden.\n * @default 0\n */\n hideDelay: number;\n\n /**\n * Define whether the tooltip should flip when there is not enough space for the tooltip.\n * @default true\n */\n flip: boolean;\n\n /**\n * Define the container in to which the tooltip should be attached.\n * @default document.body\n */\n container: HTMLElement | null;\n}\n\nexport const defaultTooltipConfig: NgpTooltipConfig = {\n offset: 4,\n placement: 'top',\n showDelay: 0,\n hideDelay: 0,\n flip: true,\n container: null,\n};\n\nexport const NgpTooltipConfigToken = new InjectionToken<NgpTooltipConfig>('NgpTooltipConfigToken');\n\n/**\n * Provide the default Tooltip configuration\n * @param config The Tooltip configuration\n * @returns The provider\n */\nexport function provideTooltipConfig(config: Partial<NgpTooltipConfig>): Provider[] {\n return [\n {\n provide: NgpTooltipConfigToken,\n useValue: { ...defaultTooltipConfig, ...config },\n },\n ];\n}\n\n/**\n * Inject the Tooltip configuration\n * @returns The global Tooltip configuration\n */\nexport function injectTooltipConfig(): NgpTooltipConfig {\n return inject(NgpTooltipConfigToken, { optional: true }) ?? defaultTooltipConfig;\n}\n","import { inject, InjectionToken, ValueProvider } from '@angular/core';\n\nexport const NgpTooltipContextToken = new InjectionToken<unknown>('NgpTooltipContextToken');\n\n/**\n * Inject the Tooltip context\n */\nexport function injectTooltipContext<T>(): T {\n return inject(NgpTooltipContextToken) as T;\n}\n\n/**\n * Provide the Tooltip directive instance\n */\nexport function provideTooltipContext<T>(context: T): ValueProvider {\n return { provide: NgpTooltipContextToken, useValue: context };\n}\n","import { Signal } from '@angular/core';\nimport {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n State,\n} from 'ng-primitives/state';\nimport type { NgpTooltipTrigger } from './tooltip-trigger';\n\n/**\n * The state token for the TooltipTrigger primitive.\n */\nexport const NgpTooltipTriggerStateToken =\n createStateToken<NgpTooltipTrigger<unknown>>('TooltipTrigger');\n\n/**\n * Provides the TooltipTrigger state.\n */\nexport const provideTooltipTriggerState = createStateProvider(NgpTooltipTriggerStateToken);\n\n/**\n * Injects the TooltipTrigger state.\n */\nexport const injectTooltipTriggerState = createStateInjector(NgpTooltipTriggerStateToken) as <\n T,\n>() => Signal<State<NgpTooltipTrigger<T>>>;\n\n/**\n * The TooltipTrigger state registration function.\n */\nexport const tooltipTriggerState = createState(NgpTooltipTriggerStateToken);\n","import { BooleanInput, NumberInput } from '@angular/cdk/coercion';\nimport { ComponentPortal, DomPortalOutlet, TemplatePortal } from '@angular/cdk/portal';\nimport { DOCUMENT } from '@angular/common';\nimport {\n ComponentRef,\n Directive,\n ElementRef,\n EmbeddedViewRef,\n Injector,\n OnDestroy,\n TemplateRef,\n Type,\n ViewContainerRef,\n booleanAttribute,\n computed,\n inject,\n input,\n numberAttribute,\n signal,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport {\n Middleware,\n Placement,\n autoUpdate,\n computePosition,\n flip,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport { injectExitAnimationManager, provideExitAnimationManager } from 'ng-primitives/internal';\nimport { fromResizeEvent } from 'ng-primitives/resize';\nimport { injectDisposables } from 'ng-primitives/utils';\nimport { injectTooltipConfig } from '../config/tooltip-config';\nimport { provideTooltipContext } from '../tooltip/tooltip-token';\nimport { provideTooltipTriggerState, tooltipTriggerState } from './tooltip-trigger-state';\n\n/**\n * Apply the `ngpTooltipTrigger` directive to an element that triggers the tooltip to show.\n */\n@Directive({\n selector: '[ngpTooltipTrigger]',\n exportAs: 'ngpTooltipTrigger',\n providers: [provideTooltipTriggerState(), provideExitAnimationManager()],\n host: {\n '[attr.data-open]': 'viewRef !== null ? \"\" : null',\n '[attr.data-disabled]': 'state.disabled() ? \"\" : null',\n '(mouseenter)': 'show()',\n '(mouseleave)': 'hide()',\n '(focus)': 'show()',\n '(blur)': 'hide()',\n },\n})\nexport class NgpTooltipTrigger<T = null> implements OnDestroy {\n /**\n * Access the exit animation manager.\n */\n private readonly exitAnimationManager = injectExitAnimationManager();\n\n /**\n * Access the trigger element\n */\n private readonly trigger = inject(ElementRef<HTMLElement>);\n\n /**\n * Access the view container ref.\n */\n private readonly viewContainerRef = inject(ViewContainerRef);\n\n /**\n * Access the document.\n */\n private readonly document = inject(DOCUMENT);\n\n /**\n * Access the injector.\n */\n private readonly injector = inject(Injector);\n\n /**\n * Access the global tooltip configuration.\n */\n private readonly config = injectTooltipConfig();\n\n /**\n * Access the disposable utilities\n */\n private readonly disposables = injectDisposables();\n\n /**\n * Access the tooltip template ref.\n */\n readonly tooltip = input<NgpTooltipContent<T> | null>(null, {\n alias: 'ngpTooltipTrigger',\n });\n\n /**\n * Define if the trigger should be disabled.\n * @default false\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpTooltipTriggerDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * Define the placement of the tooltip relative to the trigger.\n * @default 'top'\n */\n readonly placement = input<Placement>(this.config.placement, {\n alias: 'ngpTooltipTriggerPlacement',\n });\n\n /**\n * Define the offset of the tooltip relative to the trigger.\n * @default 0\n */\n readonly offset = input<number, NumberInput>(this.config.offset, {\n alias: 'ngpTooltipTriggerOffset',\n transform: numberAttribute,\n });\n\n /**\n * Define the delay before the tooltip is displayed.\n * @default 0\n */\n readonly showDelay = input<number, NumberInput>(this.config.showDelay, {\n alias: 'ngpTooltipTriggerShowDelay',\n transform: numberAttribute,\n });\n\n /**\n * Define the delay before the tooltip is hidden.\n * @default 0\n */\n readonly hideDelay = input<number, NumberInput>(this.config.hideDelay, {\n alias: 'ngpTooltipTriggerHideDelay',\n transform: numberAttribute,\n });\n\n /**\n * Define whether the tooltip should flip when there is not enough space for the tooltip.\n * @default true\n */\n readonly flip = input<boolean, BooleanInput>(this.config.flip, {\n alias: 'ngpTooltipTriggerFlip',\n transform: booleanAttribute,\n });\n\n /**\n * Define the container in which the tooltip should be attached.\n * @default document.body\n */\n readonly container = input<HTMLElement | null>(this.config.container, {\n alias: 'ngpTooltipTriggerContainer',\n });\n\n /**\n * Provide context to the tooltip.\n * @default null\n */\n readonly context = input<T | null>(null, {\n alias: 'ngpTooltipTriggerContext',\n });\n\n /**\n * Store the tooltip view ref.\n */\n protected viewRef: ComponentRef<unknown> | EmbeddedViewRef<T> | null = null;\n\n /**\n * Derive the tooltip middleware from the provided configuration.\n */\n private readonly middleware = computed(() => {\n const middleware: Middleware[] = [offset(this.state.offset()), shift()];\n\n if (this.state.flip()) {\n middleware.push(flip());\n }\n\n return middleware;\n });\n\n /**\n * Store the computed position of the tooltip.\n * @internal\n */\n readonly position = signal<{ x: number; y: number }>({\n x: 0,\n y: 0,\n });\n\n /**\n * The dispose function to stop computing the position of the tooltip.\n */\n private dispose?: () => void;\n\n /**\n * @internal\n * Store the trigger width.\n */\n readonly width = signal<number | null>(null);\n\n /**\n * @internal\n * The timeout to open the tooltip.\n */\n private openTimeout?: () => void;\n\n /**\n * @internal\n * The timeout to close the tooltip.\n */\n private closeTimeout?: () => void;\n\n /**\n * Store the state of the tooltip.\n * @internal\n */\n readonly state = tooltipTriggerState<NgpTooltipTrigger<T>>(this);\n\n constructor() {\n // update the width of the trigger when it resizes\n fromResizeEvent(this.trigger.nativeElement)\n .pipe(takeUntilDestroyed())\n .subscribe(() => this.width.set(this.trigger.nativeElement.offsetWidth));\n }\n\n ngOnDestroy(): void {\n this.destroyTooltip();\n }\n\n /**\n * Show the tooltip.\n */\n show(): void {\n // if closing is in progress then clear the timeout to stop the popover from closing\n if (this.closeTimeout) {\n this.closeTimeout();\n this.closeTimeout = undefined;\n }\n\n // if the trigger is disabled or the tooltip is already open then do not show the tooltip\n if (this.state.disabled() || this.openTimeout) {\n return;\n }\n\n // if the tooltip exists in the DOM then do not create it again\n if (this.viewRef) {\n return;\n }\n\n this.openTimeout = this.disposables.setTimeout(\n () => this.createTooltip(),\n this.state.showDelay(),\n );\n }\n\n /**\n * Hide the tooltip.\n */\n hide(): void {\n // if closing is in progress then clear the timeout to stop the popover from opening\n if (this.openTimeout) {\n this.openTimeout();\n this.openTimeout = undefined;\n }\n\n // if the trigger is disabled or the tooltip is already closed then do not hide the tooltip\n if (this.state.disabled() || this.closeTimeout) {\n return;\n }\n\n this.closeTimeout = this.disposables.setTimeout(\n () => this.destroyTooltip(),\n this.state.hideDelay(),\n );\n }\n\n private createTooltip(): void {\n this.openTimeout = undefined;\n const tooltip = this.state.tooltip();\n\n let portal: TemplatePortal | ComponentPortal<unknown>;\n\n // Create a new inject with the tooltip context\n const injector = Injector.create({\n parent: this.injector,\n providers: [provideTooltipContext(this.state.context())],\n });\n\n if (tooltip instanceof TemplateRef) {\n portal = new TemplatePortal<NgpTooltipTemplateContext<T>>(\n tooltip,\n this.viewContainerRef,\n { $implicit: this.state.context() } as NgpTooltipTemplateContext<T>,\n injector,\n );\n } else if (tooltip instanceof Type) {\n portal = new ComponentPortal(tooltip, this.viewContainerRef, injector);\n } else {\n throw new Error('Tooltip must be either a TemplateRef or a ComponentType');\n }\n\n const domOutlet = new DomPortalOutlet(\n this.state.container() ?? this.document.body,\n undefined,\n undefined,\n injector,\n );\n\n this.viewRef = domOutlet.attach(portal);\n\n let outletElement: HTMLElement | null = null;\n\n if (this.viewRef instanceof ComponentRef) {\n this.viewRef.changeDetectorRef.detectChanges();\n outletElement = this.viewRef.location.nativeElement;\n } else if (this.viewRef) {\n this.viewRef.detectChanges();\n outletElement = this.viewRef.rootNodes[0] as HTMLElement;\n }\n\n if (!outletElement) {\n throw new Error('Outlet element is not available.');\n }\n\n // we want to determine the strategy to use. If the tooltip has position: fixed then we want to use\n // fixed positioning. Otherwise we want to use absolute positioning.\n const strategy = getComputedStyle(outletElement).position === 'fixed' ? 'fixed' : 'absolute';\n\n this.dispose = autoUpdate(this.trigger.nativeElement, outletElement, async () => {\n const position = await computePosition(this.trigger.nativeElement, outletElement, {\n placement: this.state.placement(),\n middleware: this.middleware(),\n strategy,\n });\n\n this.position.set({ x: position.x, y: position.y });\n });\n }\n\n private async destroyTooltip(): Promise<void> {\n this.closeTimeout = undefined;\n await this.exitAnimationManager.exit();\n\n this.viewRef?.destroy();\n this.viewRef = null;\n this.dispose?.();\n }\n}\n\ntype NgpTooltipTemplateContext<T> = {\n $implicit: T;\n};\ntype NgpTooltipContent<T> = TemplateRef<NgpTooltipTemplateContext<T>> | Type<unknown>;\n","import { isPlatformBrowser } from '@angular/common';\nimport {\n Directive,\n ElementRef,\n OnInit,\n PLATFORM_ID,\n computed,\n inject,\n isDevMode,\n} from '@angular/core';\nimport { NgpExitAnimation } from 'ng-primitives/internal';\nimport { getTransformOrigin } from 'ng-primitives/popover';\nimport { injectTooltipTriggerState } from '../tooltip-trigger/tooltip-trigger-state';\n\n/**\n * Apply the `ngpTooltip` directive to an element that represents the tooltip. This typically would be a `div` inside an `ng-template`.\n */\n@Directive({\n selector: '[ngpTooltip]',\n exportAs: 'ngpTooltip',\n hostDirectives: [NgpExitAnimation],\n host: {\n role: 'tooltip',\n '[style.left.px]': 'x()',\n '[style.top.px]': 'y()',\n '[style.--ngp-tooltip-trigger-width.px]': 'trigger().width()',\n '[style.--ngp-tooltip-transform-origin]': 'transformOrigin()',\n },\n})\nexport class NgpTooltip implements OnInit {\n /**\n * Access the tooltip element.\n */\n private readonly tooltip = inject(ElementRef<HTMLElement>);\n\n /**\n * Access the platform.\n */\n private readonly platform = inject(PLATFORM_ID);\n\n /**\n * Access the trigger instance.\n */\n private readonly trigger = injectTooltipTriggerState();\n\n /**\n * Compute the x position of the tooltip.\n */\n protected readonly x = computed(() => this.trigger().position().x);\n\n /**\n * Compute the y position of the tooltip.\n */\n protected readonly y = computed(() => this.trigger().position().y);\n\n /**\n * Derive the transform origin of the popover.\n */\n protected readonly transformOrigin = computed(() =>\n getTransformOrigin(this.trigger().placement()),\n );\n\n ngOnInit(): void {\n // if the element does not have a fixed position then throw a warning in dev mode\n if (isDevMode() && isPlatformBrowser(this.platform)) {\n const { position } = getComputedStyle(this.tooltip.nativeElement);\n\n if (position !== 'absolute' && position !== 'fixed') {\n console.warn(\n `The tooltip element must have an absolute or fixed position. The current position is ${position}.`,\n );\n }\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -18,6 +18,8 @@ function provideValueAccessor(type) {
|
|
|
18
18
|
*/
|
|
19
19
|
function injectDisposables() {
|
|
20
20
|
const destroyRef = inject(DestroyRef);
|
|
21
|
+
let isDestroyed = false;
|
|
22
|
+
destroyRef.onDestroy(() => (isDestroyed = true));
|
|
21
23
|
return {
|
|
22
24
|
/**
|
|
23
25
|
* Set a timeout that will be cleared when the component is destroyed.
|
|
@@ -26,6 +28,10 @@ function injectDisposables() {
|
|
|
26
28
|
* @returns A function to clear the timeout
|
|
27
29
|
*/
|
|
28
30
|
setTimeout: (callback, delay) => {
|
|
31
|
+
if (isDestroyed) {
|
|
32
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
33
|
+
return () => { };
|
|
34
|
+
}
|
|
29
35
|
const id = setTimeout(callback, delay);
|
|
30
36
|
const cleanup = () => clearTimeout(id);
|
|
31
37
|
destroyRef.onDestroy(cleanup);
|
|
@@ -44,6 +50,10 @@ function injectDisposables() {
|
|
|
44
50
|
addEventListener: (target, type,
|
|
45
51
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
46
52
|
listener, options) => {
|
|
53
|
+
if (isDestroyed) {
|
|
54
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
55
|
+
return () => { };
|
|
56
|
+
}
|
|
47
57
|
target.addEventListener(type, listener, options);
|
|
48
58
|
const cleanup = () => target.removeEventListener(type, listener, options);
|
|
49
59
|
destroyRef.onDestroy(cleanup);
|
|
@@ -56,6 +66,10 @@ function injectDisposables() {
|
|
|
56
66
|
* @returns A function to clear the interval
|
|
57
67
|
*/
|
|
58
68
|
setInterval: (callback, delay) => {
|
|
69
|
+
if (isDestroyed) {
|
|
70
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
71
|
+
return () => { };
|
|
72
|
+
}
|
|
59
73
|
const id = setInterval(callback, delay);
|
|
60
74
|
const cleanup = () => clearInterval(id);
|
|
61
75
|
destroyRef.onDestroy(cleanup);
|
|
@@ -67,6 +81,10 @@ function injectDisposables() {
|
|
|
67
81
|
* @returns A function to clear the requestAnimationFrame
|
|
68
82
|
*/
|
|
69
83
|
requestAnimationFrame: (callback) => {
|
|
84
|
+
if (isDestroyed) {
|
|
85
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
86
|
+
return () => { };
|
|
87
|
+
}
|
|
70
88
|
const id = requestAnimationFrame(callback);
|
|
71
89
|
const cleanup = () => cancelAnimationFrame(id);
|
|
72
90
|
destroyRef.onDestroy(cleanup);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-primitives-utils.mjs","sources":["../../../../packages/ng-primitives/utils/src/forms/providers.ts","../../../../packages/ng-primitives/utils/src/helpers/disposables.ts","../../../../packages/ng-primitives/utils/src/helpers/unique-id.ts","../../../../packages/ng-primitives/utils/src/signals/index.ts","../../../../packages/ng-primitives/utils/src/ui/dimensions.ts","../../../../packages/ng-primitives/utils/src/ng-primitives-utils.ts"],"sourcesContent":["import { ExistingProvider, Type } from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n/**\n * A simple helper function to provide a value accessor for a given type.\n * @param type The type to provide the value accessor for\n */\nexport function provideValueAccessor<T>(type: Type<T>): ExistingProvider {\n return { provide: NG_VALUE_ACCESSOR, useExisting: type, multi: true };\n}\n","import { DestroyRef, inject } from '@angular/core';\n\n/**\n * Disposable functions are a way to manage timers, intervals, and event listeners\n * that should be cleared when a component is destroyed.\n *\n * This is heavily inspired by Headless UI disposables:\n * https://github.com/tailwindlabs/headlessui/blob/main/packages/%40headlessui-react/src/utils/disposables.ts\n */\nexport function injectDisposables() {\n const destroyRef = inject(DestroyRef);\n\n return {\n /**\n * Set a timeout that will be cleared when the component is destroyed.\n * @param callback The callback to execute\n * @param delay The delay before the callback is executed\n * @returns A function to clear the timeout\n */\n setTimeout: (callback: () => void, delay: number) => {\n const id = setTimeout(callback, delay);\n const cleanup = () => clearTimeout(id);\n destroyRef.onDestroy(cleanup);\n return cleanup;\n },\n /**\n * Set an interval that will be cleared when the component is destroyed.\n * @param callback The callback to execute\n * @param delay The delay before the callback is executed\n * @param target\n * @param type\n * @param listener\n * @param options\n * @returns A function to clear the interval\n */\n addEventListener: <K extends keyof HTMLElementEventMap>(\n target: EventTarget,\n type: K,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any,\n options?: boolean | AddEventListenerOptions,\n ) => {\n target.addEventListener(type, listener as EventListenerOrEventListenerObject, options);\n const cleanup = () =>\n target.removeEventListener(type, listener as EventListenerOrEventListenerObject, options);\n destroyRef.onDestroy(cleanup);\n return cleanup;\n },\n /**\n * Set an interval that will be cleared when the component is destroyed.\n * @param callback The callback to execute\n * @param delay The delay before the callback is executed\n * @returns A function to clear the interval\n */\n setInterval: (callback: () => void, delay: number) => {\n const id = setInterval(callback, delay);\n const cleanup = () => clearInterval(id);\n destroyRef.onDestroy(cleanup);\n return cleanup;\n },\n /**\n * Set a requestAnimationFrame that will be cleared when the component is destroyed.\n * @param callback The callback to execute\n * @returns A function to clear the requestAnimationFrame\n */\n requestAnimationFrame: (callback: FrameRequestCallback) => {\n const id = requestAnimationFrame(callback);\n const cleanup = () => cancelAnimationFrame(id);\n destroyRef.onDestroy(cleanup);\n return cleanup;\n },\n };\n}\n","/**\n * Store a map of unique ids for elements so that there are no collisions.\n */\nconst uniqueIdMap = new Map<string, number>();\n\n/**\n * Generate a unique id for an element\n * @param prefix - The prefix to use for the id\n * @returns The generated id\n */\nexport function uniqueId(prefix: string): string {\n const id = uniqueIdMap.get(prefix) ?? 0;\n uniqueIdMap.set(prefix, id + 1);\n return `${prefix}-${id}`;\n}\n","import { effect, Injector, Signal, signal, untracked } from '@angular/core';\n\n/**\n * Listen for changes to a signal and call a function when the signal changes.\n * @param source\n * @param fn\n * @param options\n * @param options.injector\n * @internal\n */\nexport function onChange<T>(\n source: Signal<T | null | undefined>,\n fn: (value: T | null | undefined, previousValue: T | null | undefined) => void,\n options?: { injector: Injector },\n): void {\n const previousValue = signal(source());\n\n effect(\n () => {\n const value = source();\n if (value !== previousValue()) {\n untracked(() => fn(value, previousValue()));\n previousValue.set(value);\n }\n },\n { injector: options?.injector },\n );\n\n // call the fn with the initial value\n fn(source(), null);\n}\n\n/**\n * Listen for changes to a boolean signal and call one of two functions when the signal changes.\n * @param source\n * @param onTrue\n * @param onFalse\n * @param options\n */\nexport function onBooleanChange(\n source: Signal<boolean>,\n onTrue?: () => void,\n onFalse?: () => void,\n options?: { injector: Injector },\n): void {\n onChange(source, value => (value ? onTrue?.() : onFalse?.()), options);\n}\n","import { ElementRef, Renderer2, afterNextRender, inject, signal } from '@angular/core';\n\n/**\n * Injects the dimensions of the element\n * @returns The dimensions of the element\n */\nexport function injectDimensions() {\n const renderer = inject(Renderer2);\n const element = inject<ElementRef<HTMLElement>>(ElementRef).nativeElement;\n const size = signal<{ width: number; height: number; mounted: boolean }>({\n width: 0,\n height: 0,\n mounted: false,\n });\n let transitionDuration: string | undefined, animationName: string | undefined;\n\n afterNextRender({\n earlyRead: () => {\n transitionDuration = element.style.transitionDuration;\n animationName = element.style.animationName;\n },\n write: () => {\n // block any animations/transitions so the element renders at its full dimensions\n renderer.setStyle(element, 'transitionDuration', '0s');\n renderer.setStyle(element, 'animationName', 'none');\n },\n read: () => {\n const { width, height } = element.getBoundingClientRect();\n size.set({ width, height, mounted: true });\n // restore the original transition duration and animation name\n renderer.setStyle(element, 'transitionDuration', transitionDuration);\n renderer.setStyle(element, 'animationName', animationName);\n },\n });\n\n return size;\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ng-primitives-utils.mjs","sources":["../../../../packages/ng-primitives/utils/src/forms/providers.ts","../../../../packages/ng-primitives/utils/src/helpers/disposables.ts","../../../../packages/ng-primitives/utils/src/helpers/unique-id.ts","../../../../packages/ng-primitives/utils/src/signals/index.ts","../../../../packages/ng-primitives/utils/src/ui/dimensions.ts","../../../../packages/ng-primitives/utils/src/ng-primitives-utils.ts"],"sourcesContent":["import { ExistingProvider, Type } from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n/**\n * A simple helper function to provide a value accessor for a given type.\n * @param type The type to provide the value accessor for\n */\nexport function provideValueAccessor<T>(type: Type<T>): ExistingProvider {\n return { provide: NG_VALUE_ACCESSOR, useExisting: type, multi: true };\n}\n","import { DestroyRef, inject } from '@angular/core';\n\n/**\n * Disposable functions are a way to manage timers, intervals, and event listeners\n * that should be cleared when a component is destroyed.\n *\n * This is heavily inspired by Headless UI disposables:\n * https://github.com/tailwindlabs/headlessui/blob/main/packages/%40headlessui-react/src/utils/disposables.ts\n */\nexport function injectDisposables() {\n const destroyRef = inject(DestroyRef);\n let isDestroyed = false;\n\n destroyRef.onDestroy(() => (isDestroyed = true));\n\n return {\n /**\n * Set a timeout that will be cleared when the component is destroyed.\n * @param callback The callback to execute\n * @param delay The delay before the callback is executed\n * @returns A function to clear the timeout\n */\n setTimeout: (callback: () => void, delay: number) => {\n if (isDestroyed) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n return () => {};\n }\n\n const id = setTimeout(callback, delay);\n const cleanup = () => clearTimeout(id);\n destroyRef.onDestroy(cleanup);\n return cleanup;\n },\n /**\n * Set an interval that will be cleared when the component is destroyed.\n * @param callback The callback to execute\n * @param delay The delay before the callback is executed\n * @param target\n * @param type\n * @param listener\n * @param options\n * @returns A function to clear the interval\n */\n addEventListener: <K extends keyof HTMLElementEventMap>(\n target: EventTarget,\n type: K,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any,\n options?: boolean | AddEventListenerOptions,\n ) => {\n if (isDestroyed) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n return () => {};\n }\n\n target.addEventListener(type, listener as EventListenerOrEventListenerObject, options);\n const cleanup = () =>\n target.removeEventListener(type, listener as EventListenerOrEventListenerObject, options);\n destroyRef.onDestroy(cleanup);\n return cleanup;\n },\n /**\n * Set an interval that will be cleared when the component is destroyed.\n * @param callback The callback to execute\n * @param delay The delay before the callback is executed\n * @returns A function to clear the interval\n */\n setInterval: (callback: () => void, delay: number) => {\n if (isDestroyed) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n return () => {};\n }\n\n const id = setInterval(callback, delay);\n const cleanup = () => clearInterval(id);\n destroyRef.onDestroy(cleanup);\n return cleanup;\n },\n /**\n * Set a requestAnimationFrame that will be cleared when the component is destroyed.\n * @param callback The callback to execute\n * @returns A function to clear the requestAnimationFrame\n */\n requestAnimationFrame: (callback: FrameRequestCallback) => {\n if (isDestroyed) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n return () => {};\n }\n\n const id = requestAnimationFrame(callback);\n const cleanup = () => cancelAnimationFrame(id);\n destroyRef.onDestroy(cleanup);\n return cleanup;\n },\n };\n}\n","/**\n * Store a map of unique ids for elements so that there are no collisions.\n */\nconst uniqueIdMap = new Map<string, number>();\n\n/**\n * Generate a unique id for an element\n * @param prefix - The prefix to use for the id\n * @returns The generated id\n */\nexport function uniqueId(prefix: string): string {\n const id = uniqueIdMap.get(prefix) ?? 0;\n uniqueIdMap.set(prefix, id + 1);\n return `${prefix}-${id}`;\n}\n","import { effect, Injector, Signal, signal, untracked } from '@angular/core';\n\n/**\n * Listen for changes to a signal and call a function when the signal changes.\n * @param source\n * @param fn\n * @param options\n * @param options.injector\n * @internal\n */\nexport function onChange<T>(\n source: Signal<T | null | undefined>,\n fn: (value: T | null | undefined, previousValue: T | null | undefined) => void,\n options?: { injector: Injector },\n): void {\n const previousValue = signal(source());\n\n effect(\n () => {\n const value = source();\n if (value !== previousValue()) {\n untracked(() => fn(value, previousValue()));\n previousValue.set(value);\n }\n },\n { injector: options?.injector },\n );\n\n // call the fn with the initial value\n fn(source(), null);\n}\n\n/**\n * Listen for changes to a boolean signal and call one of two functions when the signal changes.\n * @param source\n * @param onTrue\n * @param onFalse\n * @param options\n */\nexport function onBooleanChange(\n source: Signal<boolean>,\n onTrue?: () => void,\n onFalse?: () => void,\n options?: { injector: Injector },\n): void {\n onChange(source, value => (value ? onTrue?.() : onFalse?.()), options);\n}\n","import { ElementRef, Renderer2, afterNextRender, inject, signal } from '@angular/core';\n\n/**\n * Injects the dimensions of the element\n * @returns The dimensions of the element\n */\nexport function injectDimensions() {\n const renderer = inject(Renderer2);\n const element = inject<ElementRef<HTMLElement>>(ElementRef).nativeElement;\n const size = signal<{ width: number; height: number; mounted: boolean }>({\n width: 0,\n height: 0,\n mounted: false,\n });\n let transitionDuration: string | undefined, animationName: string | undefined;\n\n afterNextRender({\n earlyRead: () => {\n transitionDuration = element.style.transitionDuration;\n animationName = element.style.animationName;\n },\n write: () => {\n // block any animations/transitions so the element renders at its full dimensions\n renderer.setStyle(element, 'transitionDuration', '0s');\n renderer.setStyle(element, 'animationName', 'none');\n },\n read: () => {\n const { width, height } = element.getBoundingClientRect();\n size.set({ width, height, mounted: true });\n // restore the original transition duration and animation name\n renderer.setStyle(element, 'transitionDuration', transitionDuration);\n renderer.setStyle(element, 'animationName', animationName);\n },\n });\n\n return size;\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -6,13 +6,13 @@ export declare const NgpFileDropzoneStateToken: import("@angular/core").Injectio
|
|
|
6
6
|
/**
|
|
7
7
|
* Provides the FileDropzone state.
|
|
8
8
|
*/
|
|
9
|
-
export declare const provideFileDropzoneState: () => import("@angular/core").FactoryProvider;
|
|
9
|
+
export declare const provideFileDropzoneState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
|
|
10
10
|
/**
|
|
11
11
|
* Injects the FileDropzone state.
|
|
12
12
|
*/
|
|
13
13
|
export declare const injectFileDropzoneState: <U = {
|
|
14
14
|
readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
|
|
15
|
-
readonly fileTypes: import("@angular/core").InputSignalWithTransform<string[] | undefined, string>;
|
|
15
|
+
readonly fileTypes: import("@angular/core").InputSignalWithTransform<string[] | undefined, string | string[]>;
|
|
16
16
|
readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
|
|
17
17
|
readonly directory: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
|
|
18
18
|
readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
|
|
@@ -9,9 +9,10 @@ export declare class NgpFileDropzone {
|
|
|
9
9
|
*/
|
|
10
10
|
private readonly elementRef;
|
|
11
11
|
/**
|
|
12
|
-
* The accepted file types.
|
|
12
|
+
* The accepted file types. This can be an array of strings or a comma-separated string.
|
|
13
|
+
* Accepted types can either be file extensions (e.g. `.jpg`) or MIME types (e.g. `image/jpeg`).
|
|
13
14
|
*/
|
|
14
|
-
readonly fileTypes: import("@angular/core").InputSignalWithTransform<string[] | undefined, string>;
|
|
15
|
+
readonly fileTypes: import("@angular/core").InputSignalWithTransform<string[] | undefined, string | string[]>;
|
|
15
16
|
/**
|
|
16
17
|
* Whether to allow multiple files to be selected.
|
|
17
18
|
*/
|
|
@@ -6,13 +6,13 @@ export declare const NgpFileUploadStateToken: import("@angular/core").InjectionT
|
|
|
6
6
|
/**
|
|
7
7
|
* Provides the FileUpload state.
|
|
8
8
|
*/
|
|
9
|
-
export declare const provideFileUploadState: () => import("@angular/core").FactoryProvider;
|
|
9
|
+
export declare const provideFileUploadState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
|
|
10
10
|
/**
|
|
11
11
|
* Injects the FileUpload state.
|
|
12
12
|
*/
|
|
13
13
|
export declare const injectFileUploadState: <U = {
|
|
14
14
|
readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
|
|
15
|
-
readonly fileTypes: import("@angular/core").InputSignalWithTransform<string[] | undefined, string>;
|
|
15
|
+
readonly fileTypes: import("@angular/core").InputSignalWithTransform<string[] | undefined, string | string[]>;
|
|
16
16
|
readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
|
|
17
17
|
readonly directory: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
|
|
18
18
|
readonly dragAndDrop: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
|
|
@@ -9,9 +9,10 @@ export declare class NgpFileUpload {
|
|
|
9
9
|
*/
|
|
10
10
|
private readonly elementRef;
|
|
11
11
|
/**
|
|
12
|
-
* The accepted file types.
|
|
12
|
+
* The accepted file types. This can be an array of strings or a comma-separated string.
|
|
13
|
+
* Accepted types can either be file extensions (e.g. `.jpg`) or MIME types (e.g. `image/jpeg`).
|
|
13
14
|
*/
|
|
14
|
-
readonly fileTypes: import("@angular/core").InputSignalWithTransform<string[] | undefined, string>;
|
|
15
|
+
readonly fileTypes: import("@angular/core").InputSignalWithTransform<string[] | undefined, string | string[]>;
|
|
15
16
|
/**
|
|
16
17
|
* Whether to allow multiple files to be selected.
|
|
17
18
|
*/
|
package/focus-trap/index.d.ts
CHANGED