@lucca-front/ng 19.0.0 → 19.1.0

package/fesm2022/lucca-front-ng-multi-select.mjs

@@ -287,7 +287,7 @@ class LuMultiSelectPanelComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: LuMultiSelectPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: LuMultiSelectPanelComponent, isStandalone: true, selector: "lu-select-panel", providers: [CoreSelectKeyManager], viewQueries: [{ propertyName: "optionsQL", predicate: _LuOptionComponent, descendants: true }], ngImport: i0, template: "<div\n\tclass=\"lu-picker-panel lu-option-picker-panel mod-multiple\"\n\trole=\"dialog\"\n\t*ngIf=\"{\n\t\toptions: (options$ | async) || [],\n\t\tgroupTemplateLocation: groupTemplateLocation$ | async,\n\t\tshouldDisplayAddOption: shouldDisplayAddOption$ | async,\n\t} as ctx\"\n>\n\t<div\n\t\tclass=\"lu-picker-content\"\n\t\t[class.is-loading]=\"loading$ | async\"\n\t\t[class.is-filled]=\"ctx.options.length > 0\"\n\t\ttabindex=\"0\"\n\t\trole=\"listbox\"\n\t\taria-multiselectable=\"true\"\n\t\t(scroll)=\"onScroll($event)\"\n\t>\n\t\t<ng-container *luPortal=\"selectInput.panelHeaderTpl()\" />\n\n\t\t<div class=\"lu-picker-content-option\">\n\t\t\t<ng-container *ngIf=\"grouping && ctx.groupTemplateLocation === 'group-header'\">\n\t\t\t\t<div\n\t\t\t\t\t*ngFor=\"let group of ctx.options | luOptionGroup:grouping.selector; trackBy: trackGroupsBy\"\n\t\t\t\t\tclass=\"lu-picker-content-group\"\n\t\t\t\t\trole=\"group\"\n\t\t\t\t\t[attr.aria-labelledby]=\"selectId + '-group-' + group.key\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"lu-picker-content-option-group-title\" role=\"presentation\">\n\t\t\t\t\t\t<ng-container *luPortal=\"grouping.content; context: { $implicit: group }\" />\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t*ngIf=\"group.options | luOptionsGroupContext:selectedOptions:optionComparer as groupCtx\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclass=\"link\"\n\t\t\t\t\t\t\t[id]=\"selectId + '-group-' + group.key\"\n\t\t\t\t\t\t\t(click)=\"toggleOptions(groupCtx.notSelectedOptions, group.options)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{{ groupCtx.isGroupSelected ? intl.unselectAll : intl.selectAll }}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ng-template [ngTemplateOutlet]=\"optionsList\" [ngTemplateOutletContext]=\"{ $implicit: group.options }\" />\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<ng-container *ngIf=\"!grouping || ctx.groupTemplateLocation !== 'group-header'\">\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"optionsList\" [ngTemplateOutletContext]=\"{ $implicit: ctx.options }\" />\n\t\t\t</ng-container>\n\n\t\t\t<ng-template #optionsList let-options>\n\t\t\t\t<lu-select-option\n\t\t\t\t\t*ngFor=\"let option of options; let index = index; trackBy: trackOptionsBy\"\n\t\t\t\t\t[option]=\"option\"\n\t\t\t\t\t[optionTpl]=\"optionTpl()\"\n\t\t\t\t\t[optionIndex]=\"index\"\n\t\t\t\t\t[grouping]=\"ctx.groupTemplateLocation === 'option' ? grouping : undefined\"\n\t\t\t\t\t[scrollIntoViewOptions]=\"{ block: 'nearest' }\"\n\t\t\t\t\t[isSelected]=\"option | luIsOptionSelected:optionComparer:selectedOptions\"\n\t\t\t\t\t(click)=\"toggleOption(option)\"\n\t\t\t\t/>\n\t\t\t</ng-template>\n\t\t\t<div class=\"lu-picker-content-option-emptyState\" *ngIf=\"ctx.options.length === 0 && (loading$ | async) === false\">\n\t\t\t\t{{intl.emptyResults}}\n\t\t\t</div>\n\t\t</div>\n\t\t<div *ngIf=\"loading$ | async\" class=\"lu-picker-content-loading\">\n\t\t\t<div class=\"loading\">{{intl.loading}}</div>\n\t\t</div>\n\t\t<div class=\"lu-picker-content-add\" *ngIf=\"ctx.shouldDisplayAddOption\">\n\t\t\t<button class=\"button mod-text mod-icon palette-product\" type=\"button\" (click)=\"selectInput.emitAddOption()\">\n\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-mathsPlus\"></span>\n\t\t\t\t<ng-container *luPortal=\"selectInput.addOptionLabel\" />\n\t\t\t</button>\n\t\t</div>\n\t</div>\n</div>\n", styles: [".optionItem-groupKey{padding:var(--components-options-item-padding-vertical) var(--components-options-item-padding-horizontal) var(--pr-t-spacings-50);font-size:var(--sizes-S-fontSize);line-height:var(--sizes-S-lineHeight);width:100%;text-align:left;color:var(--palettes-neutral-600);margin:0}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "pipe", type: LuIsOptionSelectedPipe, name: "luIsOptionSelected" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: _LuOptionComponent, selector: "lu-select-option", inputs: ["optionTpl", "isSelected", "option", "grouping", "optionIndex", "scrollIntoViewOptions"] }, { kind: "pipe", type: _LuOptionGroupPipe, name: "luOptionGroup" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }, { kind: "pipe", type: LuOptionsGroupContextPipe, name: "luOptionsGroupContext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: LuMultiSelectPanelComponent, isStandalone: true, selector: "lu-select-panel", providers: [CoreSelectKeyManager], viewQueries: [{ propertyName: "optionsQL", predicate: _LuOptionComponent, descendants: true }], ngImport: i0, template: "<div\n\tclass=\"lu-picker-panel lu-option-picker-panel mod-multiple\"\n\trole=\"dialog\"\n\t*ngIf=\"{\n\t\toptions: (options$ | async) || [],\n\t\tgroupTemplateLocation: groupTemplateLocation$ | async,\n\t\tshouldDisplayAddOption: shouldDisplayAddOption$ | async,\n\t} as ctx\"\n>\n\t<div\n\t\tclass=\"lu-picker-content\"\n\t\t[class.is-loading]=\"loading$ | async\"\n\t\t[class.is-filled]=\"ctx.options.length > 0\"\n\t\ttabindex=\"0\"\n\t\trole=\"listbox\"\n\t\taria-multiselectable=\"true\"\n\t\t(scroll)=\"onScroll($event)\"\n\t>\n\t\t<ng-container *luPortal=\"selectInput.panelHeaderTpl()\" />\n\n\t\t<div class=\"lu-picker-content-option\">\n\t\t\t<ng-container *ngIf=\"grouping && ctx.groupTemplateLocation === 'group-header'\">\n\t\t\t\t<div\n\t\t\t\t\t*ngFor=\"let group of ctx.options | luOptionGroup:grouping.selector; trackBy: trackGroupsBy\"\n\t\t\t\t\tclass=\"lu-picker-content-group\"\n\t\t\t\t\trole=\"group\"\n\t\t\t\t\t[attr.aria-labelledby]=\"selectId + '-group-' + group.key\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"lu-picker-content-option-group-title\" role=\"presentation\">\n\t\t\t\t\t\t<ng-container *luPortal=\"grouping.content; context: { $implicit: group }\" />\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t*ngIf=\"group.options | luOptionsGroupContext:selectedOptions:optionComparer as groupCtx\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclass=\"link\"\n\t\t\t\t\t\t\t[id]=\"selectId + '-group-' + group.key\"\n\t\t\t\t\t\t\t(click)=\"toggleOptions(groupCtx.notSelectedOptions, group.options)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{{ groupCtx.isGroupSelected ? intl.unselectAll : intl.selectAll }}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ng-template [ngTemplateOutlet]=\"optionsList\" [ngTemplateOutletContext]=\"{ $implicit: group.options }\" />\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<ng-container *ngIf=\"!grouping || ctx.groupTemplateLocation !== 'group-header'\">\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"optionsList\" [ngTemplateOutletContext]=\"{ $implicit: ctx.options }\" />\n\t\t\t</ng-container>\n\n\t\t\t<ng-template #optionsList let-options>\n\t\t\t\t<lu-select-option\n\t\t\t\t\t*ngFor=\"let option of options; let index = index; trackBy: trackOptionsBy\"\n\t\t\t\t\t[option]=\"option\"\n\t\t\t\t\t[optionTpl]=\"optionTpl()\"\n\t\t\t\t\t[optionIndex]=\"index\"\n\t\t\t\t\t[grouping]=\"ctx.groupTemplateLocation === 'option' ? grouping : undefined\"\n\t\t\t\t\t[scrollIntoViewOptions]=\"{ block: 'nearest' }\"\n\t\t\t\t\t[isSelected]=\"option | luIsOptionSelected:optionComparer:selectedOptions\"\n\t\t\t\t\t(click)=\"toggleOption(option)\"\n\t\t\t\t/>\n\t\t\t</ng-template>\n\t\t\t<div class=\"lu-picker-content-option-emptyState\" *ngIf=\"ctx.options.length === 0 && (loading$ | async) === false\">\n\t\t\t\t{{intl.emptyResults}}\n\t\t\t</div>\n\t\t</div>\n\t\t<div *ngIf=\"loading$ | async\" class=\"lu-picker-content-loading\">\n\t\t\t<div class=\"loading\">{{intl.loading}}</div>\n\t\t</div>\n\t\t<div class=\"lu-picker-content-add\" *ngIf=\"ctx.shouldDisplayAddOption\">\n\t\t\t<button class=\"button mod-text mod-withIcon palette-product\" type=\"button\" (click)=\"selectInput.emitAddOption()\">\n\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-mathsPlus\"></span>\n\t\t\t\t<ng-container *luPortal=\"selectInput.addOptionLabel\" />\n\t\t\t</button>\n\t\t</div>\n\t</div>\n</div>\n", styles: [".optionItem-groupKey{padding:var(--components-options-item-padding-vertical) var(--components-options-item-padding-horizontal) var(--pr-t-spacings-50);font-size:var(--sizes-S-fontSize);line-height:var(--sizes-S-lineHeight);width:100%;text-align:left;color:var(--palettes-neutral-600);margin:0}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "pipe", type: LuIsOptionSelectedPipe, name: "luIsOptionSelected" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: _LuOptionComponent, selector: "lu-select-option", inputs: ["optionTpl", "isSelected", "option", "grouping", "optionIndex", "scrollIntoViewOptions"] }, { kind: "pipe", type: _LuOptionGroupPipe, name: "luOptionGroup" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }, { kind: "pipe", type: LuOptionsGroupContextPipe, name: "luOptionsGroupContext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: LuMultiSelectPanelComponent, decorators: [{
             type: Component,
@@ -305,7 +305,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
                         NgTemplateOutlet,
                         PortalDirective,
                         LuOptionsGroupContextPipe,
-                    ], providers: [CoreSelectKeyManager], template: "<div\n\tclass=\"lu-picker-panel lu-option-picker-panel mod-multiple\"\n\trole=\"dialog\"\n\t*ngIf=\"{\n\t\toptions: (options$ | async) || [],\n\t\tgroupTemplateLocation: groupTemplateLocation$ | async,\n\t\tshouldDisplayAddOption: shouldDisplayAddOption$ | async,\n\t} as ctx\"\n>\n\t<div\n\t\tclass=\"lu-picker-content\"\n\t\t[class.is-loading]=\"loading$ | async\"\n\t\t[class.is-filled]=\"ctx.options.length > 0\"\n\t\ttabindex=\"0\"\n\t\trole=\"listbox\"\n\t\taria-multiselectable=\"true\"\n\t\t(scroll)=\"onScroll($event)\"\n\t>\n\t\t<ng-container *luPortal=\"selectInput.panelHeaderTpl()\" />\n\n\t\t<div class=\"lu-picker-content-option\">\n\t\t\t<ng-container *ngIf=\"grouping && ctx.groupTemplateLocation === 'group-header'\">\n\t\t\t\t<div\n\t\t\t\t\t*ngFor=\"let group of ctx.options | luOptionGroup:grouping.selector; trackBy: trackGroupsBy\"\n\t\t\t\t\tclass=\"lu-picker-content-group\"\n\t\t\t\t\trole=\"group\"\n\t\t\t\t\t[attr.aria-labelledby]=\"selectId + '-group-' + group.key\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"lu-picker-content-option-group-title\" role=\"presentation\">\n\t\t\t\t\t\t<ng-container *luPortal=\"grouping.content; context: { $implicit: group }\" />\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t*ngIf=\"group.options | luOptionsGroupContext:selectedOptions:optionComparer as groupCtx\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclass=\"link\"\n\t\t\t\t\t\t\t[id]=\"selectId + '-group-' + group.key\"\n\t\t\t\t\t\t\t(click)=\"toggleOptions(groupCtx.notSelectedOptions, group.options)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{{ groupCtx.isGroupSelected ? intl.unselectAll : intl.selectAll }}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ng-template [ngTemplateOutlet]=\"optionsList\" [ngTemplateOutletContext]=\"{ $implicit: group.options }\" />\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<ng-container *ngIf=\"!grouping || ctx.groupTemplateLocation !== 'group-header'\">\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"optionsList\" [ngTemplateOutletContext]=\"{ $implicit: ctx.options }\" />\n\t\t\t</ng-container>\n\n\t\t\t<ng-template #optionsList let-options>\n\t\t\t\t<lu-select-option\n\t\t\t\t\t*ngFor=\"let option of options; let index = index; trackBy: trackOptionsBy\"\n\t\t\t\t\t[option]=\"option\"\n\t\t\t\t\t[optionTpl]=\"optionTpl()\"\n\t\t\t\t\t[optionIndex]=\"index\"\n\t\t\t\t\t[grouping]=\"ctx.groupTemplateLocation === 'option' ? grouping : undefined\"\n\t\t\t\t\t[scrollIntoViewOptions]=\"{ block: 'nearest' }\"\n\t\t\t\t\t[isSelected]=\"option | luIsOptionSelected:optionComparer:selectedOptions\"\n\t\t\t\t\t(click)=\"toggleOption(option)\"\n\t\t\t\t/>\n\t\t\t</ng-template>\n\t\t\t<div class=\"lu-picker-content-option-emptyState\" *ngIf=\"ctx.options.length === 0 && (loading$ | async) === false\">\n\t\t\t\t{{intl.emptyResults}}\n\t\t\t</div>\n\t\t</div>\n\t\t<div *ngIf=\"loading$ | async\" class=\"lu-picker-content-loading\">\n\t\t\t<div class=\"loading\">{{intl.loading}}</div>\n\t\t</div>\n\t\t<div class=\"lu-picker-content-add\" *ngIf=\"ctx.shouldDisplayAddOption\">\n\t\t\t<button class=\"button mod-text mod-icon palette-product\" type=\"button\" (click)=\"selectInput.emitAddOption()\">\n\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-mathsPlus\"></span>\n\t\t\t\t<ng-container *luPortal=\"selectInput.addOptionLabel\" />\n\t\t\t</button>\n\t\t</div>\n\t</div>\n</div>\n", styles: [".optionItem-groupKey{padding:var(--components-options-item-padding-vertical) var(--components-options-item-padding-horizontal) var(--pr-t-spacings-50);font-size:var(--sizes-S-fontSize);line-height:var(--sizes-S-lineHeight);width:100%;text-align:left;color:var(--palettes-neutral-600);margin:0}\n"] }]
+                    ], providers: [CoreSelectKeyManager], template: "<div\n\tclass=\"lu-picker-panel lu-option-picker-panel mod-multiple\"\n\trole=\"dialog\"\n\t*ngIf=\"{\n\t\toptions: (options$ | async) || [],\n\t\tgroupTemplateLocation: groupTemplateLocation$ | async,\n\t\tshouldDisplayAddOption: shouldDisplayAddOption$ | async,\n\t} as ctx\"\n>\n\t<div\n\t\tclass=\"lu-picker-content\"\n\t\t[class.is-loading]=\"loading$ | async\"\n\t\t[class.is-filled]=\"ctx.options.length > 0\"\n\t\ttabindex=\"0\"\n\t\trole=\"listbox\"\n\t\taria-multiselectable=\"true\"\n\t\t(scroll)=\"onScroll($event)\"\n\t>\n\t\t<ng-container *luPortal=\"selectInput.panelHeaderTpl()\" />\n\n\t\t<div class=\"lu-picker-content-option\">\n\t\t\t<ng-container *ngIf=\"grouping && ctx.groupTemplateLocation === 'group-header'\">\n\t\t\t\t<div\n\t\t\t\t\t*ngFor=\"let group of ctx.options | luOptionGroup:grouping.selector; trackBy: trackGroupsBy\"\n\t\t\t\t\tclass=\"lu-picker-content-group\"\n\t\t\t\t\trole=\"group\"\n\t\t\t\t\t[attr.aria-labelledby]=\"selectId + '-group-' + group.key\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"lu-picker-content-option-group-title\" role=\"presentation\">\n\t\t\t\t\t\t<ng-container *luPortal=\"grouping.content; context: { $implicit: group }\" />\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t*ngIf=\"group.options | luOptionsGroupContext:selectedOptions:optionComparer as groupCtx\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclass=\"link\"\n\t\t\t\t\t\t\t[id]=\"selectId + '-group-' + group.key\"\n\t\t\t\t\t\t\t(click)=\"toggleOptions(groupCtx.notSelectedOptions, group.options)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{{ groupCtx.isGroupSelected ? intl.unselectAll : intl.selectAll }}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ng-template [ngTemplateOutlet]=\"optionsList\" [ngTemplateOutletContext]=\"{ $implicit: group.options }\" />\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<ng-container *ngIf=\"!grouping || ctx.groupTemplateLocation !== 'group-header'\">\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"optionsList\" [ngTemplateOutletContext]=\"{ $implicit: ctx.options }\" />\n\t\t\t</ng-container>\n\n\t\t\t<ng-template #optionsList let-options>\n\t\t\t\t<lu-select-option\n\t\t\t\t\t*ngFor=\"let option of options; let index = index; trackBy: trackOptionsBy\"\n\t\t\t\t\t[option]=\"option\"\n\t\t\t\t\t[optionTpl]=\"optionTpl()\"\n\t\t\t\t\t[optionIndex]=\"index\"\n\t\t\t\t\t[grouping]=\"ctx.groupTemplateLocation === 'option' ? grouping : undefined\"\n\t\t\t\t\t[scrollIntoViewOptions]=\"{ block: 'nearest' }\"\n\t\t\t\t\t[isSelected]=\"option | luIsOptionSelected:optionComparer:selectedOptions\"\n\t\t\t\t\t(click)=\"toggleOption(option)\"\n\t\t\t\t/>\n\t\t\t</ng-template>\n\t\t\t<div class=\"lu-picker-content-option-emptyState\" *ngIf=\"ctx.options.length === 0 && (loading$ | async) === false\">\n\t\t\t\t{{intl.emptyResults}}\n\t\t\t</div>\n\t\t</div>\n\t\t<div *ngIf=\"loading$ | async\" class=\"lu-picker-content-loading\">\n\t\t\t<div class=\"loading\">{{intl.loading}}</div>\n\t\t</div>\n\t\t<div class=\"lu-picker-content-add\" *ngIf=\"ctx.shouldDisplayAddOption\">\n\t\t\t<button class=\"button mod-text mod-withIcon palette-product\" type=\"button\" (click)=\"selectInput.emitAddOption()\">\n\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-mathsPlus\"></span>\n\t\t\t\t<ng-container *luPortal=\"selectInput.addOptionLabel\" />\n\t\t\t</button>\n\t\t</div>\n\t</div>\n</div>\n", styles: [".optionItem-groupKey{padding:var(--components-options-item-padding-vertical) var(--components-options-item-padding-horizontal) var(--pr-t-spacings-50);font-size:var(--sizes-S-fontSize);line-height:var(--sizes-S-lineHeight);width:100%;text-align:left;color:var(--palettes-neutral-600);margin:0}\n"] }]
         }], propDecorators: { optionsQL: [{
                 type: ViewChildren,
                 args: [_LuOptionComponent]
@@ -492,7 +492,7 @@ class LuMultiSelectInputComponent extends ALuSelectInputComponent {
             },
             provideLuSelectLabelsAndIds(),
             LuMultiSelectPanelRefFactory,
-        ], usesInheritance: true, ngImport: i0, template: "<ng-container *luOptionOutlet=\"valuesTpl(); value: value || []\"></ng-container>\n\n<button\n\t*ngIf=\"hasValue() && clearable && (disabled$ | async) === false\"\n\trole=\"button\"\n\ttype=\"button\"\n\tclass=\"multipleSelect-clear clear\"\n\t(click)=\"clearValue($event)\"\n>\n\t<span class=\"u-mask\">{{intl.clear}}</span>\n</button>\n<span aria-hidden=\"true\" class=\"multipleSelect-arrow lucca-icon icon-arrowChevronBottom\"></span>\n", styles: [".multiSelect{--components-multiSelect-fontSize: var(--sizes-M-fontSize);--components-multiSelect-lineHeight: var(--sizes-M-lineHeight);--components-multiSelect-padding: var(--pr-t-spacings-100);--components-multiSelect-gap: var(--pr-t-spacings-100);--components-multiSelect-background: var(--palettes-neutral-0);--components-multiSelect-border-color: var(--palettes-neutral-300);--components-multiSelect-placeholder: var(--palettes-neutral-400);--components-multiSelect-arrow-color: var(--palettes-neutral-600);display:flex;box-shadow:0 0 0 1px var(--components-multiSelect-border-color);background-color:var(--components-multiSelect-background);border-radius:var(--commons-borderRadius-M);padding:var(--components-multiSelect-padding);align-items:flex-end;gap:var(--components-multiSelect-gap);cursor:pointer}.multiSelect:hover{--components-multiSelect-border-color: var(--palettes-neutral-400)}.multipleSelect-displayer{display:flex;gap:var(--pr-t-spacings-50);flex-wrap:wrap;flex:1}.multipleSelect-displayer-chip{min-width:0}.multipleSelect-displayer-chip-value{max-width:8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.multipleSelect-displayer-search{display:block;min-width:2rem;width:auto;flex:1;order:1;border:0;padding:0;outline:none;color:var(--palettes-neutral-800);font-size:var(--components-multiSelect-fontSize);line-height:var(--components-multiSelect-lineHeight);background-color:transparent;cursor:pointer}.multipleSelect-displayer-search::placeholder{color:var(--components-multiSelect-placeholder)}.multipleSelect-displayer-label{font-size:var(--components-multiSelect-fontSize);line-height:var(--components-multiSelect-lineHeight)}.multipleSelect-clear{margin-bottom:var(--pr-t-spacings-50)}.multipleSelect-arrow{--icon-size: 1.5rem;color:var(--components-multiSelect-arrow-color);transition-property:transform;transition-duration:var(--commons-animations-durations-standard)}.multiSelect.mod-S{--components-multiSelect-fontSize: var(--sizes-S-fontSize);--components-multiSelect-lineHeight: var(--sizes-S-lineHeight);--components-multiSelect-padding: var(--pr-t-spacings-75);--components-multiSelect-gap: var(--pr-t-spacings-75)}.multiSelect.mod-S .multipleSelect-arrow{--icon-size: 1.25rem}.multiSelect.mod-S .multipleSelect-clear.clear,.multiSelect.mod-S .multipleSelect-clear:not(.clear){--components-clear-size: .75rem;--icon-size: .75rem}.multiSelect.mod-S .multipleSelect-displayer-chip.chip,.multiSelect.mod-S .multipleSelect-displayer-chip:not(.chip){--components-chip-fontSize: var(--sizes-XS-fontSize);--components-chip-lineHeight: var(--sizes-XS-lineHeight)}.multiSelect.mod-S .multipleSelect-displayer-numericBadge.numericBadge,.multiSelect.mod-S .multipleSelect-displayer-numericBadge:not(.numericBadge){--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: 6px;--components-numericBadge-fontSize: var(--sizes-XS-fontSize);--components-numericBadge-lineHeight: var(--sizes-XS-lineHeight)}.multiSelect:has(.multipleSelect-displayer-search:focus-visible){outline:2px solid var(--palettes-product-700);outline-offset:3px}.multiSelect:has(.multipleSelect-displayer-search[aria-invalid=true]){--components-multiSelect-border-color: var(--palettes-error-400);--components-multiSelect-background: var(--palettes-error-50);--components-multiSelect-placeholder: var(--palettes-error-400)}.multiSelect:has(.multipleSelect-displayer-search:disabled){--components-multiSelect-border-color: var(--palettes-neutral-300);--components-multiSelect-background: var(--commons-disabled-background);--components-multiSelect-placeholder: var(--commons-disabled-placeholder);--components-multiSelect-arrow-color: var(--palettes-neutral-500);pointer-events:none}.multiSelect:has([aria-expanded=true]) .multipleSelect-arrow{transform:rotate(-180deg)}.multipleSelect-displayer.mod-filter{display:grid}.multipleSelect-displayer.mod-filter .multipleSelect-displayer-filter{grid-column-start:1;grid-row-start:1;display:flex;gap:var(--pr-t-spacings-50);min-width:0}.multipleSelect-displayer.mod-filter .multipleSelect-displayer-search{grid-column-start:1;grid-row-start:1}.multipleSelect-displayer.mod-filter.is-filled .multipleSelect-displayer-search{opacity:0}.multipleSelect-displayer.mod-filter:has([aria-expanded=true]):not(:has(:placeholder-shown)) .multipleSelect-displayer-filter{display:none}.multipleSelect-displayer.mod-filter:has([aria-expanded=true]):not(:has(:placeholder-shown)) .multipleSelect-displayer-search{opacity:1}.clear{--components-clear-size: 1rem;--components-clear-background: var(--palettes-neutral-700);--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' fill='none'%3E%3Cpath d='M5.80473 4.86192C5.54438 4.60157 5.12227 4.60157 4.86192 4.86192C4.60157 5.12227 4.60157 5.54438 4.86192 5.80473L7.05718 7.99999L4.86192 10.1953C4.60157 10.4556 4.60157 10.8777 4.86192 11.1381C5.12227 11.3984 5.54438 11.3984 5.80473 11.1381L7.99999 8.9428L10.1953 11.1381C10.4556 11.3984 10.8777 11.3984 11.1381 11.1381C11.3984 10.8777 11.3984 10.4556 11.1381 10.1953L8.9428 7.99999L11.1381 5.80473C11.3984 5.54438 11.3984 5.12227 11.1381 4.86192C10.8777 4.60157 10.4556 4.60157 10.1953 4.86192L7.99999 7.05718L5.80473 4.86192Z' fill='currentColor'/%3E%3C/svg%3E\");padding:0;border:0;width:100%;background-color:transparent;color:inherit;text-align:left;display:block;font:inherit;cursor:pointer;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"main\";align-items:normal;flex-shrink:0;width:var(--components-clear-size);height:var(--components-clear-size);border-radius:var(--commons-borderRadius-full)}.clear:before,.clear:after{content:\"\";grid-area:main}.clear:before{border-radius:var(--commons-borderRadius-full);background-color:var(--components-clear-background)}.clear:after{mask-image:var(--components-clear-background-image);mask-size:var(--components-clear-size);mask-repeat:no-repeat;background-color:var(--components-clear-cross-color)}.clear:hover{--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background: var(--palettes-neutral-600)}.clear:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:2px;border-radius:50%}.clear:active{--components-clear-background: var(--palettes-neutral-800)}.clear .lucca-icon{display:none}.clear.mod-S{--components-clear-size: .75rem;--icon-size: .75rem}.clear.palette-product:not([disabled]),.clear.palette-primary:not([disabled]){--components-clear-cross-color: var(--palettes-product-700);--components-clear-background: var(--palettes-neutral-0)}.clear.palette-product:not([disabled]):hover,.clear.palette-primary:not([disabled]):hover{--components-clear-background: var(--palettes-product-50)}.clear.palette-product:not([disabled]):active,.clear.palette-primary:not([disabled]):active{--components-clear-background: var(--palettes-product-50)}.clear[disabled]{--components-clear-cross-color: var(--palettes-neutral-500);--components-clear-background: var(--palettes-neutral-300);cursor:default}.chip{--components-chip-fontSize: var(--sizes-S-fontSize);--components-chip-lineHeight: var(--sizes-S-lineHeight);--components-chip-kill-size: .75rem;--components-chip-kill-background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' fill='none'%3E%3Cpath d='M5.80473 4.86192C5.54438 4.60157 5.12227 4.60157 4.86192 4.86192C4.60157 5.12227 4.60157 5.54438 4.86192 5.80473L7.05718 7.99999L4.86192 10.1953C4.60157 10.4556 4.60157 10.8777 4.86192 11.1381C5.12227 11.3984 5.54438 11.3984 5.80473 11.1381L7.99999 8.9428L10.1953 11.1381C10.4556 11.3984 10.8777 11.3984 11.1381 11.1381C11.3984 10.8777 11.3984 10.4556 11.1381 10.1953L8.9428 7.99999L11.1381 5.80473C11.3984 5.54438 11.3984 5.12227 11.1381 4.86192C10.8777 4.60157 10.4556 4.60157 10.1953 4.86192L7.99999 7.05718L5.80473 4.86192Z' fill='currentColor'/%3E%3C/svg%3E\");background-color:var(--palettes-700, var(--palettes-neutral-200));border-radius:var(--commons-borderRadius-M);color:var(--palettes-0, var(--palettes-text, var(--palettes-neutral-800)));display:inline-flex;align-items:center;gap:var(--pr-t-spacings-100);position:relative;vertical-align:middle;padding:calc(var(--pr-t-spacings-50) / 2) var(--pr-t-spacings-100);font-size:var(--components-chip-fontSize);line-height:var(--components-chip-lineHeight)}.chip-kill{padding:0;border:0;width:100%;background-color:transparent;color:inherit;text-align:left;display:block;font:inherit;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"main\";place-items:center;width:var(--pr-t-spacings-300);height:var(--pr-t-spacings-300);margin:calc(var(--pr-t-spacings-75) * -1);flex-shrink:0;cursor:pointer}.chip-kill:before,.chip-kill:after{content:\"\";grid-area:main;width:var(--components-chip-kill-size);height:var(--components-chip-kill-size)}.chip-kill:before{border-radius:var(--commons-borderRadius-full);background-color:var(--components-chip-kill-disk-color, var(--palettes-neutral-700))}.chip-kill:after{mask-image:var(--components-chip-kill-background-image);mask-size:var(--components-chip-kill-size);mask-repeat:no-repeat;background-color:var(--components-chip-kill-cross-color, var(--palettes-neutral-0))}.chip-kill:hover{--components-chip-kill-disk-color: var(--palettes-neutral-600);--components-chip-kill-cross-color: var(--palettes-700, var(--palettes-neutral-0))}.chip-kill:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:-4px;border-radius:var(--commons-borderRadius-full)}.chip-kill:active{--components-chip-kill-disk-color: var(--palettes-50, var(--palettes-neutral-800))}.chip.mod-S{--components-chip-fontSize: var(--sizes-XS-fontSize);--components-chip-lineHeight: var(--sizes-XS-lineHeight)}.chip.palette-product .chip-kill,.chip.palette-primary .chip-kill{--components-chip-kill-cross-color: var(--palettes-product-700);--components-chip-kill-disk-color: var(--palettes-neutral-0)}.chip.palette-product .chip-kill:hover,.chip.palette-primary .chip-kill:hover,.chip.palette-product .chip-kill:active,.chip.palette-primary .chip-kill:active{--components-chip-kill-disk-color: var(--palettes-product-50)}.chip.palette-product .chip-kill:focus-visible,.chip.palette-primary .chip-kill:focus-visible{outline:2px solid var(--palettes-neutral-0);outline-offset:-4px;border-radius:var(--commons-borderRadius-full)}.chip.mod-unkillable .chip-kill{display:none}.chip.mod-clickable{cursor:pointer;text-decoration:none}.chip.mod-clickable:hover{background-color:var(--palettes-600, var(--palettes-neutral-100))}.chip.is-disabled{background-color:var(--commons-disabled-background);color:var(--palettes-neutral-500)}.chip.is-disabled .chip-kill{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: LuTooltipModule }, { kind: "directive", type: _LuOptionOutletDirective, selector: "[luOptionOutlet]", inputs: ["luOptionOutlet", "luOptionOutletValue", "luOptionShowNull"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, ngImport: i0, template: "<ng-container *luOptionOutlet=\"valuesTpl(); value: value || []\"></ng-container>\n\n<button\n\t*ngIf=\"hasValue() && clearable && (disabled$ | async) === false\"\n\trole=\"button\"\n\ttype=\"button\"\n\tclass=\"multipleSelect-clear clear\"\n\t(click)=\"clearValue($event)\"\n>\n\t<span class=\"u-mask\">{{intl.clear}}</span>\n</button>\n<span aria-hidden=\"true\" class=\"multipleSelect-arrow lucca-icon icon-arrowChevronBottom\"></span>\n", styles: [".multiSelect{--components-multiSelect-fontSize: var(--sizes-M-fontSize);--components-multiSelect-lineHeight: var(--sizes-M-lineHeight);--components-multiSelect-padding: var(--pr-t-spacings-100);--components-multiSelect-gap: var(--pr-t-spacings-100);--components-multiSelect-background: var(--pr-t-color-input-background);--components-multiSelect-border-color: var(--pr-t-color-input-border);--components-multiSelect-placeholder: var(--pr-t-color-input-text-placeholder);--components-multiSelect-arrow-color: var(--pr-t-color-input-icon);display:flex;box-shadow:0 0 0 1px var(--components-multiSelect-border-color);background-color:var(--components-multiSelect-background);border-radius:var(--commons-borderRadius-M);padding:var(--components-multiSelect-padding);align-items:flex-end;gap:var(--components-multiSelect-gap);cursor:pointer}.multiSelect:hover{--components-multiSelect-border-color: var(--pr-t-color-input-border-hover)}.multipleSelect-displayer{display:flex;gap:var(--pr-t-spacings-50);flex-wrap:wrap;flex:1}.multipleSelect-displayer-chip{min-width:0}.multipleSelect-displayer-chip-value{max-width:8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.multipleSelect-displayer-search{display:block;min-width:2rem;width:auto;flex:1;order:1;border:0;padding:0;outline:none;color:var(--pr-t-color-input-text);font-size:var(--components-multiSelect-fontSize);line-height:var(--components-multiSelect-lineHeight);background-color:transparent;cursor:pointer}.multipleSelect-displayer-search::placeholder{color:var(--components-multiSelect-placeholder)}.multipleSelect-displayer-label{font-size:var(--components-multiSelect-fontSize);line-height:var(--components-multiSelect-lineHeight)}.multipleSelect-clear{margin-bottom:var(--pr-t-spacings-50)}.multipleSelect-arrow{--icon-size: 1.5rem;color:var(--components-multiSelect-arrow-color);transition-property:transform;transition-duration:var(--commons-animations-durations-standard)}.multiSelect.mod-S{--components-multiSelect-fontSize: var(--sizes-S-fontSize);--components-multiSelect-lineHeight: var(--sizes-S-lineHeight);--components-multiSelect-padding: var(--pr-t-spacings-75);--components-multiSelect-gap: var(--pr-t-spacings-75)}.multiSelect.mod-S .multipleSelect-arrow{--icon-size: 1.25rem}.multiSelect.mod-S .multipleSelect-clear.clear,.multiSelect.mod-S .multipleSelect-clear:not(.clear){--components-clear-size: .75rem;--icon-size: .75rem}.multiSelect.mod-S .multipleSelect-displayer-chip.chip,.multiSelect.mod-S .multipleSelect-displayer-chip:not(.chip){--components-chip-fontSize: var(--sizes-XS-fontSize);--components-chip-lineHeight: var(--sizes-XS-lineHeight)}.multiSelect.mod-S .multipleSelect-displayer-numericBadge.numericBadge,.multiSelect.mod-S .multipleSelect-displayer-numericBadge:not(.numericBadge){--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: 6px;--components-numericBadge-fontSize: var(--sizes-XS-fontSize);--components-numericBadge-lineHeight: var(--sizes-XS-lineHeight)}.multiSelect:has(.multipleSelect-displayer-search:focus-visible){outline:2px solid var(--palettes-product-700);outline-offset:3px}.multiSelect:has(.multipleSelect-displayer-search[aria-invalid=true]){--components-multiSelect-border-color: var(--pr-t-color-input-border-critical);--components-multiSelect-background: var(--pr-t-color-input-background-critical);--components-multiSelect-placeholder: var(--pr-t-color-input-text-placeholder-critical)}.multiSelect:has(.multipleSelect-displayer-search:disabled){--components-multiSelect-background: var(--commons-disabled-background);--components-multiSelect-placeholder: var(--commons-disabled-placeholder);--components-multiSelect-arrow-color: var(--pr-t-color-input-icon-disabled);pointer-events:none}.multiSelect:has([aria-expanded=true]) .multipleSelect-arrow{transform:rotate(-180deg)}.multipleSelect-displayer.mod-filter{display:grid}.multipleSelect-displayer.mod-filter .multipleSelect-displayer-filter{grid-column-start:1;grid-row-start:1;display:flex;gap:var(--pr-t-spacings-50);min-width:0}.multipleSelect-displayer.mod-filter .multipleSelect-displayer-search{grid-column-start:1;grid-row-start:1}.multipleSelect-displayer.mod-filter.is-filled .multipleSelect-displayer-search{opacity:0}.multipleSelect-displayer.mod-filter:has([aria-expanded=true]):not(:has(:placeholder-shown)) .multipleSelect-displayer-filter{display:none}.multipleSelect-displayer.mod-filter:has([aria-expanded=true]):not(:has(:placeholder-shown)) .multipleSelect-displayer-search{opacity:1}.clear{--components-clear-size: 1rem;--components-clear-background: var(--palettes-neutral-700);--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' fill='none'%3E%3Cpath d='M5.80473 4.86192C5.54438 4.60157 5.12227 4.60157 4.86192 4.86192C4.60157 5.12227 4.60157 5.54438 4.86192 5.80473L7.05718 7.99999L4.86192 10.1953C4.60157 10.4556 4.60157 10.8777 4.86192 11.1381C5.12227 11.3984 5.54438 11.3984 5.80473 11.1381L7.99999 8.9428L10.1953 11.1381C10.4556 11.3984 10.8777 11.3984 11.1381 11.1381C11.3984 10.8777 11.3984 10.4556 11.1381 10.1953L8.9428 7.99999L11.1381 5.80473C11.3984 5.54438 11.3984 5.12227 11.1381 4.86192C10.8777 4.60157 10.4556 4.60157 10.1953 4.86192L7.99999 7.05718L5.80473 4.86192Z' fill='currentColor'/%3E%3C/svg%3E\");padding:0;border:0;width:100%;background-color:transparent;color:inherit;text-align:left;display:block;font:inherit;cursor:pointer;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"main\";align-items:normal;flex-shrink:0;width:var(--components-clear-size);height:var(--components-clear-size);border-radius:var(--commons-borderRadius-full)}.clear:before,.clear:after{content:\"\";grid-area:main}.clear:before{border-radius:var(--commons-borderRadius-full);background-color:var(--components-clear-background)}.clear:after{mask-image:var(--components-clear-background-image);mask-size:var(--components-clear-size);mask-repeat:no-repeat;background-color:var(--components-clear-cross-color)}.clear:hover{--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background: var(--palettes-neutral-600)}.clear:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:2px;border-radius:50%}.clear:active{--components-clear-background: var(--palettes-neutral-800)}.clear .lucca-icon{display:none}.clear.mod-S{--components-clear-size: .75rem;--icon-size: .75rem}.clear.palette-product:not([disabled]),.clear.palette-primary:not([disabled]){--components-clear-cross-color: var(--palettes-product-700);--components-clear-background: var(--palettes-neutral-0)}.clear.palette-product:not([disabled]):hover,.clear.palette-primary:not([disabled]):hover{--components-clear-background: var(--palettes-product-50)}.clear.palette-product:not([disabled]):active,.clear.palette-primary:not([disabled]):active{--components-clear-background: var(--palettes-product-50)}.clear[disabled]{--components-clear-cross-color: var(--palettes-neutral-500);--components-clear-background: var(--palettes-neutral-300);cursor:default}.chip{--components-chip-fontSize: var(--sizes-S-fontSize);--components-chip-lineHeight: var(--sizes-S-lineHeight);--components-chip-kill-size: .75rem;--components-chip-kill-background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' fill='none'%3E%3Cpath d='M5.80473 4.86192C5.54438 4.60157 5.12227 4.60157 4.86192 4.86192C4.60157 5.12227 4.60157 5.54438 4.86192 5.80473L7.05718 7.99999L4.86192 10.1953C4.60157 10.4556 4.60157 10.8777 4.86192 11.1381C5.12227 11.3984 5.54438 11.3984 5.80473 11.1381L7.99999 8.9428L10.1953 11.1381C10.4556 11.3984 10.8777 11.3984 11.1381 11.1381C11.3984 10.8777 11.3984 10.4556 11.1381 10.1953L8.9428 7.99999L11.1381 5.80473C11.3984 5.54438 11.3984 5.12227 11.1381 4.86192C10.8777 4.60157 10.4556 4.60157 10.1953 4.86192L7.99999 7.05718L5.80473 4.86192Z' fill='currentColor'/%3E%3C/svg%3E\");background-color:var(--palettes-700, var(--palettes-neutral-200));border-radius:var(--commons-borderRadius-M);color:var(--palettes-0, var(--palettes-text, var(--palettes-neutral-800)));display:inline-flex;align-items:center;gap:var(--pr-t-spacings-100);position:relative;vertical-align:middle;padding:calc(var(--pr-t-spacings-50) / 2) var(--pr-t-spacings-100);font-size:var(--components-chip-fontSize);line-height:var(--components-chip-lineHeight)}.chip-kill{padding:0;border:0;width:100%;background-color:transparent;color:inherit;text-align:left;display:block;font:inherit;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"main\";place-items:center;width:var(--pr-t-spacings-300);height:var(--pr-t-spacings-300);margin:calc(var(--pr-t-spacings-75) * -1);flex-shrink:0;cursor:pointer}.chip-kill:before,.chip-kill:after{content:\"\";grid-area:main;width:var(--components-chip-kill-size);height:var(--components-chip-kill-size)}.chip-kill:before{border-radius:var(--commons-borderRadius-full);background-color:var(--components-chip-kill-disk-color, var(--palettes-neutral-700))}.chip-kill:after{mask-image:var(--components-chip-kill-background-image);mask-size:var(--components-chip-kill-size);mask-repeat:no-repeat;background-color:var(--components-chip-kill-cross-color, var(--palettes-neutral-0))}.chip-kill:hover{--components-chip-kill-disk-color: var(--palettes-neutral-600);--components-chip-kill-cross-color: var(--palettes-700, var(--palettes-neutral-0))}.chip-kill:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:-4px;border-radius:var(--commons-borderRadius-full)}.chip-kill:active{--components-chip-kill-disk-color: var(--palettes-50, var(--palettes-neutral-800))}.chip.mod-S{--components-chip-fontSize: var(--sizes-XS-fontSize);--components-chip-lineHeight: var(--sizes-XS-lineHeight)}.chip.palette-product .chip-kill,.chip.palette-primary .chip-kill{--components-chip-kill-cross-color: var(--palettes-product-700);--components-chip-kill-disk-color: var(--palettes-neutral-0)}.chip.palette-product .chip-kill:hover,.chip.palette-primary .chip-kill:hover,.chip.palette-product .chip-kill:active,.chip.palette-primary .chip-kill:active{--components-chip-kill-disk-color: var(--palettes-product-50)}.chip.palette-product .chip-kill:focus-visible,.chip.palette-primary .chip-kill:focus-visible{outline:2px solid var(--palettes-neutral-0);outline-offset:-4px;border-radius:var(--commons-borderRadius-full)}.chip.mod-unkillable .chip-kill{display:none}.chip.mod-clickable{cursor:pointer;text-decoration:none}.chip.mod-clickable:hover{background-color:var(--palettes-600, var(--palettes-neutral-100))}.chip.is-disabled{background-color:var(--commons-disabled-background);color:var(--palettes-neutral-500)}.chip.is-disabled .chip-kill{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: LuTooltipModule }, { kind: "directive", type: _LuOptionOutletDirective, selector: "[luOptionOutlet]", inputs: ["luOptionOutlet", "luOptionOutletValue", "luOptionShowNull"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: LuMultiSelectInputComponent, decorators: [{
             type: Component,
@@ -510,7 +510,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
                         LuMultiSelectPanelRefFactory,
                     ], host: {
                         class: 'multiSelect',
-                    }, encapsulation: ViewEncapsulation.None, template: "<ng-container *luOptionOutlet=\"valuesTpl(); value: value || []\"></ng-container>\n\n<button\n\t*ngIf=\"hasValue() && clearable && (disabled$ | async) === false\"\n\trole=\"button\"\n\ttype=\"button\"\n\tclass=\"multipleSelect-clear clear\"\n\t(click)=\"clearValue($event)\"\n>\n\t<span class=\"u-mask\">{{intl.clear}}</span>\n</button>\n<span aria-hidden=\"true\" class=\"multipleSelect-arrow lucca-icon icon-arrowChevronBottom\"></span>\n", styles: [".multiSelect{--components-multiSelect-fontSize: var(--sizes-M-fontSize);--components-multiSelect-lineHeight: var(--sizes-M-lineHeight);--components-multiSelect-padding: var(--pr-t-spacings-100);--components-multiSelect-gap: var(--pr-t-spacings-100);--components-multiSelect-background: var(--palettes-neutral-0);--components-multiSelect-border-color: var(--palettes-neutral-300);--components-multiSelect-placeholder: var(--palettes-neutral-400);--components-multiSelect-arrow-color: var(--palettes-neutral-600);display:flex;box-shadow:0 0 0 1px var(--components-multiSelect-border-color);background-color:var(--components-multiSelect-background);border-radius:var(--commons-borderRadius-M);padding:var(--components-multiSelect-padding);align-items:flex-end;gap:var(--components-multiSelect-gap);cursor:pointer}.multiSelect:hover{--components-multiSelect-border-color: var(--palettes-neutral-400)}.multipleSelect-displayer{display:flex;gap:var(--pr-t-spacings-50);flex-wrap:wrap;flex:1}.multipleSelect-displayer-chip{min-width:0}.multipleSelect-displayer-chip-value{max-width:8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.multipleSelect-displayer-search{display:block;min-width:2rem;width:auto;flex:1;order:1;border:0;padding:0;outline:none;color:var(--palettes-neutral-800);font-size:var(--components-multiSelect-fontSize);line-height:var(--components-multiSelect-lineHeight);background-color:transparent;cursor:pointer}.multipleSelect-displayer-search::placeholder{color:var(--components-multiSelect-placeholder)}.multipleSelect-displayer-label{font-size:var(--components-multiSelect-fontSize);line-height:var(--components-multiSelect-lineHeight)}.multipleSelect-clear{margin-bottom:var(--pr-t-spacings-50)}.multipleSelect-arrow{--icon-size: 1.5rem;color:var(--components-multiSelect-arrow-color);transition-property:transform;transition-duration:var(--commons-animations-durations-standard)}.multiSelect.mod-S{--components-multiSelect-fontSize: var(--sizes-S-fontSize);--components-multiSelect-lineHeight: var(--sizes-S-lineHeight);--components-multiSelect-padding: var(--pr-t-spacings-75);--components-multiSelect-gap: var(--pr-t-spacings-75)}.multiSelect.mod-S .multipleSelect-arrow{--icon-size: 1.25rem}.multiSelect.mod-S .multipleSelect-clear.clear,.multiSelect.mod-S .multipleSelect-clear:not(.clear){--components-clear-size: .75rem;--icon-size: .75rem}.multiSelect.mod-S .multipleSelect-displayer-chip.chip,.multiSelect.mod-S .multipleSelect-displayer-chip:not(.chip){--components-chip-fontSize: var(--sizes-XS-fontSize);--components-chip-lineHeight: var(--sizes-XS-lineHeight)}.multiSelect.mod-S .multipleSelect-displayer-numericBadge.numericBadge,.multiSelect.mod-S .multipleSelect-displayer-numericBadge:not(.numericBadge){--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: 6px;--components-numericBadge-fontSize: var(--sizes-XS-fontSize);--components-numericBadge-lineHeight: var(--sizes-XS-lineHeight)}.multiSelect:has(.multipleSelect-displayer-search:focus-visible){outline:2px solid var(--palettes-product-700);outline-offset:3px}.multiSelect:has(.multipleSelect-displayer-search[aria-invalid=true]){--components-multiSelect-border-color: var(--palettes-error-400);--components-multiSelect-background: var(--palettes-error-50);--components-multiSelect-placeholder: var(--palettes-error-400)}.multiSelect:has(.multipleSelect-displayer-search:disabled){--components-multiSelect-border-color: var(--palettes-neutral-300);--components-multiSelect-background: var(--commons-disabled-background);--components-multiSelect-placeholder: var(--commons-disabled-placeholder);--components-multiSelect-arrow-color: var(--palettes-neutral-500);pointer-events:none}.multiSelect:has([aria-expanded=true]) .multipleSelect-arrow{transform:rotate(-180deg)}.multipleSelect-displayer.mod-filter{display:grid}.multipleSelect-displayer.mod-filter .multipleSelect-displayer-filter{grid-column-start:1;grid-row-start:1;display:flex;gap:var(--pr-t-spacings-50);min-width:0}.multipleSelect-displayer.mod-filter .multipleSelect-displayer-search{grid-column-start:1;grid-row-start:1}.multipleSelect-displayer.mod-filter.is-filled .multipleSelect-displayer-search{opacity:0}.multipleSelect-displayer.mod-filter:has([aria-expanded=true]):not(:has(:placeholder-shown)) .multipleSelect-displayer-filter{display:none}.multipleSelect-displayer.mod-filter:has([aria-expanded=true]):not(:has(:placeholder-shown)) .multipleSelect-displayer-search{opacity:1}.clear{--components-clear-size: 1rem;--components-clear-background: var(--palettes-neutral-700);--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' fill='none'%3E%3Cpath d='M5.80473 4.86192C5.54438 4.60157 5.12227 4.60157 4.86192 4.86192C4.60157 5.12227 4.60157 5.54438 4.86192 5.80473L7.05718 7.99999L4.86192 10.1953C4.60157 10.4556 4.60157 10.8777 4.86192 11.1381C5.12227 11.3984 5.54438 11.3984 5.80473 11.1381L7.99999 8.9428L10.1953 11.1381C10.4556 11.3984 10.8777 11.3984 11.1381 11.1381C11.3984 10.8777 11.3984 10.4556 11.1381 10.1953L8.9428 7.99999L11.1381 5.80473C11.3984 5.54438 11.3984 5.12227 11.1381 4.86192C10.8777 4.60157 10.4556 4.60157 10.1953 4.86192L7.99999 7.05718L5.80473 4.86192Z' fill='currentColor'/%3E%3C/svg%3E\");padding:0;border:0;width:100%;background-color:transparent;color:inherit;text-align:left;display:block;font:inherit;cursor:pointer;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"main\";align-items:normal;flex-shrink:0;width:var(--components-clear-size);height:var(--components-clear-size);border-radius:var(--commons-borderRadius-full)}.clear:before,.clear:after{content:\"\";grid-area:main}.clear:before{border-radius:var(--commons-borderRadius-full);background-color:var(--components-clear-background)}.clear:after{mask-image:var(--components-clear-background-image);mask-size:var(--components-clear-size);mask-repeat:no-repeat;background-color:var(--components-clear-cross-color)}.clear:hover{--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background: var(--palettes-neutral-600)}.clear:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:2px;border-radius:50%}.clear:active{--components-clear-background: var(--palettes-neutral-800)}.clear .lucca-icon{display:none}.clear.mod-S{--components-clear-size: .75rem;--icon-size: .75rem}.clear.palette-product:not([disabled]),.clear.palette-primary:not([disabled]){--components-clear-cross-color: var(--palettes-product-700);--components-clear-background: var(--palettes-neutral-0)}.clear.palette-product:not([disabled]):hover,.clear.palette-primary:not([disabled]):hover{--components-clear-background: var(--palettes-product-50)}.clear.palette-product:not([disabled]):active,.clear.palette-primary:not([disabled]):active{--components-clear-background: var(--palettes-product-50)}.clear[disabled]{--components-clear-cross-color: var(--palettes-neutral-500);--components-clear-background: var(--palettes-neutral-300);cursor:default}.chip{--components-chip-fontSize: var(--sizes-S-fontSize);--components-chip-lineHeight: var(--sizes-S-lineHeight);--components-chip-kill-size: .75rem;--components-chip-kill-background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' fill='none'%3E%3Cpath d='M5.80473 4.86192C5.54438 4.60157 5.12227 4.60157 4.86192 4.86192C4.60157 5.12227 4.60157 5.54438 4.86192 5.80473L7.05718 7.99999L4.86192 10.1953C4.60157 10.4556 4.60157 10.8777 4.86192 11.1381C5.12227 11.3984 5.54438 11.3984 5.80473 11.1381L7.99999 8.9428L10.1953 11.1381C10.4556 11.3984 10.8777 11.3984 11.1381 11.1381C11.3984 10.8777 11.3984 10.4556 11.1381 10.1953L8.9428 7.99999L11.1381 5.80473C11.3984 5.54438 11.3984 5.12227 11.1381 4.86192C10.8777 4.60157 10.4556 4.60157 10.1953 4.86192L7.99999 7.05718L5.80473 4.86192Z' fill='currentColor'/%3E%3C/svg%3E\");background-color:var(--palettes-700, var(--palettes-neutral-200));border-radius:var(--commons-borderRadius-M);color:var(--palettes-0, var(--palettes-text, var(--palettes-neutral-800)));display:inline-flex;align-items:center;gap:var(--pr-t-spacings-100);position:relative;vertical-align:middle;padding:calc(var(--pr-t-spacings-50) / 2) var(--pr-t-spacings-100);font-size:var(--components-chip-fontSize);line-height:var(--components-chip-lineHeight)}.chip-kill{padding:0;border:0;width:100%;background-color:transparent;color:inherit;text-align:left;display:block;font:inherit;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"main\";place-items:center;width:var(--pr-t-spacings-300);height:var(--pr-t-spacings-300);margin:calc(var(--pr-t-spacings-75) * -1);flex-shrink:0;cursor:pointer}.chip-kill:before,.chip-kill:after{content:\"\";grid-area:main;width:var(--components-chip-kill-size);height:var(--components-chip-kill-size)}.chip-kill:before{border-radius:var(--commons-borderRadius-full);background-color:var(--components-chip-kill-disk-color, var(--palettes-neutral-700))}.chip-kill:after{mask-image:var(--components-chip-kill-background-image);mask-size:var(--components-chip-kill-size);mask-repeat:no-repeat;background-color:var(--components-chip-kill-cross-color, var(--palettes-neutral-0))}.chip-kill:hover{--components-chip-kill-disk-color: var(--palettes-neutral-600);--components-chip-kill-cross-color: var(--palettes-700, var(--palettes-neutral-0))}.chip-kill:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:-4px;border-radius:var(--commons-borderRadius-full)}.chip-kill:active{--components-chip-kill-disk-color: var(--palettes-50, var(--palettes-neutral-800))}.chip.mod-S{--components-chip-fontSize: var(--sizes-XS-fontSize);--components-chip-lineHeight: var(--sizes-XS-lineHeight)}.chip.palette-product .chip-kill,.chip.palette-primary .chip-kill{--components-chip-kill-cross-color: var(--palettes-product-700);--components-chip-kill-disk-color: var(--palettes-neutral-0)}.chip.palette-product .chip-kill:hover,.chip.palette-primary .chip-kill:hover,.chip.palette-product .chip-kill:active,.chip.palette-primary .chip-kill:active{--components-chip-kill-disk-color: var(--palettes-product-50)}.chip.palette-product .chip-kill:focus-visible,.chip.palette-primary .chip-kill:focus-visible{outline:2px solid var(--palettes-neutral-0);outline-offset:-4px;border-radius:var(--commons-borderRadius-full)}.chip.mod-unkillable .chip-kill{display:none}.chip.mod-clickable{cursor:pointer;text-decoration:none}.chip.mod-clickable:hover{background-color:var(--palettes-600, var(--palettes-neutral-100))}.chip.is-disabled{background-color:var(--commons-disabled-background);color:var(--palettes-neutral-500)}.chip.is-disabled .chip-kill{display:none}\n"] }]
+                    }, encapsulation: ViewEncapsulation.None, template: "<ng-container *luOptionOutlet=\"valuesTpl(); value: value || []\"></ng-container>\n\n<button\n\t*ngIf=\"hasValue() && clearable && (disabled$ | async) === false\"\n\trole=\"button\"\n\ttype=\"button\"\n\tclass=\"multipleSelect-clear clear\"\n\t(click)=\"clearValue($event)\"\n>\n\t<span class=\"u-mask\">{{intl.clear}}</span>\n</button>\n<span aria-hidden=\"true\" class=\"multipleSelect-arrow lucca-icon icon-arrowChevronBottom\"></span>\n", styles: [".multiSelect{--components-multiSelect-fontSize: var(--sizes-M-fontSize);--components-multiSelect-lineHeight: var(--sizes-M-lineHeight);--components-multiSelect-padding: var(--pr-t-spacings-100);--components-multiSelect-gap: var(--pr-t-spacings-100);--components-multiSelect-background: var(--pr-t-color-input-background);--components-multiSelect-border-color: var(--pr-t-color-input-border);--components-multiSelect-placeholder: var(--pr-t-color-input-text-placeholder);--components-multiSelect-arrow-color: var(--pr-t-color-input-icon);display:flex;box-shadow:0 0 0 1px var(--components-multiSelect-border-color);background-color:var(--components-multiSelect-background);border-radius:var(--commons-borderRadius-M);padding:var(--components-multiSelect-padding);align-items:flex-end;gap:var(--components-multiSelect-gap);cursor:pointer}.multiSelect:hover{--components-multiSelect-border-color: var(--pr-t-color-input-border-hover)}.multipleSelect-displayer{display:flex;gap:var(--pr-t-spacings-50);flex-wrap:wrap;flex:1}.multipleSelect-displayer-chip{min-width:0}.multipleSelect-displayer-chip-value{max-width:8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.multipleSelect-displayer-search{display:block;min-width:2rem;width:auto;flex:1;order:1;border:0;padding:0;outline:none;color:var(--pr-t-color-input-text);font-size:var(--components-multiSelect-fontSize);line-height:var(--components-multiSelect-lineHeight);background-color:transparent;cursor:pointer}.multipleSelect-displayer-search::placeholder{color:var(--components-multiSelect-placeholder)}.multipleSelect-displayer-label{font-size:var(--components-multiSelect-fontSize);line-height:var(--components-multiSelect-lineHeight)}.multipleSelect-clear{margin-bottom:var(--pr-t-spacings-50)}.multipleSelect-arrow{--icon-size: 1.5rem;color:var(--components-multiSelect-arrow-color);transition-property:transform;transition-duration:var(--commons-animations-durations-standard)}.multiSelect.mod-S{--components-multiSelect-fontSize: var(--sizes-S-fontSize);--components-multiSelect-lineHeight: var(--sizes-S-lineHeight);--components-multiSelect-padding: var(--pr-t-spacings-75);--components-multiSelect-gap: var(--pr-t-spacings-75)}.multiSelect.mod-S .multipleSelect-arrow{--icon-size: 1.25rem}.multiSelect.mod-S .multipleSelect-clear.clear,.multiSelect.mod-S .multipleSelect-clear:not(.clear){--components-clear-size: .75rem;--icon-size: .75rem}.multiSelect.mod-S .multipleSelect-displayer-chip.chip,.multiSelect.mod-S .multipleSelect-displayer-chip:not(.chip){--components-chip-fontSize: var(--sizes-XS-fontSize);--components-chip-lineHeight: var(--sizes-XS-lineHeight)}.multiSelect.mod-S .multipleSelect-displayer-numericBadge.numericBadge,.multiSelect.mod-S .multipleSelect-displayer-numericBadge:not(.numericBadge){--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: 6px;--components-numericBadge-fontSize: var(--sizes-XS-fontSize);--components-numericBadge-lineHeight: var(--sizes-XS-lineHeight)}.multiSelect:has(.multipleSelect-displayer-search:focus-visible){outline:2px solid var(--palettes-product-700);outline-offset:3px}.multiSelect:has(.multipleSelect-displayer-search[aria-invalid=true]){--components-multiSelect-border-color: var(--pr-t-color-input-border-critical);--components-multiSelect-background: var(--pr-t-color-input-background-critical);--components-multiSelect-placeholder: var(--pr-t-color-input-text-placeholder-critical)}.multiSelect:has(.multipleSelect-displayer-search:disabled){--components-multiSelect-background: var(--commons-disabled-background);--components-multiSelect-placeholder: var(--commons-disabled-placeholder);--components-multiSelect-arrow-color: var(--pr-t-color-input-icon-disabled);pointer-events:none}.multiSelect:has([aria-expanded=true]) .multipleSelect-arrow{transform:rotate(-180deg)}.multipleSelect-displayer.mod-filter{display:grid}.multipleSelect-displayer.mod-filter .multipleSelect-displayer-filter{grid-column-start:1;grid-row-start:1;display:flex;gap:var(--pr-t-spacings-50);min-width:0}.multipleSelect-displayer.mod-filter .multipleSelect-displayer-search{grid-column-start:1;grid-row-start:1}.multipleSelect-displayer.mod-filter.is-filled .multipleSelect-displayer-search{opacity:0}.multipleSelect-displayer.mod-filter:has([aria-expanded=true]):not(:has(:placeholder-shown)) .multipleSelect-displayer-filter{display:none}.multipleSelect-displayer.mod-filter:has([aria-expanded=true]):not(:has(:placeholder-shown)) .multipleSelect-displayer-search{opacity:1}.clear{--components-clear-size: 1rem;--components-clear-background: var(--palettes-neutral-700);--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' fill='none'%3E%3Cpath d='M5.80473 4.86192C5.54438 4.60157 5.12227 4.60157 4.86192 4.86192C4.60157 5.12227 4.60157 5.54438 4.86192 5.80473L7.05718 7.99999L4.86192 10.1953C4.60157 10.4556 4.60157 10.8777 4.86192 11.1381C5.12227 11.3984 5.54438 11.3984 5.80473 11.1381L7.99999 8.9428L10.1953 11.1381C10.4556 11.3984 10.8777 11.3984 11.1381 11.1381C11.3984 10.8777 11.3984 10.4556 11.1381 10.1953L8.9428 7.99999L11.1381 5.80473C11.3984 5.54438 11.3984 5.12227 11.1381 4.86192C10.8777 4.60157 10.4556 4.60157 10.1953 4.86192L7.99999 7.05718L5.80473 4.86192Z' fill='currentColor'/%3E%3C/svg%3E\");padding:0;border:0;width:100%;background-color:transparent;color:inherit;text-align:left;display:block;font:inherit;cursor:pointer;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"main\";align-items:normal;flex-shrink:0;width:var(--components-clear-size);height:var(--components-clear-size);border-radius:var(--commons-borderRadius-full)}.clear:before,.clear:after{content:\"\";grid-area:main}.clear:before{border-radius:var(--commons-borderRadius-full);background-color:var(--components-clear-background)}.clear:after{mask-image:var(--components-clear-background-image);mask-size:var(--components-clear-size);mask-repeat:no-repeat;background-color:var(--components-clear-cross-color)}.clear:hover{--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background: var(--palettes-neutral-600)}.clear:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:2px;border-radius:50%}.clear:active{--components-clear-background: var(--palettes-neutral-800)}.clear .lucca-icon{display:none}.clear.mod-S{--components-clear-size: .75rem;--icon-size: .75rem}.clear.palette-product:not([disabled]),.clear.palette-primary:not([disabled]){--components-clear-cross-color: var(--palettes-product-700);--components-clear-background: var(--palettes-neutral-0)}.clear.palette-product:not([disabled]):hover,.clear.palette-primary:not([disabled]):hover{--components-clear-background: var(--palettes-product-50)}.clear.palette-product:not([disabled]):active,.clear.palette-primary:not([disabled]):active{--components-clear-background: var(--palettes-product-50)}.clear[disabled]{--components-clear-cross-color: var(--palettes-neutral-500);--components-clear-background: var(--palettes-neutral-300);cursor:default}.chip{--components-chip-fontSize: var(--sizes-S-fontSize);--components-chip-lineHeight: var(--sizes-S-lineHeight);--components-chip-kill-size: .75rem;--components-chip-kill-background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' fill='none'%3E%3Cpath d='M5.80473 4.86192C5.54438 4.60157 5.12227 4.60157 4.86192 4.86192C4.60157 5.12227 4.60157 5.54438 4.86192 5.80473L7.05718 7.99999L4.86192 10.1953C4.60157 10.4556 4.60157 10.8777 4.86192 11.1381C5.12227 11.3984 5.54438 11.3984 5.80473 11.1381L7.99999 8.9428L10.1953 11.1381C10.4556 11.3984 10.8777 11.3984 11.1381 11.1381C11.3984 10.8777 11.3984 10.4556 11.1381 10.1953L8.9428 7.99999L11.1381 5.80473C11.3984 5.54438 11.3984 5.12227 11.1381 4.86192C10.8777 4.60157 10.4556 4.60157 10.1953 4.86192L7.99999 7.05718L5.80473 4.86192Z' fill='currentColor'/%3E%3C/svg%3E\");background-color:var(--palettes-700, var(--palettes-neutral-200));border-radius:var(--commons-borderRadius-M);color:var(--palettes-0, var(--palettes-text, var(--palettes-neutral-800)));display:inline-flex;align-items:center;gap:var(--pr-t-spacings-100);position:relative;vertical-align:middle;padding:calc(var(--pr-t-spacings-50) / 2) var(--pr-t-spacings-100);font-size:var(--components-chip-fontSize);line-height:var(--components-chip-lineHeight)}.chip-kill{padding:0;border:0;width:100%;background-color:transparent;color:inherit;text-align:left;display:block;font:inherit;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"main\";place-items:center;width:var(--pr-t-spacings-300);height:var(--pr-t-spacings-300);margin:calc(var(--pr-t-spacings-75) * -1);flex-shrink:0;cursor:pointer}.chip-kill:before,.chip-kill:after{content:\"\";grid-area:main;width:var(--components-chip-kill-size);height:var(--components-chip-kill-size)}.chip-kill:before{border-radius:var(--commons-borderRadius-full);background-color:var(--components-chip-kill-disk-color, var(--palettes-neutral-700))}.chip-kill:after{mask-image:var(--components-chip-kill-background-image);mask-size:var(--components-chip-kill-size);mask-repeat:no-repeat;background-color:var(--components-chip-kill-cross-color, var(--palettes-neutral-0))}.chip-kill:hover{--components-chip-kill-disk-color: var(--palettes-neutral-600);--components-chip-kill-cross-color: var(--palettes-700, var(--palettes-neutral-0))}.chip-kill:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:-4px;border-radius:var(--commons-borderRadius-full)}.chip-kill:active{--components-chip-kill-disk-color: var(--palettes-50, var(--palettes-neutral-800))}.chip.mod-S{--components-chip-fontSize: var(--sizes-XS-fontSize);--components-chip-lineHeight: var(--sizes-XS-lineHeight)}.chip.palette-product .chip-kill,.chip.palette-primary .chip-kill{--components-chip-kill-cross-color: var(--palettes-product-700);--components-chip-kill-disk-color: var(--palettes-neutral-0)}.chip.palette-product .chip-kill:hover,.chip.palette-primary .chip-kill:hover,.chip.palette-product .chip-kill:active,.chip.palette-primary .chip-kill:active{--components-chip-kill-disk-color: var(--palettes-product-50)}.chip.palette-product .chip-kill:focus-visible,.chip.palette-primary .chip-kill:focus-visible{outline:2px solid var(--palettes-neutral-0);outline-offset:-4px;border-radius:var(--commons-borderRadius-full)}.chip.mod-unkillable .chip-kill{display:none}.chip.mod-clickable{cursor:pointer;text-decoration:none}.chip.mod-clickable:hover{background-color:var(--palettes-600, var(--palettes-neutral-100))}.chip.is-disabled{background-color:var(--commons-disabled-background);color:var(--palettes-neutral-500)}.chip.is-disabled .chip-kill{display:none}\n"] }]
         }], propDecorators: { maxValuesShown: [{
                 type: Input,
                 args: [{ transform: numberAttribute }]
@@ -727,7 +727,7 @@ class LuMultiSelectAllDisplayerComponent {
 				</div>
 			}
 		</div>
-	`, isInline: true, styles: [":host{display:block;width:100%}\n"], dependencies: [{ kind: "component", type: NumericBadgeComponent, selector: "lu-numeric-badge", inputs: ["value", "size", "palette"] }, { kind: "directive", type: LuMultiSelectDisplayerInputDirective, selector: "[luMultiSelectDisplayerInput]" }, { kind: "directive", type: _LuOptionOutletDirective, selector: "[luOptionOutlet]", inputs: ["luOptionOutlet", "luOptionOutletValue", "luOptionShowNull"] }] }); }
+	`, isInline: true, styles: [":host{display:block;width:100%}\n"], dependencies: [{ kind: "component", type: NumericBadgeComponent, selector: "lu-numeric-badge", inputs: ["value", "size", "loading", "palette"] }, { kind: "directive", type: LuMultiSelectDisplayerInputDirective, selector: "[luMultiSelectDisplayerInput]" }, { kind: "directive", type: _LuOptionOutletDirective, selector: "[luOptionOutlet]", inputs: ["luOptionOutlet", "luOptionOutletValue", "luOptionShowNull"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: LuMultiSelectAllDisplayerComponent, decorators: [{
             type: Component,
@@ -771,7 +771,7 @@ class LuMultiSelectAllHeaderComponent {
 				<lu-checkbox-input class="multiSelectAllDisplayer-checkbox" [ngModel]="isSelected()" (ngModelChange)="selectAllContext.setSelectAll($event)" [mixed]="mixed()" />
 			</lu-form-field>
 		</div>
-	`, isInline: true, styles: [":host{display:block;background-color:var(--palettes-neutral-0);border-block-end:1px solid var(--commons-border-200);padding:0 var(--pr-t-spacings-50) var(--components-options-item-padding-vertical);margin:0 calc(-1 * var(--pr-t-spacings-50)) var(--components-options-item-padding-vertical)}.multiSelectAllDisplayer{border-radius:var(--commons-borderRadius-M);cursor:pointer}.multiSelectAllDisplayer:hover{background-color:var(--palettes-neutral-50)}.multiSelectAllDisplayer:has(.checkboxField-input:checked){background-color:var(--palettes-product-50)}.multiSelectAllDisplayer:has(.checkboxField-input:checked):hover{background-color:var(--palettes-product-100)}.multiSelectAllDisplayer ::ng-deep .formLabel{width:100%;padding:var(--components-options-item-padding-vertical) 0}.multiSelectAllDisplayer-checkbox{margin:var(--components-options-item-padding-vertical) 0 0 var(--components-options-item-padding-horizontal)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CheckboxInputComponent, selector: "lu-checkbox-input", inputs: ["mixed"] }, { kind: "component", type: FormFieldComponent, selector: "lu-form-field", inputs: ["label", "hiddenLabel", "rolePresentationLabel", "inline", "statusControl", "tooltip", "invalid", "inlineMessage", "errorInlineMessage", "inlineMessageState", "size", "layout", "counter"] }] }); }
+	`, isInline: true, styles: [":host{display:block;background-color:var(--palettes-neutral-0);border-block-end:1px solid var(--commons-border-200);padding:0 var(--pr-t-spacings-50) var(--components-options-item-padding-vertical);margin:0 calc(-1 * var(--pr-t-spacings-50)) var(--components-options-item-padding-vertical)}.multiSelectAllDisplayer{border-radius:var(--commons-borderRadius-M);cursor:pointer}.multiSelectAllDisplayer:hover{background-color:var(--palettes-neutral-50)}.multiSelectAllDisplayer:has(.checkboxField-input:checked){background-color:var(--palettes-product-50)}.multiSelectAllDisplayer:has(.checkboxField-input:checked):hover{background-color:var(--palettes-product-100)}.multiSelectAllDisplayer ::ng-deep .formLabel{width:100%;padding:var(--components-options-item-padding-vertical) 0}.multiSelectAllDisplayer-checkbox{margin:var(--components-options-item-padding-vertical) 0 0 var(--components-options-item-padding-horizontal)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CheckboxInputComponent, selector: "lu-checkbox-input", inputs: ["mixed"] }, { kind: "component", type: FormFieldComponent, selector: "lu-form-field", inputs: ["label", "hiddenLabel", "rolePresentationLabel", "inline", "statusControl", "tooltip", "invalid", "inlineMessage", "errorInlineMessage", "inlineMessageState", "size", "layout", "counter"], outputs: ["rolePresentationLabelChange", "layoutChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: LuMultiSelectAllHeaderComponent, decorators: [{
             type: Component,
@@ -1142,9 +1142,19 @@ function selectionToOptions(selection, options, getKeyFn) {
     }
 }
 
+const required = (control) => {
+    if (!control.value || control.value.mode === 'none') {
+        return { required: true };
+    }
+    return null;
+};
+const LuMultiSelectionValidators = {
+    required,
+};
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { LU_MULTI_SELECT_DISPLAYER_TRANSLATIONS, LU_MULTI_SELECT_TRANSLATIONS, LuMultiDisplayerDirective, LuMultiSelectCounterDisplayerComponent, LuMultiSelectDefaultDisplayerComponent, LuMultiSelectDisplayerInputDirective, LuMultiSelectInputComponent, LuMultiSelectWithSelectAllDirective, luMultiSelectDisplayerTranslations, luMultiSelectTranslations, selectionToOptions, selectionToQueryParams };
+export { LU_MULTI_SELECT_DISPLAYER_TRANSLATIONS, LU_MULTI_SELECT_TRANSLATIONS, LuMultiDisplayerDirective, LuMultiSelectCounterDisplayerComponent, LuMultiSelectDefaultDisplayerComponent, LuMultiSelectDisplayerInputDirective, LuMultiSelectInputComponent, LuMultiSelectWithSelectAllDirective, LuMultiSelectionValidators, luMultiSelectDisplayerTranslations, luMultiSelectTranslations, selectionToOptions, selectionToQueryParams };
 //# sourceMappingURL=lucca-front-ng-multi-select.mjs.map