@lucca-front/ng 20.3.3-rc.6 → 21.0.0-rc.1

package/fesm2022/lucca-front-ng-dropdown.mjs

@@ -1,18 +1,18 @@
 import * as i0 from '@angular/core';
-import { inject, input, booleanAttribute, ViewEncapsulation, Component, DestroyRef, Input, Directive, NgModule, EventEmitter, forwardRef, HostListener, Output, TemplateRef, ContentChildren, ViewChild, ChangeDetectionStrategy } from '@angular/core';
+import { inject, input, booleanAttribute, ChangeDetectionStrategy, ViewEncapsulation, Component, EventEmitter, forwardRef, HostListener, Output, Directive, NgModule, TemplateRef, ContentChildren, ViewChild, Input, DestroyRef } from '@angular/core';
 import * as i1 from '@lucca-front/ng/popover2';
 import { PopoverContentComponent, PopoverDirective } from '@lucca-front/ng/popover2';
 import { DividerComponent } from '@lucca-front/ng/divider';
 import { ALuPopoverPanel, luTransformPopover } from '@lucca-front/ng/popover';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { Subscription, merge } from 'rxjs';
 import { startWith, map, delay, share, switchMap, debounceTime } from 'rxjs/operators';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
 class DropdownActionComponent {
     constructor() {
         this.#popoverContentRef = inject(PopoverContentComponent, { optional: true });
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
-        this.critical = input(false, ...(ngDevMode ? [{ debugName: "critical", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+        this.disabled = input(false, { transform: booleanAttribute });
+        this.critical = input(false, { transform: booleanAttribute });
     }
     #popoverContentRef;
     closePanel() {
@@ -20,14 +20,13 @@ class DropdownActionComponent {
             this.#popoverContentRef.close();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.12", type: DropdownActionComponent, isStandalone: true, selector: "[lu-dropdown-action]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, critical: { classPropertyName: "critical", publicName: "critical", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "closePanel()" }, properties: { "class.is-disabled": "disabled()", "class.mod-critical": "critical()" }, classAttribute: "dropdown-list-option-action" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.2", type: DropdownActionComponent, isStandalone: true, selector: "[lu-dropdown-action]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, critical: { classPropertyName: "critical", publicName: "critical", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "closePanel()" }, properties: { "class.is-disabled": "disabled()", "class.mod-critical": "critical()" }, classAttribute: "dropdown-list-option-action" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownActionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownActionComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[lu-dropdown-action]',
-                    standalone: true,
                     template: '<ng-content />',
                     encapsulation: ViewEncapsulation.None,
                     host: {
@@ -36,18 +35,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
                         '[class.mod-critical]': 'critical()',
                         '(click)': 'closePanel()',
                     },
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], critical: [{ type: i0.Input, args: [{ isSignal: true, alias: "critical", required: false }] }] } });
+        }] });
 
 class DropdownDividerComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: DropdownDividerComponent, isStandalone: true, selector: "lu-dropdown-divider", host: { attributes: { "role": "listitem" }, properties: { "attr.aria-hidden": "true" }, classAttribute: "dropdown-list-option" }, ngImport: i0, template: '<lu-divider class="dropdown-list-option-divider" />', isInline: true, dependencies: [{ kind: "component", type: DividerComponent, selector: "lu-divider", inputs: ["separatorRole", "vertical", "size", "withRole"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.2", type: DropdownDividerComponent, isStandalone: true, selector: "lu-dropdown-divider", host: { attributes: { "role": "listitem" }, properties: { "attr.aria-hidden": "true" }, classAttribute: "dropdown-list-option" }, ngImport: i0, template: '<lu-divider class="dropdown-list-option-divider" />', isInline: true, dependencies: [{ kind: "component", type: DividerComponent, selector: "lu-divider", inputs: ["separatorRole", "vertical", "size", "withRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownDividerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownDividerComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'lu-dropdown-divider',
-                    standalone: true,
                     template: '<lu-divider class="dropdown-list-option-divider" />',
                     encapsulation: ViewEncapsulation.None,
                     imports: [DividerComponent],
@@ -56,225 +55,50 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
                         role: 'listitem',
                         '[attr.aria-hidden]': 'true',
                     },
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }] });
 
 class DropdownGroupComponent {
     constructor() {
-        this.label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
+        this.label = input(null);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.12", type: DropdownGroupComponent, isStandalone: true, selector: "lu-dropdown-group", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "listitem" }, classAttribute: "dropdown-list-option" }, ngImport: i0, template: "{{ label() }}\n<ul class=\"dropdown-list\">\n\t<ng-content />\n</ul>\n", encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.2", type: DropdownGroupComponent, isStandalone: true, selector: "lu-dropdown-group", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "listitem" }, classAttribute: "dropdown-list-option" }, ngImport: i0, template: "{{ label() }}\n<ul class=\"dropdown-list\">\n\t<ng-content />\n</ul>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lu-dropdown-group', standalone: true, encapsulation: ViewEncapsulation.None, host: {
+            args: [{ selector: 'lu-dropdown-group', encapsulation: ViewEncapsulation.None, host: {
                         class: 'dropdown-list-option',
                         role: 'listitem',
-                    }, template: "{{ label() }}\n<ul class=\"dropdown-list\">\n\t<ng-content />\n</ul>\n" }]
-        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }] } });
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "{{ label() }}\n<ul class=\"dropdown-list\">\n\t<ng-content />\n</ul>\n" }]
+        }] });
 
 class DropdownItemComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: DropdownItemComponent, isStandalone: true, selector: "lu-dropdown-item", host: { attributes: { "role": "listitem" }, classAttribute: "dropdown-list-option" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.2", type: DropdownItemComponent, isStandalone: true, selector: "lu-dropdown-item", host: { attributes: { "role": "listitem" }, classAttribute: "dropdown-list-option" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'lu-dropdown-item',
-                    standalone: true,
                     template: '<ng-content />',
                     encapsulation: ViewEncapsulation.None,
                     host: {
                         class: 'dropdown-list-option',
                         role: 'listitem',
                     },
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }] });
 
 class DropdownMenuComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: DropdownMenuComponent, isStandalone: true, selector: "lu-dropdown-menu", ngImport: i0, template: "<div class=\"dropdown\">\n\t<ul class=\"dropdown-list\">\n\t\t<ng-content />\n\t</ul>\n</div>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.2", type: DropdownMenuComponent, isStandalone: true, selector: "lu-dropdown-menu", ngImport: i0, template: "<div class=\"dropdown\">\n\t<ul class=\"dropdown-list\">\n\t\t<ng-content />\n\t</ul>\n</div>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DropdownMenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DropdownMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lu-dropdown-menu', standalone: true, encapsulation: ViewEncapsulation.None, template: "<div class=\"dropdown\">\n\t<ul class=\"dropdown-list\">\n\t\t<ng-content />\n\t</ul>\n</div>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"] }]
