@egose/shadcn-theme-ng 0.0.28 → 0.2.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/README.md +130 -13
- package/accordion/README.md +376 -34
- package/accordion/fesm2022/accordion.mjs +27 -39
- package/alert/README.md +343 -34
- package/alert/fesm2022/alert.mjs +47 -47
- package/alert-dialog/README.md +471 -5
- package/alert-dialog/fesm2022/alert-dialog.mjs +47 -47
- package/aspect-ratio/README.md +272 -5
- package/aspect-ratio/fesm2022/aspect-ratio.mjs +9 -9
- package/autocomplete/README.md +473 -34
- package/autocomplete/fesm2022/autocomplete.mjs +53 -71
- package/avatar/README.md +357 -5
- package/avatar/fesm2022/avatar.mjs +32 -32
- package/badge/README.md +289 -34
- package/badge/fesm2022/badge.mjs +57 -57
- package/basic-alert/README.md +324 -34
- package/basic-alert/fesm2022/basic-alert.mjs +6 -18
- package/breadcrumb/README.md +406 -5
- package/breadcrumb/fesm2022/breadcrumb.mjs +33 -39
- package/button/README.md +453 -34
- package/button/fesm2022/button.mjs +147 -219
- package/button/types/button.d.ts +7 -10
- package/button-group/README.md +318 -5
- package/button-group/fesm2022/button-group.mjs +20 -20
- package/calendar/README.md +328 -34
- package/calendar/fesm2022/calendar.mjs +29 -743
- package/card/README.md +331 -5
- package/card/fesm2022/card.mjs +33 -33
- package/carousel/README.md +333 -5
- package/carousel/fesm2022/carousel.mjs +39 -78
- package/checkbox/README.md +291 -34
- package/checkbox/fesm2022/checkbox.mjs +20 -58
- package/checkbox/types/checkbox.d.ts +5 -4
- package/collapsible/README.md +332 -5
- package/collapsible/fesm2022/collapsible.mjs +15 -15
- package/combobox/README.md +507 -5
- package/combobox/fesm2022/combobox.mjs +91 -224
- package/command/README.md +435 -5
- package/command/fesm2022/command.mjs +49 -109
- package/confirmation-dialog/README.md +272 -34
- package/confirmation-dialog/fesm2022/confirmation-dialog.mjs +15 -40
- package/confirmation-dialog/types/confirmation-dialog.d.ts +8 -4
- package/context-menu/README.md +366 -5
- package/context-menu/fesm2022/context-menu.mjs +9 -9
- package/date-picker/README.md +436 -34
- package/date-picker/fesm2022/date-picker.mjs +64 -267
- package/date-picker/types/date-picker.d.ts +7 -3
- package/dialog/README.md +419 -34
- package/dialog/fesm2022/dialog.mjs +45 -71
- package/drawer/README.md +395 -5
- package/drawer/fesm2022/drawer.mjs +44 -54
- package/dropdown-menu/README.md +417 -5
- package/dropdown-menu/fesm2022/dropdown-menu.mjs +82 -70
- package/dropdown-menu/types/dropdown-menu.d.ts +4 -0
- package/empty/README.md +329 -5
- package/empty/fesm2022/empty.mjs +30 -30
- package/field/README.md +385 -5
- package/field/fesm2022/field.mjs +56 -72
- package/form-checkbox/README.md +283 -34
- package/form-checkbox/fesm2022/form-checkbox.mjs +25 -85
- package/form-checkbox/types/form-checkbox.d.ts +7 -1
- package/form-date-picker/README.md +293 -34
- package/form-date-picker/fesm2022/form-date-picker.mjs +31 -84
- package/form-date-picker/types/form-date-picker.d.ts +7 -1
- package/form-field/README.md +327 -34
- package/form-field/fesm2022/form-field.mjs +33 -19
- package/form-field/types/form-field.d.ts +28 -20
- package/form-field-simple/README.md +311 -34
- package/form-field-simple/fesm2022/form-field-simple.mjs +4 -4
- package/form-searchable-multiselect/README.md +332 -34
- package/form-searchable-multiselect/fesm2022/form-searchable-multiselect.mjs +31 -91
- package/form-searchable-multiselect/types/form-searchable-multiselect.d.ts +7 -1
- package/form-select/README.md +321 -34
- package/form-select/fesm2022/form-select.mjs +32 -149
- package/form-select/types/form-select.d.ts +7 -1
- package/form-text-input/README.md +342 -34
- package/form-text-input/fesm2022/form-text-input.mjs +35 -149
- package/form-text-input/types/form-text-input.d.ts +9 -12
- package/form-textarea/README.md +318 -34
- package/form-textarea/fesm2022/form-textarea.mjs +34 -109
- package/form-textarea/types/form-textarea.d.ts +8 -1
- package/hover-card/README.md +256 -5
- package/hover-card/fesm2022/hover-card.mjs +19 -19
- package/icon/README.md +210 -34
- package/icon/fesm2022/icon.mjs +8 -8
- package/input/README.md +240 -34
- package/input/fesm2022/input.mjs +17 -12
- package/input/types/input.d.ts +2 -1
- package/input-group/README.md +335 -5
- package/input-group/fesm2022/input-group.mjs +34 -34
- package/input-otp/README.md +375 -5
- package/input-otp/fesm2022/input-otp.mjs +26 -26
- package/item/README.md +385 -5
- package/item/fesm2022/item.mjs +53 -53
- package/kbd/README.md +291 -5
- package/kbd/fesm2022/kbd.mjs +12 -12
- package/label/README.md +243 -34
- package/label/fesm2022/label.mjs +10 -10
- package/label/types/label.d.ts +1 -1
- package/layout-simple/README.md +174 -44
- package/layout-simple/fesm2022/layout-simple.mjs +508 -603
- package/layout-simple/types/layout-simple.d.ts +179 -128
- package/menu/README.md +418 -0
- package/menu/fesm2022/menu.mjs +455 -0
- package/menu/package.json +24 -0
- package/menu/types/menu.d.ts +137 -0
- package/menubar/README.md +343 -5
- package/menubar/fesm2022/menubar.mjs +13 -13
- package/native-select/README.md +323 -5
- package/native-select/fesm2022/native-select.mjs +19 -19
- package/navigation-menu/README.md +369 -5
- package/navigation-menu/fesm2022/navigation-menu.mjs +35 -47
- package/package.json +183 -154
- package/pagination/README.md +388 -5
- package/pagination/fesm2022/pagination.mjs +45 -331
- package/popover/README.md +302 -34
- package/popover/fesm2022/popover.mjs +30 -30
- package/progress/README.md +311 -5
- package/progress/fesm2022/progress.mjs +13 -13
- package/radio-group/README.md +335 -34
- package/radio-group/fesm2022/radio-group.mjs +26 -19
- package/radio-group/types/radio-group.d.ts +1 -1
- package/resizable/README.md +269 -5
- package/resizable/fesm2022/resizable.mjs +18 -26
- package/scroll-area/README.md +233 -5
- package/scroll-area/fesm2022/scroll-area.mjs +9 -9
- package/searchable-multiselect/README.md +294 -34
- package/searchable-multiselect/fesm2022/searchable-multiselect.mjs +28 -117
- package/searchable-multiselect/types/searchable-multiselect.d.ts +8 -2
- package/select/README.md +408 -34
- package/select/fesm2022/select.mjs +71 -111
- package/select/types/select.d.ts +3 -1
- package/separator/README.md +193 -34
- package/separator/fesm2022/separator.mjs +9 -9
- package/separator/types/separator.d.ts +1 -1
- package/sheet/README.md +282 -34
- package/sheet/fesm2022/sheet.mjs +41 -53
- package/sidebar/README.md +457 -5
- package/sidebar/fesm2022/sidebar.mjs +125 -227
- package/skeleton/README.md +217 -5
- package/skeleton/fesm2022/skeleton.mjs +9 -9
- package/slider/README.md +273 -5
- package/slider/fesm2022/slider.mjs +10 -80
- package/sonner/README.md +317 -34
- package/sonner/fesm2022/sonner.mjs +13 -13
- package/spinner/README.md +255 -34
- package/spinner/fesm2022/spinner.mjs +11 -11
- package/switch/README.md +281 -34
- package/switch/fesm2022/switch.mjs +13 -15
- package/table/README.md +423 -5
- package/table/fesm2022/table.mjs +41 -41
- package/tabs/README.md +382 -34
- package/tabs/fesm2022/tabs.mjs +35 -111
- package/textarea/README.md +282 -5
- package/textarea/fesm2022/textarea.mjs +9 -9
- package/toggle/README.md +270 -5
- package/toggle/fesm2022/toggle.mjs +13 -13
- package/toggle-group/README.md +340 -5
- package/toggle-group/fesm2022/toggle-group.mjs +13 -13
- package/toggle-group/types/toggle-group.d.ts +13 -7
- package/tooltip/README.md +240 -34
- package/tooltip/fesm2022/tooltip.mjs +14 -14
- package/typography/README.md +271 -5
- package/typography/fesm2022/typography.mjs +53 -53
- package/typography/types/typography.d.ts +19 -19
- package/utils/README.md +274 -34
- package/utils/fesm2022/utils.mjs +68 -44
- package/accordion/fesm2022/accordion.mjs.map +0 -1
- package/alert/fesm2022/alert.mjs.map +0 -1
- package/alert-dialog/fesm2022/alert-dialog.mjs.map +0 -1
- package/aspect-ratio/fesm2022/aspect-ratio.mjs.map +0 -1
- package/autocomplete/fesm2022/autocomplete.mjs.map +0 -1
- package/avatar/fesm2022/avatar.mjs.map +0 -1
- package/badge/fesm2022/badge.mjs.map +0 -1
- package/basic-alert/fesm2022/basic-alert.mjs.map +0 -1
- package/breadcrumb/fesm2022/breadcrumb.mjs.map +0 -1
- package/button/fesm2022/button.mjs.map +0 -1
- package/button-group/fesm2022/button-group.mjs.map +0 -1
- package/calendar/fesm2022/calendar.mjs.map +0 -1
- package/card/fesm2022/card.mjs.map +0 -1
- package/carousel/fesm2022/carousel.mjs.map +0 -1
- package/checkbox/fesm2022/checkbox.mjs.map +0 -1
- package/collapsible/fesm2022/collapsible.mjs.map +0 -1
- package/combobox/fesm2022/combobox.mjs.map +0 -1
- package/command/fesm2022/command.mjs.map +0 -1
- package/confirmation-dialog/fesm2022/confirmation-dialog.mjs.map +0 -1
- package/context-menu/fesm2022/context-menu.mjs.map +0 -1
- package/date-picker/fesm2022/date-picker.mjs.map +0 -1
- package/dialog/fesm2022/dialog.mjs.map +0 -1
- package/drawer/fesm2022/drawer.mjs.map +0 -1
- package/dropdown-menu/fesm2022/dropdown-menu.mjs.map +0 -1
- package/empty/fesm2022/empty.mjs.map +0 -1
- package/field/fesm2022/field.mjs.map +0 -1
- package/form-checkbox/fesm2022/form-checkbox.mjs.map +0 -1
- package/form-date-picker/fesm2022/form-date-picker.mjs.map +0 -1
- package/form-field/fesm2022/form-field.mjs.map +0 -1
- package/form-field-simple/fesm2022/form-field-simple.mjs.map +0 -1
- package/form-searchable-multiselect/fesm2022/form-searchable-multiselect.mjs.map +0 -1
- package/form-select/fesm2022/form-select.mjs.map +0 -1
- package/form-text-input/fesm2022/form-text-input.mjs.map +0 -1
- package/form-textarea/fesm2022/form-textarea.mjs.map +0 -1
- package/hover-card/fesm2022/hover-card.mjs.map +0 -1
- package/icon/fesm2022/icon.mjs.map +0 -1
- package/input/fesm2022/input.mjs.map +0 -1
- package/input-group/fesm2022/input-group.mjs.map +0 -1
- package/input-otp/fesm2022/input-otp.mjs.map +0 -1
- package/item/fesm2022/item.mjs.map +0 -1
- package/kbd/fesm2022/kbd.mjs.map +0 -1
- package/label/fesm2022/label.mjs.map +0 -1
- package/layout-simple/fesm2022/layout-simple.mjs.map +0 -1
- package/menubar/fesm2022/menubar.mjs.map +0 -1
- package/native-select/fesm2022/native-select.mjs.map +0 -1
- package/navigation-menu/fesm2022/navigation-menu.mjs.map +0 -1
- package/pagination/fesm2022/pagination.mjs.map +0 -1
- package/popover/fesm2022/popover.mjs.map +0 -1
- package/progress/fesm2022/progress.mjs.map +0 -1
- package/radio-group/fesm2022/radio-group.mjs.map +0 -1
- package/resizable/fesm2022/resizable.mjs.map +0 -1
- package/scroll-area/fesm2022/scroll-area.mjs.map +0 -1
- package/searchable-multiselect/fesm2022/searchable-multiselect.mjs.map +0 -1
- package/select/fesm2022/select.mjs.map +0 -1
- package/separator/fesm2022/separator.mjs.map +0 -1
- package/sheet/fesm2022/sheet.mjs.map +0 -1
- package/sidebar/fesm2022/sidebar.mjs.map +0 -1
- package/skeleton/fesm2022/skeleton.mjs.map +0 -1
- package/slider/fesm2022/slider.mjs.map +0 -1
- package/sonner/fesm2022/sonner.mjs.map +0 -1
- package/spinner/fesm2022/spinner.mjs.map +0 -1
- package/switch/fesm2022/switch.mjs.map +0 -1
- package/table/fesm2022/table.mjs.map +0 -1
- package/tabs/fesm2022/tabs.mjs.map +0 -1
- package/textarea/fesm2022/textarea.mjs.map +0 -1
- package/toggle/fesm2022/toggle.mjs.map +0 -1
- package/toggle-group/fesm2022/toggle-group.mjs.map +0 -1
- package/tooltip/fesm2022/tooltip.mjs.map +0 -1
- package/typography/fesm2022/typography.mjs.map +0 -1
- package/utils/fesm2022/utils.mjs.map +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, ElementRef, signal, input, numberAttribute, Directive, booleanAttribute, ChangeDetectionStrategy, Component, HOST_TAG_NAME, InjectionToken, computed, effect, forwardRef, NgModule } from '@angular/core';
|
|
2
|
+
import { inject, ElementRef, DOCUMENT, DestroyRef, signal, input, numberAttribute, Directive, booleanAttribute, ChangeDetectionStrategy, Component, HOST_TAG_NAME, InjectionToken, computed, effect, forwardRef, NgModule } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/cdk/menu';
|
|
4
4
|
import { CdkMenu, CdkMenuItem, CdkMenuItemCheckbox, CdkMenuItemSelectable, CdkMenuGroup, CdkMenuItemRadio, CdkMenuTrigger } from '@angular/cdk/menu';
|
|
5
5
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
@@ -12,6 +12,8 @@ import { lucideCheck, lucideChevronRight } from '@ng-icons/lucide';
|
|
|
12
12
|
class HlmDropdownMenu {
|
|
13
13
|
_host = inject(CdkMenu);
|
|
14
14
|
_elementRef = inject((ElementRef));
|
|
15
|
+
_document = inject(DOCUMENT);
|
|
16
|
+
_destroyRef = inject(DestroyRef);
|
|
15
17
|
// The trigger provides its configured side; CDK parents this content's injector under the trigger's.
|
|
16
18
|
_menuSide = inject(MENU_SIDE, { optional: true });
|
|
17
19
|
_state = signal('open', /* @ts-ignore */
|
|
@@ -20,7 +22,7 @@ class HlmDropdownMenu {
|
|
|
20
22
|
...(ngDevMode ? [{ debugName: "_side" }] : /* istanbul ignore next */ []));
|
|
21
23
|
sideOffset = input(1, { ...(ngDevMode ? { debugName: "sideOffset" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
22
24
|
constructor() {
|
|
23
|
-
classes(() =>
|
|
25
|
+
classes(() => "motion-safe:data-open:animate-in motion-safe:data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 bg-popover text-popover-foreground min-w-32 rounded-md p-1 shadow-md ring-1 duration-100 my-[--spacing(var(--side-offset))] overflow-x-hidden overflow-y-auto outline-none");
|
|
24
26
|
this.setSideFromTransformOrigin();
|
|
25
27
|
// this is a best effort, but does not seem to work currently
|
|
26
28
|
// TODO: figure out a way for us to know the host is about to be closed. might not be possible with CDK
|
|
@@ -28,15 +30,19 @@ class HlmDropdownMenu {
|
|
|
28
30
|
}
|
|
29
31
|
setSideFromTransformOrigin() {
|
|
30
32
|
const side = this._menuSide?.side() ?? 'bottom';
|
|
33
|
+
const view = this._document.defaultView;
|
|
34
|
+
if (!view)
|
|
35
|
+
return;
|
|
31
36
|
// CDK sets transform-origin on this element synchronously on attach; read it next tick and derive side
|
|
32
|
-
setTimeout(() => {
|
|
37
|
+
const timer = view.setTimeout(() => {
|
|
33
38
|
this._side.set(deriveMenuSideFromTransformOrigin(this._elementRef.nativeElement.style.transformOrigin, side));
|
|
34
39
|
});
|
|
40
|
+
this._destroyRef.onDestroy(() => view.clearTimeout(timer));
|
|
35
41
|
}
|
|
36
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
37
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.
|
|
42
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
43
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmDropdownMenu, isStandalone: true, selector: "[hlmDropdownMenu],hlm-dropdown-menu", inputs: { sideOffset: { classPropertyName: "sideOffset", publicName: "sideOffset", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "dropdown-menu" }, properties: { "attr.data-state": "_state()", "attr.data-side": "_side()", "style.--side-offset": "sideOffset()" } }, hostDirectives: [{ directive: i1.CdkMenu }], ngImport: i0 });
|
|
38
44
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
45
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenu, decorators: [{
|
|
40
46
|
type: Directive,
|
|
41
47
|
args: [{
|
|
42
48
|
selector: '[hlmDropdownMenu],hlm-dropdown-menu',
|
|
@@ -73,10 +79,10 @@ class HlmDropdownMenuFocusOnHover {
|
|
|
73
79
|
}
|
|
74
80
|
this._parentMenu?.setActiveMenuItem(this._cdkMenuItem);
|
|
75
81
|
}
|
|
76
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
77
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.
|
|
82
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuFocusOnHover, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
83
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuFocusOnHover, isStandalone: true, selector: "[hlmDropdownMenuFocusOnHover]", host: { listeners: { "mouseenter": "_focusOnHover()" } }, ngImport: i0 });
|
|
78
84
|
}
|
|
79
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
85
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuFocusOnHover, decorators: [{
|
|
80
86
|
type: Directive,
|
|
81
87
|
args: [{
|
|
82
88
|
selector: '[hlmDropdownMenuFocusOnHover]',
|
|
@@ -92,14 +98,14 @@ class HlmDropdownMenuCheckboxCdk extends CdkMenuItemCheckbox {
|
|
|
92
98
|
trigger(options) {
|
|
93
99
|
super.trigger({ ...options, keepOpen: this.keepOpen() });
|
|
94
100
|
}
|
|
95
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
96
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.
|
|
101
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckboxCdk, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
102
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmDropdownMenuCheckboxCdk, isStandalone: true, selector: "[hlmDropdownMenuCheckboxCdk]", inputs: { keepOpen: { classPropertyName: "keepOpen", publicName: "keepOpen", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
97
103
|
{ provide: CdkMenuItemCheckbox, useExisting: HlmDropdownMenuCheckboxCdk },
|
|
98
104
|
{ provide: CdkMenuItemSelectable, useExisting: HlmDropdownMenuCheckboxCdk },
|
|
99
105
|
{ provide: CdkMenuItem, useExisting: CdkMenuItemSelectable },
|
|
100
106
|
], usesInheritance: true, ngImport: i0 });
|
|
101
107
|
}
|
|
102
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
108
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckboxCdk, decorators: [{
|
|
103
109
|
type: Directive,
|
|
104
110
|
args: [{
|
|
105
111
|
selector: '[hlmDropdownMenuCheckboxCdk]',
|
|
@@ -116,10 +122,10 @@ class HlmDropdownMenuCheckbox {
|
|
|
116
122
|
constructor() {
|
|
117
123
|
classes(() => "hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground gap-2 rounded-sm py-1.5 ps-2 pe-8 text-sm data-inset:ps-8 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] group/dropdown-menu-checkbox relative flex w-full cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_ng-icon]:pointer-events-none [&_ng-icon]:shrink-0");
|
|
118
124
|
}
|
|
119
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
120
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.
|
|
125
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
126
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmDropdownMenuCheckbox, isStandalone: true, selector: "[hlmDropdownMenuCheckbox],[hlmDropdownMenuCheckboxItem]", inputs: { inset: { classPropertyName: "inset", publicName: "inset", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "dropdown-menu-checkbox-item" }, properties: { "attr.data-disabled": "_cdkMenuItem.disabled ? \"\" : null", "attr.data-checked": "_cdkMenuItem.checked ? \"\" : null", "attr.data-inset": "inset() ? \"\" : null" } }, hostDirectives: [{ directive: HlmDropdownMenuCheckboxCdk, inputs: ["cdkMenuItemDisabled", "disabled", "cdkMenuItemChecked", "checked", "keepOpen", "keepOpen"], outputs: ["cdkMenuItemTriggered", "triggered"] }, { directive: HlmDropdownMenuFocusOnHover }], ngImport: i0 });
|
|
121
127
|
}
|
|
122
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
128
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckbox, decorators: [{
|
|
123
129
|
type: Directive,
|
|
124
130
|
args: [{
|
|
125
131
|
selector: '[hlmDropdownMenuCheckbox],[hlmDropdownMenuCheckboxItem]',
|
|
@@ -142,12 +148,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
142
148
|
|
|
143
149
|
class HlmDropdownMenuCheckboxIndicator {
|
|
144
150
|
constructor() {
|
|
145
|
-
classes(() =>
|
|
151
|
+
classes(() => "absolute end-2 flex items-center justify-center [&_ng-icon]:text-[length:--spacing(4)] pointer-events-none opacity-0 group-data-checked/dropdown-menu-checkbox:opacity-100");
|
|
146
152
|
}
|
|
147
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
148
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
153
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckboxIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
154
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuCheckboxIndicator, isStandalone: true, selector: "hlm-dropdown-menu-checkbox-indicator", host: { attributes: { "data-slot": "dropdown-menu-checkbox-item-indicator" } }, providers: [provideIcons({ lucideCheck })], ngImport: i0, template: ` <ng-icon name="lucideCheck" /> `, isInline: true, dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
149
155
|
}
|
|
150
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
156
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckboxIndicator, decorators: [{
|
|
151
157
|
type: Component,
|
|
152
158
|
args: [{
|
|
153
159
|
selector: 'hlm-dropdown-menu-checkbox-indicator',
|
|
@@ -161,12 +167,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
161
167
|
|
|
162
168
|
class HlmDropdownMenuGroup {
|
|
163
169
|
constructor() {
|
|
164
|
-
classes(() =>
|
|
170
|
+
classes(() => "block");
|
|
165
171
|
}
|
|
166
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
167
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.
|
|
172
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
173
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuGroup, isStandalone: true, selector: "[hlmDropdownMenuGroup],hlm-dropdown-menu-group", host: { attributes: { "data-slot": "dropdown-menu-group" } }, hostDirectives: [{ directive: i1.CdkMenuGroup }], ngImport: i0 });
|
|
168
174
|
}
|
|
169
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
175
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuGroup, decorators: [{
|
|
170
176
|
type: Directive,
|
|
171
177
|
args: [{
|
|
172
178
|
selector: '[hlmDropdownMenuGroup],hlm-dropdown-menu-group',
|
|
@@ -184,10 +190,10 @@ class HlmDropdownMenuItem {
|
|
|
184
190
|
constructor() {
|
|
185
191
|
classes(() => "hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:hover:bg-destructive/10 data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:hover:bg-destructive/20 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:hover:text-destructive data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[ng-icon]:text-destructive not-data-[variant=destructive]:hover:**:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2 rounded-sm px-2 py-1.5 text-sm data-inset:ps-8 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] group/dropdown-menu-item relative flex w-full cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_ng-icon]:pointer-events-none [&_ng-icon]:shrink-0");
|
|
186
192
|
}
|
|
187
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
188
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.
|
|
193
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
194
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmDropdownMenuItem, isStandalone: true, selector: "[hlmDropdownMenuItem],hlm-dropdown-menu-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, inset: { classPropertyName: "inset", publicName: "inset", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "dropdown-menu-item" }, properties: { "attr.disabled": "_isButton && disabled() ? \"\" : null", "attr.data-disabled": "disabled() ? \"\" : null", "attr.data-variant": "variant()", "attr.data-inset": "inset() ? \"\" : null" } }, hostDirectives: [{ directive: i1.CdkMenuItem, inputs: ["cdkMenuItemDisabled", "disabled"], outputs: ["cdkMenuItemTriggered", "triggered"] }, { directive: HlmDropdownMenuFocusOnHover }], ngImport: i0 });
|
|
189
195
|
}
|
|
190
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
196
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuItem, decorators: [{
|
|
191
197
|
type: Directive,
|
|
192
198
|
args: [{
|
|
193
199
|
selector: '[hlmDropdownMenuItem],hlm-dropdown-menu-item',
|
|
@@ -211,31 +217,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
211
217
|
|
|
212
218
|
class HlmDropdownMenuItemSubIndicator {
|
|
213
219
|
constructor() {
|
|
214
|
-
classes(() =>
|
|
220
|
+
classes(() => "ms-auto flex items-center justify-center");
|
|
215
221
|
}
|
|
216
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
217
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
222
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuItemSubIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
223
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuItemSubIndicator, isStandalone: true, selector: "hlm-dropdown-menu-item-sub-indicator", providers: [provideIcons({ lucideChevronRight })], ngImport: i0, template: " <ng-icon name=\"lucideChevronRight\" class=\"text-[length:--spacing(4)] rtl:rotate-180\" /> ", isInline: true, dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
218
224
|
}
|
|
219
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
225
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuItemSubIndicator, decorators: [{
|
|
220
226
|
type: Component,
|
|
221
227
|
args: [{
|
|
222
228
|
selector: 'hlm-dropdown-menu-item-sub-indicator',
|
|
223
229
|
imports: [NgIcon],
|
|
224
230
|
providers: [provideIcons({ lucideChevronRight })],
|
|
225
231
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
226
|
-
template:
|
|
232
|
+
template: " <ng-icon name=\"lucideChevronRight\" class=\"text-[length:--spacing(4)] rtl:rotate-180\" /> ",
|
|
227
233
|
}]
|
|
228
234
|
}], ctorParameters: () => [] });
|
|
229
235
|
|
|
230
236
|
class HlmDropdownMenuLabel {
|
|
231
237
|
inset = input(false, { ...(ngDevMode ? { debugName: "inset" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
232
238
|
constructor() {
|
|
233
|
-
classes(() =>
|
|
239
|
+
classes(() => "text-muted-foreground px-2 py-1.5 text-xs font-medium data-inset:ps-8 block");
|
|
234
240
|
}
|
|
235
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
236
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.
|
|
241
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
242
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmDropdownMenuLabel, isStandalone: true, selector: "[hlmDropdownMenuLabel],hlm-dropdown-menu-label", inputs: { inset: { classPropertyName: "inset", publicName: "inset", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "dropdown-menu-label" }, properties: { "attr.data-inset": "inset() ? \"\" : null" } }, ngImport: i0 });
|
|
237
243
|
}
|
|
238
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
244
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuLabel, decorators: [{
|
|
239
245
|
type: Directive,
|
|
240
246
|
args: [{
|
|
241
247
|
selector: '[hlmDropdownMenuLabel],hlm-dropdown-menu-label',
|
|
@@ -252,14 +258,14 @@ class HlmDropdownMenuRadioCdk extends CdkMenuItemRadio {
|
|
|
252
258
|
trigger(options) {
|
|
253
259
|
super.trigger({ ...options, keepOpen: this.keepOpen() });
|
|
254
260
|
}
|
|
255
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
256
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.
|
|
261
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadioCdk, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
262
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmDropdownMenuRadioCdk, isStandalone: true, selector: "[hlmDropdownMenuRadioCdk]", inputs: { keepOpen: { classPropertyName: "keepOpen", publicName: "keepOpen", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
257
263
|
{ provide: CdkMenuItemRadio, useExisting: HlmDropdownMenuRadioCdk },
|
|
258
264
|
{ provide: CdkMenuItemSelectable, useExisting: HlmDropdownMenuRadioCdk },
|
|
259
265
|
{ provide: CdkMenuItem, useExisting: CdkMenuItemSelectable },
|
|
260
266
|
], usesInheritance: true, ngImport: i0 });
|
|
261
267
|
}
|
|
262
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
268
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadioCdk, decorators: [{
|
|
263
269
|
type: Directive,
|
|
264
270
|
args: [{
|
|
265
271
|
selector: '[hlmDropdownMenuRadioCdk]',
|
|
@@ -275,10 +281,10 @@ class HlmDropdownMenuRadio {
|
|
|
275
281
|
constructor() {
|
|
276
282
|
classes(() => "hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground gap-2 rounded-sm py-1.5 ps-2 pe-8 text-sm data-inset:ps-8 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] group/dropdown-menu-radio relative flex w-full cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_ng-icon]:pointer-events-none [&_ng-icon]:shrink-0");
|
|
277
283
|
}
|
|
278
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
279
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.
|
|
284
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadio, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
285
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuRadio, isStandalone: true, selector: "[hlmDropdownMenuRadio]", host: { attributes: { "data-slot": "dropdown-menu-radio-item" }, properties: { "attr.data-disabled": "_cdkMenuItem.disabled ? \"\" : null", "attr.data-checked": "_cdkMenuItem.checked ? \"\" : null" } }, hostDirectives: [{ directive: HlmDropdownMenuRadioCdk, inputs: ["cdkMenuItemDisabled", "disabled", "cdkMenuItemChecked", "checked", "keepOpen", "keepOpen"], outputs: ["cdkMenuItemTriggered", "triggered"] }, { directive: HlmDropdownMenuFocusOnHover }], ngImport: i0 });
|
|
280
286
|
}
|
|
281
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadio, decorators: [{
|
|
282
288
|
type: Directive,
|
|
283
289
|
args: [{
|
|
284
290
|
selector: '[hlmDropdownMenuRadio]',
|
|
@@ -300,12 +306,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
300
306
|
|
|
301
307
|
class HlmDropdownMenuRadioIndicator {
|
|
302
308
|
constructor() {
|
|
303
|
-
classes(() =>
|
|
309
|
+
classes(() => "absolute end-2 flex items-center justify-center [&_ng-icon]:text-[length:--spacing(4)] pointer-events-none opacity-0 group-data-checked/dropdown-menu-radio:opacity-100");
|
|
304
310
|
}
|
|
305
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
306
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
311
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadioIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
312
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuRadioIndicator, isStandalone: true, selector: "hlm-dropdown-menu-radio-indicator", host: { attributes: { "data-slot": "dropdown-menu-radio-item-indicator" } }, providers: [provideIcons({ lucideCheck })], ngImport: i0, template: ` <ng-icon name="lucideCheck" /> `, isInline: true, dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
307
313
|
}
|
|
308
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
314
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadioIndicator, decorators: [{
|
|
309
315
|
type: Component,
|
|
310
316
|
args: [{
|
|
311
317
|
selector: 'hlm-dropdown-menu-radio-indicator',
|
|
@@ -319,12 +325,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
319
325
|
|
|
320
326
|
class HlmDropdownMenuSeparator {
|
|
321
327
|
constructor() {
|
|
322
|
-
classes(() =>
|
|
328
|
+
classes(() => "bg-border -mx-1 my-1 h-px block");
|
|
323
329
|
}
|
|
324
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
325
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.
|
|
330
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
331
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuSeparator, isStandalone: true, selector: "[hlmDropdownMenuSeparator],hlm-dropdown-menu-separator", host: { attributes: { "data-slot": "dropdown-menu-separator" } }, ngImport: i0 });
|
|
326
332
|
}
|
|
327
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
333
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSeparator, decorators: [{
|
|
328
334
|
type: Directive,
|
|
329
335
|
args: [{
|
|
330
336
|
selector: '[hlmDropdownMenuSeparator],hlm-dropdown-menu-separator',
|
|
@@ -334,12 +340,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
334
340
|
|
|
335
341
|
class HlmDropdownMenuShortcut {
|
|
336
342
|
constructor() {
|
|
337
|
-
classes(() =>
|
|
343
|
+
classes(() => "text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground ml-auto text-xs tracking-widest");
|
|
338
344
|
}
|
|
339
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
340
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.
|
|
345
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuShortcut, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
346
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuShortcut, isStandalone: true, selector: "[hlmDropdownMenuShortcut],hlm-dropdown-menu-shortcut", host: { attributes: { "data-slot": "dropdown-menu-shortcut" } }, ngImport: i0 });
|
|
341
347
|
}
|
|
342
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
348
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuShortcut, decorators: [{
|
|
343
349
|
type: Directive,
|
|
344
350
|
args: [{
|
|
345
351
|
selector: '[hlmDropdownMenuShortcut],hlm-dropdown-menu-shortcut',
|
|
@@ -350,6 +356,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
350
356
|
class HlmDropdownMenuSub {
|
|
351
357
|
_host = inject(CdkMenu);
|
|
352
358
|
_elementRef = inject((ElementRef));
|
|
359
|
+
_document = inject(DOCUMENT);
|
|
360
|
+
_destroyRef = inject(DestroyRef);
|
|
353
361
|
// The sub-trigger provides its configured side; CDK parents this content's injector under it.
|
|
354
362
|
_menuSide = inject(MENU_SIDE, { optional: true });
|
|
355
363
|
_state = signal('open', /* @ts-ignore */
|
|
@@ -361,19 +369,23 @@ class HlmDropdownMenuSub {
|
|
|
361
369
|
// this is a best effort, but does not seem to work currently
|
|
362
370
|
// TODO: figure out a way for us to know the host is about to be closed. might not be possible with CDK
|
|
363
371
|
this._host.closed.pipe(takeUntilDestroyed()).subscribe(() => this._state.set('closed'));
|
|
364
|
-
classes(() =>
|
|
372
|
+
classes(() => "motion-safe:data-open:animate-in motion-safe:data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 bg-popover text-popover-foreground min-w-[96px] rounded-md p-1 shadow-lg ring-1 duration-100 w-auto");
|
|
365
373
|
}
|
|
366
374
|
setSideFromTransformOrigin() {
|
|
367
375
|
const side = this._menuSide?.side() ?? 'right';
|
|
376
|
+
const view = this._document.defaultView;
|
|
377
|
+
if (!view)
|
|
378
|
+
return;
|
|
368
379
|
// CDK sets transform-origin on this element synchronously on attach; read it next tick and derive side
|
|
369
|
-
setTimeout(() => {
|
|
380
|
+
const timer = view.setTimeout(() => {
|
|
370
381
|
this._side.set(deriveMenuSideFromTransformOrigin(this._elementRef.nativeElement.style.transformOrigin, side));
|
|
371
382
|
});
|
|
383
|
+
this._destroyRef.onDestroy(() => view.clearTimeout(timer));
|
|
372
384
|
}
|
|
373
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
374
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.
|
|
385
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSub, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
386
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuSub, isStandalone: true, selector: "[hlmDropdownMenuSub],hlm-dropdown-menu-sub", host: { attributes: { "data-slot": "dropdown-menu-sub" }, properties: { "attr.data-state": "_state()", "attr.data-side": "_side()" } }, hostDirectives: [{ directive: i1.CdkMenu }], ngImport: i0 });
|
|
375
387
|
}
|
|
376
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
388
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSub, decorators: [{
|
|
377
389
|
type: Directive,
|
|
378
390
|
args: [{
|
|
379
391
|
selector: '[hlmDropdownMenuSub],hlm-dropdown-menu-sub',
|
|
@@ -416,12 +428,12 @@ class HlmDropdownMenuSubTrigger {
|
|
|
416
428
|
effect(() => {
|
|
417
429
|
this._cdkTrigger.menuPosition = this._menuPosition();
|
|
418
430
|
});
|
|
419
|
-
classes(() =>
|
|
431
|
+
classes(() => "aria-expanded:bg-accent aria-expanded:text-accent-foreground");
|
|
420
432
|
}
|
|
421
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
422
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.
|
|
433
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSubTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
434
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmDropdownMenuSubTrigger, isStandalone: true, selector: "[hlmDropdownMenuSubTrigger]", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "dropdown-menu-sub-trigger" } }, providers: [{ provide: MENU_SIDE, useExisting: forwardRef(() => HlmDropdownMenuSubTrigger) }], hostDirectives: [{ directive: i1.CdkMenuTrigger, inputs: ["cdkMenuTriggerFor", "hlmDropdownMenuSubTrigger", "cdkMenuTriggerData", "hlmDropdownMenuTriggerData"], outputs: ["cdkMenuOpened", "hlmDropdownMenuSubOpened", "cdkMenuClosed", "hlmDropdownMenuSubClosed"] }], ngImport: i0 });
|
|
423
435
|
}
|
|
424
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
436
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSubTrigger, decorators: [{
|
|
425
437
|
type: Directive,
|
|
426
438
|
args: [{
|
|
427
439
|
selector: '[hlmDropdownMenuSubTrigger]',
|
|
@@ -455,10 +467,10 @@ class HlmDropdownMenuTrigger {
|
|
|
455
467
|
this._cdkTrigger.menuPosition = this._menuPosition();
|
|
456
468
|
});
|
|
457
469
|
}
|
|
458
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
459
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.
|
|
470
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
471
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmDropdownMenuTrigger, isStandalone: true, selector: "[hlmDropdownMenuTrigger]", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "dropdown-menu-trigger" } }, providers: [{ provide: MENU_SIDE, useExisting: forwardRef(() => HlmDropdownMenuTrigger) }], hostDirectives: [{ directive: i1.CdkMenuTrigger, inputs: ["cdkMenuTriggerFor", "hlmDropdownMenuTrigger", "cdkMenuTriggerData", "hlmDropdownMenuTriggerData"], outputs: ["cdkMenuOpened", "hlmDropdownMenuOpened", "cdkMenuClosed", "hlmDropdownMenuClosed"] }], ngImport: i0 });
|
|
460
472
|
}
|
|
461
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
473
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuTrigger, decorators: [{
|
|
462
474
|
type: Directive,
|
|
463
475
|
args: [{
|
|
464
476
|
selector: '[hlmDropdownMenuTrigger]',
|
|
@@ -494,8 +506,8 @@ const HlmDropdownMenuImports = [
|
|
|
494
506
|
HlmDropdownMenuTrigger,
|
|
495
507
|
];
|
|
496
508
|
class HlmDropdownMenuModule {
|
|
497
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
498
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.
|
|
509
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
510
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuModule, imports: [HlmDropdownMenu,
|
|
499
511
|
HlmDropdownMenuCheckbox,
|
|
500
512
|
HlmDropdownMenuCheckboxIndicator,
|
|
501
513
|
HlmDropdownMenuGroup,
|
|
@@ -522,11 +534,11 @@ class HlmDropdownMenuModule {
|
|
|
522
534
|
HlmDropdownMenuSub,
|
|
523
535
|
HlmDropdownMenuSubTrigger,
|
|
524
536
|
HlmDropdownMenuTrigger] });
|
|
525
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.
|
|
537
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuModule, imports: [HlmDropdownMenuCheckboxIndicator,
|
|
526
538
|
HlmDropdownMenuItemSubIndicator,
|
|
527
539
|
HlmDropdownMenuRadioIndicator] });
|
|
528
540
|
}
|
|
529
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
541
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuModule, decorators: [{
|
|
530
542
|
type: NgModule,
|
|
531
543
|
args: [{
|
|
532
544
|
imports: [...HlmDropdownMenuImports],
|
|
@@ -539,4 +551,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
539
551
|
*/
|
|
540
552
|
|
|
541
553
|
export { HlmDropdownMenu, HlmDropdownMenuCheckbox, HlmDropdownMenuCheckboxCdk, HlmDropdownMenuCheckboxIndicator, HlmDropdownMenuFocusOnHover, HlmDropdownMenuGroup, HlmDropdownMenuImports, HlmDropdownMenuItem, HlmDropdownMenuItemSubIndicator, HlmDropdownMenuLabel, HlmDropdownMenuModule, HlmDropdownMenuRadio, HlmDropdownMenuRadioCdk, HlmDropdownMenuRadioIndicator, HlmDropdownMenuSeparator, HlmDropdownMenuShortcut, HlmDropdownMenuSub, HlmDropdownMenuSubTrigger, HlmDropdownMenuTrigger, injectHlmDropdownMenuConfig, provideHlmDropdownMenuConfig };
|
|
542
|
-
|
|
554
|
+
|
|
@@ -8,6 +8,8 @@ import { CdkMenuItemCheckbox, CdkMenuItemRadio } from '@angular/cdk/menu';
|
|
|
8
8
|
declare class HlmDropdownMenu {
|
|
9
9
|
private readonly _host;
|
|
10
10
|
private readonly _elementRef;
|
|
11
|
+
private readonly _document;
|
|
12
|
+
private readonly _destroyRef;
|
|
11
13
|
private readonly _menuSide;
|
|
12
14
|
protected readonly _state: i0.WritableSignal<string>;
|
|
13
15
|
protected readonly _side: i0.WritableSignal<MenuSide>;
|
|
@@ -127,6 +129,8 @@ declare class HlmDropdownMenuShortcut {
|
|
|
127
129
|
declare class HlmDropdownMenuSub {
|
|
128
130
|
private readonly _host;
|
|
129
131
|
private readonly _elementRef;
|
|
132
|
+
private readonly _document;
|
|
133
|
+
private readonly _destroyRef;
|
|
130
134
|
private readonly _menuSide;
|
|
131
135
|
protected readonly _state: i0.WritableSignal<string>;
|
|
132
136
|
protected readonly _side: i0.WritableSignal<MenuSide>;
|