@egose/shadcn-theme-ng-tw 0.0.28 → 0.2.0

package/dropdown-menu/fesm2022/dropdown-menu.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, ElementRef, signal, input, numberAttribute, Directive, booleanAttribute, ChangeDetectionStrategy, Component, HOST_TAG_NAME, InjectionToken, computed, effect, forwardRef, NgModule } from '@angular/core';
+import { inject, ElementRef, DOCUMENT, DestroyRef, signal, input, numberAttribute, Directive, booleanAttribute, ChangeDetectionStrategy, Component, HOST_TAG_NAME, InjectionToken, computed, effect, forwardRef, NgModule } from '@angular/core';
 import * as i1 from '@angular/cdk/menu';
 import { CdkMenu, CdkMenuItem, CdkMenuItemCheckbox, CdkMenuItemSelectable, CdkMenuGroup, CdkMenuItemRadio, CdkMenuTrigger } from '@angular/cdk/menu';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
@@ -12,6 +12,8 @@ import { lucideCheck, lucideChevronRight } from '@ng-icons/lucide';
 class HlmDropdownMenu {
     _host = inject(CdkMenu);
     _elementRef = inject((ElementRef));
+    _document = inject(DOCUMENT);
+    _destroyRef = inject(DestroyRef);
     // The trigger provides its configured side; CDK parents this content's injector under the trigger's.
     _menuSide = inject(MENU_SIDE, { optional: true });
     _state = signal('open', /* @ts-ignore */
@@ -20,7 +22,7 @@ class HlmDropdownMenu {
     ...(ngDevMode ? [{ debugName: "_side" }] : /* istanbul ignore next */ []));
     sideOffset = input(1, { ...(ngDevMode ? { debugName: "sideOffset" } : /* istanbul ignore next */ {}), transform: numberAttribute });
     constructor() {
-        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');
+        classes(() => 'tw:motion-safe:data-open:animate-in tw:motion-safe:data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 tw:data-closed:zoom-out-95 tw: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 tw:ring-foreground/10 tw:bg-popover tw:text-popover-foreground tw:min-w-32 tw:rounded-md tw:p-1 tw:shadow-md tw:ring-1 tw:duration-100 tw:my-[--spacing(var(--side-offset))] tw:overflow-x-hidden tw:overflow-y-auto tw:outline-none');
         this.setSideFromTransformOrigin();
         // this is a best effort, but does not seem to work currently
         // 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 {
     }
     setSideFromTransformOrigin() {
         const side = this._menuSide?.side() ?? 'bottom';
+        const view = this._document.defaultView;
+        if (!view)
+            return;
         // CDK sets transform-origin on this element synchronously on attach; read it next tick and derive side
-        setTimeout(() => {
+        const timer = view.setTimeout(() => {
             this._side.set(deriveMenuSideFromTransformOrigin(this._elementRef.nativeElement.style.transformOrigin, side));
         });
+        this._destroyRef.onDestroy(() => view.clearTimeout(timer));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenu, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenu],hlm-dropdown-menu',
@@ -73,10 +79,10 @@ class HlmDropdownMenuFocusOnHover {
         }
         this._parentMenu?.setActiveMenuItem(this._cdkMenuItem);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuFocusOnHover, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmDropdownMenuFocusOnHover, isStandalone: true, selector: "[hlmDropdownMenuFocusOnHover]", host: { listeners: { "mouseenter": "_focusOnHover()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuFocusOnHover, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmDropdownMenuFocusOnHover, isStandalone: true, selector: "[hlmDropdownMenuFocusOnHover]", host: { listeners: { "mouseenter": "_focusOnHover()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuFocusOnHover, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuFocusOnHover, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuFocusOnHover]',
@@ -92,14 +98,14 @@ class HlmDropdownMenuCheckboxCdk extends CdkMenuItemCheckbox {
     trigger(options) {
         super.trigger({ ...options, keepOpen: this.keepOpen() });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuCheckboxCdk, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmDropdownMenuCheckboxCdk, isStandalone: true, selector: "[hlmDropdownMenuCheckboxCdk]", inputs: { keepOpen: { classPropertyName: "keepOpen", publicName: "keepOpen", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckboxCdk, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    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: [
             { provide: CdkMenuItemCheckbox, useExisting: HlmDropdownMenuCheckboxCdk },
             { provide: CdkMenuItemSelectable, useExisting: HlmDropdownMenuCheckboxCdk },
             { provide: CdkMenuItem, useExisting: CdkMenuItemSelectable },
         ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuCheckboxCdk, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckboxCdk, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuCheckboxCdk]',
@@ -114,12 +120,12 @@ class HlmDropdownMenuCheckbox {
     _cdkMenuItem = inject(HlmDropdownMenuCheckboxCdk);
     inset = input(false, { ...(ngDevMode ? { debugName: "inset" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     constructor() {
-        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");
+        classes(() => "tw:hover:bg-accent tw:focus:bg-accent tw:hover:text-accent-foreground tw:focus:text-accent-foreground tw:gap-2 tw:rounded-sm tw:py-1.5 tw:ps-2 tw:pe-8 tw:text-sm tw:data-inset:ps-8 tw:[&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] tw:group/dropdown-menu-checkbox tw:relative tw:flex tw:w-full tw:cursor-default tw:items-center tw:outline-hidden tw:select-none tw:data-disabled:pointer-events-none tw:data-disabled:opacity-50 tw:[&_ng-icon]:pointer-events-none tw:[&_ng-icon]:shrink-0");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuCheckbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckbox, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuCheckbox],[hlmDropdownMenuCheckboxItem]',
@@ -142,12 +148,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmDropdownMenuCheckboxIndicator {
     constructor() {
-        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');
+        classes(() => 'tw:absolute tw:end-2 tw:flex tw:items-center tw:justify-center tw:[&_ng-icon]:text-[length:--spacing(4)] tw:pointer-events-none tw:opacity-0 tw:group-data-checked/dropdown-menu-checkbox:opacity-100');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuCheckboxIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckboxIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuCheckboxIndicator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuCheckboxIndicator, decorators: [{
             type: Component,
             args: [{
                     selector: 'hlm-dropdown-menu-checkbox-indicator',
@@ -161,12 +167,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmDropdownMenuGroup {
     constructor() {
-        classes(() => 'block');
+        classes(() => 'tw:block');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmDropdownMenuGroup, isStandalone: true, selector: "[hlmDropdownMenuGroup],hlm-dropdown-menu-group", host: { attributes: { "data-slot": "dropdown-menu-group" } }, hostDirectives: [{ directive: i1.CdkMenuGroup }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuGroup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuGroup],hlm-dropdown-menu-group',
@@ -182,12 +188,12 @@ class HlmDropdownMenuItem {
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     inset = input(false, { ...(ngDevMode ? { debugName: "inset" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     constructor() {
-        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");
+        classes(() => "tw:hover:bg-accent tw:focus:bg-accent tw:hover:text-accent-foreground tw:focus:text-accent-foreground tw:data-[variant=destructive]:text-destructive tw:data-[variant=destructive]:hover:bg-destructive/10 tw:data-[variant=destructive]:focus:bg-destructive/10 tw:dark:data-[variant=destructive]:hover:bg-destructive/20 tw:dark:data-[variant=destructive]:focus:bg-destructive/20 tw:data-[variant=destructive]:hover:text-destructive tw:data-[variant=destructive]:focus:text-destructive tw:data-[variant=destructive]:*:[ng-icon]:text-destructive tw:not-data-[variant=destructive]:hover:**:text-accent-foreground tw:not-data-[variant=destructive]:focus:**:text-accent-foreground tw:gap-2 tw:rounded-sm tw:px-2 tw:py-1.5 tw:text-sm tw:data-inset:ps-8 tw:[&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] tw:group/dropdown-menu-item tw:relative tw:flex tw:w-full tw:cursor-default tw:items-center tw:outline-hidden tw:select-none tw:data-disabled:pointer-events-none tw:data-disabled:opacity-50 tw:[&_ng-icon]:pointer-events-none tw:[&_ng-icon]:shrink-0");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuItem, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuItem],hlm-dropdown-menu-item',
@@ -211,31 +217,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmDropdownMenuItemSubIndicator {
     constructor() {
-        classes(() => 'ms-auto flex items-center justify-center');
+        classes(() => 'tw:ms-auto tw:flex tw:items-center tw:justify-center');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuItemSubIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuItemSubIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    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="tw:text-[length:--spacing(4)] tw:rtl:rotate-180" /> `, isInline: true, dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuItemSubIndicator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuItemSubIndicator, decorators: [{
             type: Component,
             args: [{
                     selector: 'hlm-dropdown-menu-item-sub-indicator',
                     imports: [NgIcon],
                     providers: [provideIcons({ lucideChevronRight })],
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    template: ` <ng-icon name="lucideChevronRight" class="text-[length:--spacing(4)] rtl:rotate-180" /> `,
+                    template: ` <ng-icon name="lucideChevronRight" class="tw:text-[length:--spacing(4)] tw:rtl:rotate-180" /> `,
                 }]
         }], ctorParameters: () => [] });
 
 class HlmDropdownMenuLabel {
     inset = input(false, { ...(ngDevMode ? { debugName: "inset" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     constructor() {
-        classes(() => 'text-muted-foreground px-2 py-1.5 text-xs font-medium data-inset:ps-8 block');
+        classes(() => 'tw:text-muted-foreground tw:px-2 tw:py-1.5 tw:text-xs tw:font-medium tw:data-inset:ps-8 tw:block');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuLabel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuLabel, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuLabel],hlm-dropdown-menu-label',
@@ -252,14 +258,14 @@ class HlmDropdownMenuRadioCdk extends CdkMenuItemRadio {
     trigger(options) {
         super.trigger({ ...options, keepOpen: this.keepOpen() });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuRadioCdk, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmDropdownMenuRadioCdk, isStandalone: true, selector: "[hlmDropdownMenuRadioCdk]", inputs: { keepOpen: { classPropertyName: "keepOpen", publicName: "keepOpen", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadioCdk, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    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: [
             { provide: CdkMenuItemRadio, useExisting: HlmDropdownMenuRadioCdk },
             { provide: CdkMenuItemSelectable, useExisting: HlmDropdownMenuRadioCdk },
             { provide: CdkMenuItem, useExisting: CdkMenuItemSelectable },
         ], usesInheritance: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuRadioCdk, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadioCdk, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuRadioCdk]',
@@ -273,12 +279,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 class HlmDropdownMenuRadio {
     _cdkMenuItem = inject(HlmDropdownMenuRadioCdk);
     constructor() {
-        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");
+        classes(() => "tw:hover:bg-accent tw:focus:bg-accent tw:hover:text-accent-foreground tw:focus:text-accent-foreground tw:gap-2 tw:rounded-sm tw:py-1.5 tw:ps-2 tw:pe-8 tw:text-sm tw:data-inset:ps-8 tw:[&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] tw:group/dropdown-menu-radio tw:relative tw:flex tw:w-full tw:cursor-default tw:items-center tw:outline-hidden tw:select-none tw:data-disabled:pointer-events-none tw:data-disabled:opacity-50 tw:[&_ng-icon]:pointer-events-none tw:[&_ng-icon]:shrink-0");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuRadio, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadio, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuRadio, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadio, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuRadio]',
@@ -300,12 +306,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmDropdownMenuRadioIndicator {
     constructor() {
-        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');
+        classes(() => 'tw:absolute tw:end-2 tw:flex tw:items-center tw:justify-center tw:[&_ng-icon]:text-[length:--spacing(4)] tw:pointer-events-none tw:opacity-0 tw:group-data-checked/dropdown-menu-radio:opacity-100');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuRadioIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadioIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuRadioIndicator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuRadioIndicator, decorators: [{
             type: Component,
             args: [{
                     selector: 'hlm-dropdown-menu-radio-indicator',
@@ -319,12 +325,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmDropdownMenuSeparator {
     constructor() {
-        classes(() => 'bg-border -mx-1 my-1 h-px block');
+        classes(() => 'tw:bg-border tw:-mx-1 tw:my-1 tw:h-px tw:block');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmDropdownMenuSeparator, isStandalone: true, selector: "[hlmDropdownMenuSeparator],hlm-dropdown-menu-separator", host: { attributes: { "data-slot": "dropdown-menu-separator" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuSeparator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSeparator, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuSeparator],hlm-dropdown-menu-separator',
@@ -334,12 +340,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmDropdownMenuShortcut {
     constructor() {
-        classes(() => 'text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground ml-auto text-xs tracking-widest');
+        classes(() => 'tw:text-muted-foreground tw:group-focus/dropdown-menu-item:text-accent-foreground tw:ml-auto tw:text-xs tw:tracking-widest');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuShortcut, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmDropdownMenuShortcut, isStandalone: true, selector: "[hlmDropdownMenuShortcut],hlm-dropdown-menu-shortcut", host: { attributes: { "data-slot": "dropdown-menu-shortcut" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuShortcut, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuShortcut, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuShortcut, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuShortcut],hlm-dropdown-menu-shortcut',
@@ -350,6 +356,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 class HlmDropdownMenuSub {
     _host = inject(CdkMenu);
     _elementRef = inject((ElementRef));
+    _document = inject(DOCUMENT);
+    _destroyRef = inject(DestroyRef);
     // The sub-trigger provides its configured side; CDK parents this content's injector under it.
     _menuSide = inject(MENU_SIDE, { optional: true });
     _state = signal('open', /* @ts-ignore */
@@ -361,19 +369,23 @@ class HlmDropdownMenuSub {
         // this is a best effort, but does not seem to work currently
         // TODO: figure out a way for us to know the host is about to be closed. might not be possible with CDK
         this._host.closed.pipe(takeUntilDestroyed()).subscribe(() => this._state.set('closed'));
-        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');
+        classes(() => 'tw:motion-safe:data-open:animate-in tw:motion-safe:data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 tw:data-closed:zoom-out-95 tw: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 tw:ring-foreground/10 tw:bg-popover tw:text-popover-foreground tw:min-w-[96px] tw:rounded-md tw:p-1 tw:shadow-lg tw:ring-1 tw:duration-100 tw:w-auto');
     }
     setSideFromTransformOrigin() {
         const side = this._menuSide?.side() ?? 'right';
+        const view = this._document.defaultView;
+        if (!view)
+            return;
         // CDK sets transform-origin on this element synchronously on attach; read it next tick and derive side
-        setTimeout(() => {
+        const timer = view.setTimeout(() => {
             this._side.set(deriveMenuSideFromTransformOrigin(this._elementRef.nativeElement.style.transformOrigin, side));
         });
+        this._destroyRef.onDestroy(() => view.clearTimeout(timer));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuSub, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSub, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuSub, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSub, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuSub],hlm-dropdown-menu-sub',
@@ -416,12 +428,12 @@ class HlmDropdownMenuSubTrigger {
         effect(() => {
             this._cdkTrigger.menuPosition = this._menuPosition();
         });
-        classes(() => 'aria-expanded:bg-accent aria-expanded:text-accent-foreground');
+        classes(() => 'tw:aria-expanded:bg-accent tw:aria-expanded:text-accent-foreground');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuSubTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSubTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuSubTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuSubTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuSubTrigger]',
@@ -455,10 +467,10 @@ class HlmDropdownMenuTrigger {
             this._cdkTrigger.menuPosition = this._menuPosition();
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", 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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    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 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmDropdownMenuTrigger]',
@@ -494,8 +506,8 @@ const HlmDropdownMenuImports = [
     HlmDropdownMenuTrigger,
 ];
 class HlmDropdownMenuModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuModule, imports: [HlmDropdownMenu,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuModule, imports: [HlmDropdownMenu,
             HlmDropdownMenuCheckbox,
             HlmDropdownMenuCheckboxIndicator,
             HlmDropdownMenuGroup,
@@ -522,11 +534,11 @@ class HlmDropdownMenuModule {
             HlmDropdownMenuSub,
             HlmDropdownMenuSubTrigger,
             HlmDropdownMenuTrigger] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuModule, imports: [HlmDropdownMenuCheckboxIndicator,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuModule, imports: [HlmDropdownMenuCheckboxIndicator,
             HlmDropdownMenuItemSubIndicator,
             HlmDropdownMenuRadioIndicator] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmDropdownMenuModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmDropdownMenuModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...HlmDropdownMenuImports],
@@ -539,4 +551,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
  */
 
 export { HlmDropdownMenu, HlmDropdownMenuCheckbox, HlmDropdownMenuCheckboxCdk, HlmDropdownMenuCheckboxIndicator, HlmDropdownMenuFocusOnHover, HlmDropdownMenuGroup, HlmDropdownMenuImports, HlmDropdownMenuItem, HlmDropdownMenuItemSubIndicator, HlmDropdownMenuLabel, HlmDropdownMenuModule, HlmDropdownMenuRadio, HlmDropdownMenuRadioCdk, HlmDropdownMenuRadioIndicator, HlmDropdownMenuSeparator, HlmDropdownMenuShortcut, HlmDropdownMenuSub, HlmDropdownMenuSubTrigger, HlmDropdownMenuTrigger, injectHlmDropdownMenuConfig, provideHlmDropdownMenuConfig };
-//# sourceMappingURL=dropdown-menu.mjs.map
+

package/dropdown-menu/types/dropdown-menu.d.ts

@@ -8,6 +8,8 @@ import { CdkMenuItemCheckbox, CdkMenuItemRadio } from '@angular/cdk/menu';
 declare class HlmDropdownMenu {
     private readonly _host;
     private readonly _elementRef;
+    private readonly _document;
+    private readonly _destroyRef;
     private readonly _menuSide;
     protected readonly _state: i0.WritableSignal<string>;
     protected readonly _side: i0.WritableSignal<MenuSide>;
@@ -127,6 +129,8 @@ declare class HlmDropdownMenuShortcut {
 declare class HlmDropdownMenuSub {
     private readonly _host;
     private readonly _elementRef;
+    private readonly _document;
+    private readonly _destroyRef;
     private readonly _menuSide;
     protected readonly _state: i0.WritableSignal<string>;
     protected readonly _side: i0.WritableSignal<MenuSide>;