-        }] });
-
-class LuDropdownTriggerDirective {
-    #destroyRef;
-    // Keeping generic type here just for the sake of backwards compatibility
-    /** References the popover instance that the trigger is associated with. */
-    set inputPanel(p) {
-        if (p instanceof ALuPopoverPanel) {
-            this.popover2.content = p.templateRef;
-            p.close.pipe(takeUntilDestroyed(this.#destroyRef)).subscribe(() => this.popover2.close());
-        }
-        else {
-            this.popover2.content = p;
-        }
-    }
-    constructor() {
-        this.popover2 = inject(PopoverDirective);
-        this.#destroyRef = inject(DestroyRef);
-        /** how the panel will be aligned with the target, allowed values: top, bottom, left, right
-         * @deprecated prefer using customPositions instead
-         * */
-        this.luDropdownAlignment = 'right';
-        // We're using constructor here to setup default values before inputs are processed
-        // This way, the value will be changed if any input changes it but we can still have separate default values
-        this.popover2.luPopoverPosition = 'below';
-        this.popover2.luPopoverNoCloseButton = true;
-    }
-    ngOnInit() {
-        if (!this.popover2.customPositions || this.popover2.customPositions.length === 0) {
-            this.popover2.customPositions = this.legacyPositionBuilder();
-        }
-    }
-    /**********************
-     *
-     * LEGACY STUFF TO HANDLE EXISTING POSITIONS
-     *
-     ***********************/
-    legacyPositionBuilder() {
-        const connectionPosition = {
-            originX: 'start',
-            originY: 'top',
-        };
-        // Position
-        const position = this.popover2.luPopoverPosition;
-        if (position === 'above') {
-            connectionPosition.originY = 'top';
-        }
-        else if (position === 'below') {
-            connectionPosition.originY = 'bottom';
-        }
-        else if (position === 'before') {
-            connectionPosition.originX = 'start';
-        }
-        else if (position === 'after') {
-            connectionPosition.originX = 'end';
-        }
-        // Alignment
-        const alignment = this.luDropdownAlignment;
-        if (position === 'below' || position === 'above') {
-            if (alignment === 'left') {
-                connectionPosition.originX = 'start';
-            }
-            else if (alignment === 'right') {
-                connectionPosition.originX = 'end';
-            }
-            else {
-                connectionPosition.originX = 'center';
-            }
-        }
-        else {
-            if (alignment === 'top') {
-                connectionPosition.originY = 'top';
-            }
-            else if (alignment === 'bottom') {
-                connectionPosition.originY = 'bottom';
-            }
-            else {
-                connectionPosition.originY = 'center';
-            }
-        }
-        const overlayPosition = {
-            overlayX: 'start',
-            overlayY: 'top',
-        };
-        if (position === 'above' || position === 'below') {
-            overlayPosition.overlayX = connectionPosition.originX;
-            overlayPosition.overlayY = position === 'above' ? 'bottom' : 'top';
-        }
-        else {
-            overlayPosition.overlayX = position === 'before' ? 'end' : 'start';
-            overlayPosition.overlayY = connectionPosition.originY;
-        }
-        return [
-            {
-                originX: connectionPosition.originX,
-                originY: connectionPosition.originY,
-                overlayX: overlayPosition.overlayX,
-                overlayY: overlayPosition.overlayY,
-            },
-            {
-                originX: connectionPosition.originX,
-                originY: this.invertVerticalPos(connectionPosition.originY),
-                overlayX: overlayPosition.overlayX,
-                overlayY: this.invertVerticalPos(overlayPosition.overlayY),
-            },
-            {
-                originX: this.invertHorizontalPos(connectionPosition.originX),
-                originY: connectionPosition.originY,
-                overlayX: this.invertHorizontalPos(overlayPosition.overlayX),
-                overlayY: overlayPosition.overlayY,
-            },
-            {
-                originX: this.invertHorizontalPos(connectionPosition.originX),
-                originY: this.invertVerticalPos(connectionPosition.originY),
-                overlayX: this.invertHorizontalPos(overlayPosition.overlayX),
-                overlayY: this.invertVerticalPos(overlayPosition.overlayY),
-            },
-        ];
-    }
-    invertVerticalPos(y) {
-        if (y === 'top') {
-            return 'bottom';
-        }
-        else if (y === 'bottom') {
-            return 'top';
-        }
-        return y;
-    }
-    invertHorizontalPos(x) {
-        if (x === 'end') {
-            return 'start';
-        }
-        else if (x === 'start') {
-            return 'end';
-        }
-        return x;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: LuDropdownTriggerDirective, isStandalone: true, selector: "[luDropdown]", inputs: { inputPanel: ["luDropdown", "inputPanel"] }, host: { properties: { "attr.aria-expanded": "popover2.opened()" } }, exportAs: ["LuDropdownTrigger"], hostDirectives: [{ directive: i1.PopoverDirective, inputs: ["luPopoverPosition", "luDropdownPosition", "luPopoverDisabled", "luDropdownDisabled", "customPositions", "customPositions"], outputs: ["luPopoverOpened", "luDropdownOnOpen", "luPopoverClosed", "luDropdownOnClose"] }], ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownTriggerDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[luDropdown]',
-                    exportAs: 'LuDropdownTrigger',
-                    host: {
-                        '[attr.aria-expanded]': 'popover2.opened()',
-                    },
-                    hostDirectives: [
-                        {
-                            directive: PopoverDirective,
-                            inputs: ['luPopoverPosition: luDropdownPosition', 'luPopoverDisabled: luDropdownDisabled', 'customPositions'],
-                            outputs: ['luPopoverOpened: luDropdownOnOpen', 'luPopoverClosed: luDropdownOnClose'],
-                        },
-                    ],
-                    standalone: true,
-                }]
-        }], ctorParameters: () => [], propDecorators: { inputPanel: [{
-                type: Input,
-                args: ['luDropdown']
-            }] } });
-
-/**
- * @deprecated use `LuDropdownTriggerDirective` instead
- */
-class LuDropdownTriggerModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownTriggerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownTriggerModule, imports: [LuDropdownTriggerDirective], exports: [LuDropdownTriggerDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownTriggerModule }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownTriggerModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [LuDropdownTriggerDirective],
-                    exports: [LuDropdownTriggerDirective],
-                }]
+            args: [{ selector: 'lu-dropdown-menu', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"dropdown\">\n\t<ul class=\"dropdown-list\">\n\t\t<ng-content />\n\t</ul>\n</div>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"] }]
         }] });
 
 class ALuDropdownItem {
@@ -300,8 +124,8 @@ class LuDropdownItemDirective extends ALuDropdownItem {
     ngOnDestroy() {
         this.onSelect.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownItemDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: LuDropdownItemDirective, isStandalone: true, selector: "[luDropdownItem]", outputs: { onSelect: "onSelect" }, host: { listeners: { "click": "onClick($event)", "keydown.enter": "onEnter($event)" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownItemDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.2", type: LuDropdownItemDirective, isStandalone: true, selector: "[luDropdownItem]", outputs: { onSelect: "onSelect" }, host: { listeners: { "click": "onClick($event)", "keydown.enter": "onEnter($event)" } }, providers: [
             {
                 provide: ALuDropdownItem,
                 useExisting: forwardRef(() => LuDropdownItemDirective),
@@ -309,7 +133,7 @@ class LuDropdownItemDirective extends ALuDropdownItem {
             },
         ], exportAs: ["LuDropdownItem"], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownItemDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownItemDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[luDropdownItem]',
@@ -321,7 +145,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
                             multi: true,
                         },
                     ],
-                    standalone: true,
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { onSelect: [{
                 type: Output
@@ -337,11 +160,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
  * @deprecated use `LuDropdownItemDirective` instead
  */
 class LuDropdownItemModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownItemModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownItemModule, imports: [LuDropdownItemDirective], exports: [LuDropdownItemDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownItemModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownItemModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownItemModule, imports: [LuDropdownItemDirective], exports: [LuDropdownItemDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownItemModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownItemModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownItemModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [LuDropdownItemDirective],
@@ -426,12 +249,12 @@ class LuDropdownPanelComponent extends ALuPopoverPanel {
             firstItem.focus();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: LuDropdownPanelComponent, isStandalone: true, selector: "lu-dropdown", inputs: { inputPanelClasses: ["panel-classes", "inputPanelClasses"], inputContentClasses: ["content-classes", "inputContentClasses"] }, outputs: { close: "close", open: "open", hovered: "hovered" }, queries: [{ propertyName: "optionsQL", predicate: ALuDropdownItem, descendants: true }], viewQueries: [{ propertyName: "vcTemplateRef", first: true, predicate: TemplateRef, descendants: true, static: true }], exportAs: ["LuDropdownPanel"], usesInheritance: true, ngImport: i0, template: "<ng-template>\n\t<div\n\t\tclass=\"lu-dropdown-panel lu-popover-panel\"\n\t\t[class]=\"panelClassesMap\"\n\t\t(keydown)=\"_handleKeydown($event)\"\n\t\t(click)=\"onClick()\"\n\t\t(mouseover)=\"onMouseOver()\"\n\t\t(mouseleave)=\"onMouseLeave()\"\n\t\t(mousedown)=\"onMouseDown()\"\n\t\t[attr.id]=\"panelId\"\n\t\t[attr.aria-labelledby]=\"triggerId\"\n\t\t[@transformPopover]=\"'enter'\"\n\t>\n\t\t<div class=\"lu-popover-content dropdown\" [class]=\"contentClassesMap\">\n\t\t\t<ul class=\"dropdown-list\">\n\t\t\t\t<ng-content />\n\t\t\t</ul>\n\t\t</div>\n\t</div>\n</ng-template>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"], animations: [luTransformPopover], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.2", type: LuDropdownPanelComponent, isStandalone: true, selector: "lu-dropdown", inputs: { inputPanelClasses: ["panel-classes", "inputPanelClasses"], inputContentClasses: ["content-classes", "inputContentClasses"] }, outputs: { close: "close", open: "open", hovered: "hovered" }, queries: [{ propertyName: "optionsQL", predicate: ALuDropdownItem, descendants: true }], viewQueries: [{ propertyName: "vcTemplateRef", first: true, predicate: TemplateRef, descendants: true, static: true }], exportAs: ["LuDropdownPanel"], usesInheritance: true, ngImport: i0, template: "<ng-template>\n\t<div\n\t\tclass=\"lu-dropdown-panel lu-popover-panel\"\n\t\t[class]=\"panelClassesMap\"\n\t\t(keydown)=\"_handleKeydown($event)\"\n\t\t(click)=\"onClick()\"\n\t\t(mouseover)=\"onMouseOver()\"\n\t\t(mouseleave)=\"onMouseLeave()\"\n\t\t(mousedown)=\"onMouseDown()\"\n\t\t[attr.id]=\"panelId\"\n\t\t[attr.aria-labelledby]=\"triggerId\"\n\t\t[@transformPopover]=\"'enter'\"\n\t>\n\t\t<div class=\"lu-popover-content dropdown\" [class]=\"contentClassesMap\">\n\t\t\t<ul class=\"dropdown-list\">\n\t\t\t\t<ng-content />\n\t\t\t</ul>\n\t\t</div>\n\t</div>\n</ng-template>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"], animations: [luTransformPopover], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownPanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lu-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, animations: [luTransformPopover], exportAs: 'LuDropdownPanel', standalone: true, encapsulation: ViewEncapsulation.None, template: "<ng-template>\n\t<div\n\t\tclass=\"lu-dropdown-panel lu-popover-panel\"\n\t\t[class]=\"panelClassesMap\"\n\t\t(keydown)=\"_handleKeydown($event)\"\n\t\t(click)=\"onClick()\"\n\t\t(mouseover)=\"onMouseOver()\"\n\t\t(mouseleave)=\"onMouseLeave()\"\n\t\t(mousedown)=\"onMouseDown()\"\n\t\t[attr.id]=\"panelId\"\n\t\t[attr.aria-labelledby]=\"triggerId\"\n\t\t[@transformPopover]=\"'enter'\"\n\t>\n\t\t<div class=\"lu-popover-content dropdown\" [class]=\"contentClassesMap\">\n\t\t\t<ul class=\"dropdown-list\">\n\t\t\t\t<ng-content />\n\t\t\t</ul>\n\t\t</div>\n\t</div>\n</ng-template>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"] }]
+            args: [{ selector: 'lu-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, animations: [luTransformPopover], exportAs: 'LuDropdownPanel', encapsulation: ViewEncapsulation.None, template: "<ng-template>\n\t<div\n\t\tclass=\"lu-dropdown-panel lu-popover-panel\"\n\t\t[class]=\"panelClassesMap\"\n\t\t(keydown)=\"_handleKeydown($event)\"\n\t\t(click)=\"onClick()\"\n\t\t(mouseover)=\"onMouseOver()\"\n\t\t(mouseleave)=\"onMouseLeave()\"\n\t\t(mousedown)=\"onMouseDown()\"\n\t\t[attr.id]=\"panelId\"\n\t\t[attr.aria-labelledby]=\"triggerId\"\n\t\t[@transformPopover]=\"'enter'\"\n\t>\n\t\t<div class=\"lu-popover-content dropdown\" [class]=\"contentClassesMap\">\n\t\t\t<ul class=\"dropdown-list\">\n\t\t\t\t<ng-content />\n\t\t\t</ul>\n\t\t</div>\n\t</div>\n</ng-template>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { inputPanelClasses: [{
                 type: Input,
                 args: ['panel-classes']
@@ -456,11 +279,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
  * @deprecated use `LuDropdownPanelComponent` instead
  */
 class LuDropdownPanelModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownPanelModule, imports: [LuDropdownPanelComponent], exports: [LuDropdownPanelComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownPanelModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownPanelModule, imports: [LuDropdownPanelComponent], exports: [LuDropdownPanelComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownPanelModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownPanelModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownPanelModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [LuDropdownPanelComponent],
@@ -468,12 +291,190 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
                 }]
         }] });
 
+class LuDropdownTriggerDirective {
+    #destroyRef;
+    // Keeping generic type here just for the sake of backwards compatibility
+    /** References the popover instance that the trigger is associated with. */
+    set inputPanel(p) {
+        if (p instanceof ALuPopoverPanel) {
+            this.popover2.content = p.templateRef;
+            p.close.pipe(takeUntilDestroyed(this.#destroyRef)).subscribe(() => this.popover2.close());
+        }
+        else {
+            this.popover2.content = p;
+        }
+    }
+    constructor() {
+        this.popover2 = inject(PopoverDirective);
+        this.#destroyRef = inject(DestroyRef);
+        /** how the panel will be aligned with the target, allowed values: top, bottom, left, right
+         * @deprecated prefer using customPositions instead
+         * */
+        this.luDropdownAlignment = 'right';
+        // We're using constructor here to setup default values before inputs are processed
+        // This way, the value will be changed if any input changes it but we can still have separate default values
+        this.popover2.luPopoverPosition = 'below';
+        this.popover2.luPopoverNoCloseButton = true;
+    }
+    ngOnInit() {
+        if (!this.popover2.customPositions || this.popover2.customPositions.length === 0) {
+            this.popover2.customPositions = this.legacyPositionBuilder();
+        }
+    }
+    /**********************
+     *
+     * LEGACY STUFF TO HANDLE EXISTING POSITIONS
+     *
+     ***********************/
+    legacyPositionBuilder() {
+        const connectionPosition = {
+            originX: 'start',
+            originY: 'top',
+        };
+        // Position
+        const position = this.popover2.luPopoverPosition;
+        if (position === 'above') {
+            connectionPosition.originY = 'top';
+        }
+        else if (position === 'below') {
+            connectionPosition.originY = 'bottom';
+        }
+        else if (position === 'before') {
+            connectionPosition.originX = 'start';
+        }
+        else if (position === 'after') {
+            connectionPosition.originX = 'end';
+        }
+        // Alignment
+        const alignment = this.luDropdownAlignment;
+        if (position === 'below' || position === 'above') {
+            if (alignment === 'left') {
+                connectionPosition.originX = 'start';
+            }
+            else if (alignment === 'right') {
+                connectionPosition.originX = 'end';
+            }
+            else {
+                connectionPosition.originX = 'center';
+            }
+        }
+        else {
+            if (alignment === 'top') {
+                connectionPosition.originY = 'top';
+            }
+            else if (alignment === 'bottom') {
+                connectionPosition.originY = 'bottom';
+            }
+            else {
+                connectionPosition.originY = 'center';
+            }
+        }
+        const overlayPosition = {
+            overlayX: 'start',
+            overlayY: 'top',
+        };
+        if (position === 'above' || position === 'below') {
+            overlayPosition.overlayX = connectionPosition.originX;
+            overlayPosition.overlayY = position === 'above' ? 'bottom' : 'top';
+        }
+        else {
+            overlayPosition.overlayX = position === 'before' ? 'end' : 'start';
+            overlayPosition.overlayY = connectionPosition.originY;
+        }
+        return [
+            {
+                originX: connectionPosition.originX,
+                originY: connectionPosition.originY,
+                overlayX: overlayPosition.overlayX,
+                overlayY: overlayPosition.overlayY,
+            },
+            {
+                originX: connectionPosition.originX,
+                originY: this.invertVerticalPos(connectionPosition.originY),
+                overlayX: overlayPosition.overlayX,
+                overlayY: this.invertVerticalPos(overlayPosition.overlayY),
+            },
+            {
+                originX: this.invertHorizontalPos(connectionPosition.originX),
+                originY: connectionPosition.originY,
+                overlayX: this.invertHorizontalPos(overlayPosition.overlayX),
+                overlayY: overlayPosition.overlayY,
+            },
+            {
+                originX: this.invertHorizontalPos(connectionPosition.originX),
+                originY: this.invertVerticalPos(connectionPosition.originY),
+                overlayX: this.invertHorizontalPos(overlayPosition.overlayX),
+                overlayY: this.invertVerticalPos(overlayPosition.overlayY),
+            },
+        ];
+    }
+    invertVerticalPos(y) {
+        if (y === 'top') {
+            return 'bottom';
+        }
+        else if (y === 'bottom') {
+            return 'top';
+        }
+        return y;
+    }
+    invertHorizontalPos(x) {
+        if (x === 'end') {
+            return 'start';
+        }
+        else if (x === 'start') {
+            return 'end';
+        }
+        return x;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.2", type: LuDropdownTriggerDirective, isStandalone: true, selector: "[luDropdown]", inputs: { inputPanel: ["luDropdown", "inputPanel"] }, host: { properties: { "attr.aria-expanded": "popover2.opened()" } }, exportAs: ["LuDropdownTrigger"], hostDirectives: [{ directive: i1.PopoverDirective, inputs: ["luPopoverPosition", "luDropdownPosition", "luPopoverDisabled", "luDropdownDisabled", "customPositions", "customPositions"], outputs: ["luPopoverOpened", "luDropdownOnOpen", "luPopoverClosed", "luDropdownOnClose"] }], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownTriggerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[luDropdown]',
+                    exportAs: 'LuDropdownTrigger',
+                    host: {
+                        '[attr.aria-expanded]': 'popover2.opened()',
+                    },
+                    hostDirectives: [
+                        {
+                            directive: PopoverDirective,
+                            inputs: ['luPopoverPosition: luDropdownPosition', 'luPopoverDisabled: luDropdownDisabled', 'customPositions'],
+                            outputs: ['luPopoverOpened: luDropdownOnOpen', 'luPopoverClosed: luDropdownOnClose'],
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { inputPanel: [{
+                type: Input,
+                args: ['luDropdown']
+            }] } });
+
+/**
+ * @deprecated use `LuDropdownTriggerDirective` instead
+ */
+class LuDropdownTriggerModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownTriggerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownTriggerModule, imports: [LuDropdownTriggerDirective], exports: [LuDropdownTriggerDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownTriggerModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownTriggerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [LuDropdownTriggerDirective],
+                    exports: [LuDropdownTriggerDirective],
+                }]
+        }] });
+
+/**
+ * @deprecated use `LuDropdownTriggerDirective, LuDropdownPanelComponent, LuDropdownItemDirective` instead
+ */
 class LuDropdownModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownModule, imports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule], exports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownModule, imports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule, LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownModule, imports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule], exports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownModule, imports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule, LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LuDropdownModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: LuDropdownModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule],