@lucca-front/ng 21.0.0-rc.1 → 21.0.0-rc.2

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

@@ -245,7 +245,7 @@ class TextInputComponent {
         this.showPassword.set(!_showPassword);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: TextInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: TextInputComponent, isStandalone: true, selector: "lu-text-input", inputs: { mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: false, isRequired: false, transformFunction: null }, hasClearer: { classPropertyName: "hasClearer", publicName: "hasClearer", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, hasSearchIcon: { classPropertyName: "hasSearchIcon", publicName: "hasSearchIcon", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, valueAlignRight: { classPropertyName: "valueAlignRight", publicName: "valueAlignRight", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: false, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, searchIcon: { classPropertyName: "searchIcon", publicName: "searchIcon", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { blur: "blur" }, providers: [provideNgxMask()], viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, static: true }], hostDirectives: [{ directive: NoopValueAccessorDirective }], ngImport: i0, template: "<div class=\"textField\" [class.mod-valueAlignRight]=\"valueAlignRight\">\n\t<ng-template #textfieldAddon let-addon=\"addon\" let-type=\"type\">\n\t\t@if (addon.content) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" aria-hidden=\"true\">{{ addon.content }}</span>\n\t\t\t\t<span class=\"pr-u-mask\">{{ addon.ariaLabel }}</span>\n\t\t\t</span>\n\t\t}\n\t\t@if (addon.icon) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\"\n\t\t\t\t\t><span class=\"lucca-icon icon-{{ addon.icon }}\"></span\n\t\t\t\t></span>\n\t\t\t</span>\n\t\t}\n\t</ng-template>\n\n\t@if (prefix) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\ttextfieldAddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'prefix',\n\t\t\t\t\taddon: prefix,\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\n\t<div class=\"textField-input\">\n\t\t<input\n\t\t\tluInput\n\t\t\t[type]=\"type\"\n\t\t\t[attr.autocomplete]=\"autocomplete ? autocomplete : null\"\n\t\t\tclass=\"textField-input-value\"\n\t\t\t[placeholder]=\"placeholder\"\n\t\t\t[formControl]=\"ngControl.control\"\n\t\t\t(blur)=\"blur.emit($event)\"\n\t\t\t[mask]=\"mask()\"\n\t\t\t#inputElement\n\t\t/>\n\t\t<div class=\"textField-input-affix\">\n\t\t\t@if (hasClearer && inputElement.value) {\n\t\t\t\t<lu-clear (click)=\"clearValue()\" class=\"textField-input-affix-clear\">{{ intl.clear }}</lu-clear>\n\t\t\t}\n\t\t\t@if (hasSearchIcon) {\n\t\t\t\t<span aria-hidden=\"true\" class=\"textField-input-affix-icon lucca-icon icon-{{ searchIcon }}\"></span>\n\t\t\t}\n\t\t\t@if (hasTogglePasswordVisibilityIcon()) {\n\t\t\t\t<button\n\t\t\t\t\t[attr.aria-pressed]=\"showPassword()\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclass=\"button mod-onlyIcon mod-ghost textField-input-affix-toggle\"\n\t\t\t\t\t(click)=\"togglePasswordVisibility()\"\n\t\t\t\t>\n\t\t\t\t\t<span aria-hidden=\"true\" [class]=\"`lucca-icon icon-${ showPassword() ? 'unwatch' : 'watch' }`\"></span>\n\t\t\t\t\t<span class=\"pr-u-mask\">{{ intl.togglePasswordVisibility }}</span>\n\t\t\t\t</button>\n\t\t\t}\n\t\t</div>\n\t</div>\n\t@if (suffix) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\ttextfieldAddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'suffix',\n\t\t\t\t\taddon: suffix,\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n</div>\n", dependencies: [{ kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: FormFieldIdDirective, selector: "[luFormFieldId]", inputs: ["luFormFieldId", "labelledByStrategy"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions", "instantPrefix"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["size", "disabled", "product", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: TextInputComponent, isStandalone: true, selector: "lu-text-input", inputs: { mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: false, isRequired: false, transformFunction: null }, hasClearer: { classPropertyName: "hasClearer", publicName: "hasClearer", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, hasSearchIcon: { classPropertyName: "hasSearchIcon", publicName: "hasSearchIcon", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, valueAlignRight: { classPropertyName: "valueAlignRight", publicName: "valueAlignRight", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: false, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, searchIcon: { classPropertyName: "searchIcon", publicName: "searchIcon", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { blur: "blur" }, providers: [provideNgxMask()], viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, static: true }], hostDirectives: [{ directive: NoopValueAccessorDirective }], ngImport: i0, template: "<div class=\"textField\" [class.mod-valueAlignRight]=\"valueAlignRight\">\n\t<ng-template #textfieldAddon let-addon=\"addon\" let-type=\"type\">\n\t\t@if (addon.content) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" aria-hidden=\"true\">{{ addon.content }}</span>\n\t\t\t\t<span class=\"pr-u-mask\">{{ addon.ariaLabel }}</span>\n\t\t\t</span>\n\t\t}\n\t\t@if (addon.icon) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\"\n\t\t\t\t\t><span class=\"lucca-icon icon-{{ addon.icon }}\"></span\n\t\t\t\t></span>\n\t\t\t</span>\n\t\t}\n\t</ng-template>\n\n\t@if (prefix) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\ttextfieldAddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'prefix',\n\t\t\t\t\taddon: prefix,\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\n\t<div class=\"textField-input\">\n\t\t<input\n\t\t\tluInput\n\t\t\t[type]=\"type\"\n\t\t\t[attr.autocomplete]=\"autocomplete ? autocomplete : null\"\n\t\t\tclass=\"textField-input-value\"\n\t\t\t[placeholder]=\"placeholder\"\n\t\t\t[formControl]=\"ngControl.control\"\n\t\t\t(blur)=\"blur.emit($event)\"\n\t\t\t[mask]=\"mask()\"\n\t\t\t#inputElement\n\t\t/>\n\t\t<div class=\"textField-input-affix\">\n\t\t\t@if (hasClearer && inputElement.value) {\n\t\t\t\t<lu-clear (click)=\"clearValue()\" class=\"textField-input-affix-clear\">{{ intl.clear }}</lu-clear>\n\t\t\t}\n\t\t\t@if (hasSearchIcon) {\n\t\t\t\t<span aria-hidden=\"true\" class=\"textField-input-affix-icon lucca-icon icon-{{ searchIcon }}\"></span>\n\t\t\t}\n\t\t\t@if (hasTogglePasswordVisibilityIcon()) {\n\t\t\t\t<button\n\t\t\t\t\t[attr.aria-pressed]=\"showPassword()\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclass=\"button mod-onlyIcon mod-ghost textField-input-affix-toggle\"\n\t\t\t\t\t(click)=\"togglePasswordVisibility()\"\n\t\t\t\t>\n\t\t\t\t\t<span aria-hidden=\"true\" [class]=\"`lucca-icon icon-${ showPassword() ? 'unwatch' : 'watch' }`\"></span>\n\t\t\t\t\t<span class=\"pr-u-mask\">{{ intl.togglePasswordVisibility }}</span>\n\t\t\t\t</button>\n\t\t\t}\n\t\t</div>\n\t</div>\n\t@if (suffix) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\ttextfieldAddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'suffix',\n\t\t\t\t\taddon: suffix,\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n</div>\n", dependencies: [{ kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: FormFieldIdDirective, selector: "[luFormFieldId]", inputs: ["luFormFieldId", "labelledByStrategy"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions", "instantPrefix"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["size", "disabled", "palette", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: TextInputComponent, decorators: [{
             type: Component,
@@ -485,7 +485,7 @@ class NumberFormatInputComponent {
         this.inputElementRef().nativeElement.focus();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: NumberFormatInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: NumberFormatInputComponent, isStandalone: true, selector: "lu-number-format-input", inputs: { formatStyle: { classPropertyName: "formatStyle", publicName: "formatStyle", isSignal: true, isRequired: false, transformFunction: null }, useAutoPrefixSuffix: { classPropertyName: "useAutoPrefixSuffix", publicName: "useAutoPrefixSuffix", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, currency: { classPropertyName: "currency", publicName: "currency", isSignal: true, isRequired: false, transformFunction: null }, currencyDisplay: { classPropertyName: "currencyDisplay", publicName: "currencyDisplay", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, unitDisplay: { classPropertyName: "unitDisplay", publicName: "unitDisplay", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hasClearer: { classPropertyName: "hasClearer", publicName: "hasClearer", isSignal: true, isRequired: false, transformFunction: null }, valueAlignRight: { classPropertyName: "valueAlignRight", publicName: "valueAlignRight", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], hostDirectives: [{ directive: NoopValueAccessorDirective }], ngImport: i0, template: "<div class=\"textField\" [class.mod-valueAlignRight]=\"valueAlignRight()\">\n\t<ng-template #addon let-addon=\"addon\" let-type=\"type\">\n\t\t@if (addon.content) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\">{{ addon.content }}</span>\n\t\t\t</span>\n\t\t}\n\t\t@if (addon.icon) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\"\n\t\t\t\t\t><span class=\"lucca-icon icon-{{ addon.icon }}\"></span\n\t\t\t\t></span>\n\t\t\t</span>\n\t\t}\n\t</ng-template>\n\n\t@if (prefixAddon()) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\taddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'prefix',\n\t\t\t\t\taddon: prefixAddon(),\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\t@if (suffixAddon()) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\taddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'suffix',\n\t\t\t\t\taddon: suffixAddon(),\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\n\t<div class=\"textField-input\">\n\t\t<input\n\t\t\tluInput\n\t\t\tluNumberFormatInput\n\t\t\t[formatOptions]=\"formatOptions()\"\n\t\t\t[min]=\"min()\"\n\t\t\t[max]=\"max()\"\n\t\t\ttype=\"text\"\n\t\t\tinputmode=\"decimal\"\n\t\t\tclass=\"textField-input-value\"\n\t\t\t[placeholder]=\"placeholder()\"\n\t\t\t[formControl]=\"ngControl.control\"\n\t\t\t#inputElement\n\t\t/>\n\t\t<div class=\"textField-input-affix\">\n\t\t\t@if (hasClearer() && inputElement.value) {\n\t\t\t\t<lu-clear class=\"textField-input-affix-clear\" (onClear)=\"clearValue(); inputElement.focus()\">{{ intl.clear }}</lu-clear>\n\t\t\t}\n\t\t</div>\n\t</div>\n</div>\n", dependencies: [{ kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: FormFieldIdDirective, selector: "[luFormFieldId]", inputs: ["luFormFieldId", "labelledByStrategy"] }, { kind: "directive", type: NumberFormatDirective, selector: "input[luNumberFormatInput]", inputs: ["formatOptions"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["size", "disabled", "product", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: NumberFormatInputComponent, isStandalone: true, selector: "lu-number-format-input", inputs: { formatStyle: { classPropertyName: "formatStyle", publicName: "formatStyle", isSignal: true, isRequired: false, transformFunction: null }, useAutoPrefixSuffix: { classPropertyName: "useAutoPrefixSuffix", publicName: "useAutoPrefixSuffix", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, currency: { classPropertyName: "currency", publicName: "currency", isSignal: true, isRequired: false, transformFunction: null }, currencyDisplay: { classPropertyName: "currencyDisplay", publicName: "currencyDisplay", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, unitDisplay: { classPropertyName: "unitDisplay", publicName: "unitDisplay", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hasClearer: { classPropertyName: "hasClearer", publicName: "hasClearer", isSignal: true, isRequired: false, transformFunction: null }, valueAlignRight: { classPropertyName: "valueAlignRight", publicName: "valueAlignRight", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], hostDirectives: [{ directive: NoopValueAccessorDirective }], ngImport: i0, template: "<div class=\"textField\" [class.mod-valueAlignRight]=\"valueAlignRight()\">\n\t<ng-template #addon let-addon=\"addon\" let-type=\"type\">\n\t\t@if (addon.content) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\">{{ addon.content }}</span>\n\t\t\t</span>\n\t\t}\n\t\t@if (addon.icon) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\"\n\t\t\t\t\t><span class=\"lucca-icon icon-{{ addon.icon }}\"></span\n\t\t\t\t></span>\n\t\t\t</span>\n\t\t}\n\t</ng-template>\n\n\t@if (prefixAddon()) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\taddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'prefix',\n\t\t\t\t\taddon: prefixAddon(),\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\t@if (suffixAddon()) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\taddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'suffix',\n\t\t\t\t\taddon: suffixAddon(),\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\n\t<div class=\"textField-input\">\n\t\t<input\n\t\t\tluInput\n\t\t\tluNumberFormatInput\n\t\t\t[formatOptions]=\"formatOptions()\"\n\t\t\t[min]=\"min()\"\n\t\t\t[max]=\"max()\"\n\t\t\ttype=\"text\"\n\t\t\tinputmode=\"decimal\"\n\t\t\tclass=\"textField-input-value\"\n\t\t\t[placeholder]=\"placeholder()\"\n\t\t\t[formControl]=\"ngControl.control\"\n\t\t\t#inputElement\n\t\t/>\n\t\t<div class=\"textField-input-affix\">\n\t\t\t@if (hasClearer() && inputElement.value) {\n\t\t\t\t<lu-clear class=\"textField-input-affix-clear\" (onClear)=\"clearValue(); inputElement.focus()\">{{ intl.clear }}</lu-clear>\n\t\t\t}\n\t\t</div>\n\t</div>\n</div>\n", dependencies: [{ kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: FormFieldIdDirective, selector: "[luFormFieldId]", inputs: ["luFormFieldId", "labelledByStrategy"] }, { kind: "directive", type: NumberFormatDirective, selector: "input[luNumberFormatInput]", inputs: ["formatOptions"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["size", "disabled", "palette", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: NumberFormatInputComponent, decorators: [{
             type: Component,
@@ -544,7 +544,7 @@ class NumberInputComponent {
         this.inputElementRef().nativeElement.focus();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: NumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: NumberInputComponent, isStandalone: true, selector: "lu-number-input", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, noSpinButtons: { classPropertyName: "noSpinButtons", publicName: "noSpinButtons", isSignal: true, isRequired: false, transformFunction: null }, hasClearer: { classPropertyName: "hasClearer", publicName: "hasClearer", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, valueAlignRight: { classPropertyName: "valueAlignRight", publicName: "valueAlignRight", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], hostDirectives: [{ directive: NoopValueAccessorDirective }], ngImport: i0, template: "<div class=\"textField\" [class.mod-valueAlignRight]=\"valueAlignRight()\">\n\t<ng-template #addon let-addon=\"addon\" let-type=\"type\">\n\t\t@if (addon.content) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\">{{ addon.content }}</span>\n\t\t\t</span>\n\t\t}\n\t\t@if (addon.icon) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\"\n\t\t\t\t\t><span class=\"lucca-icon icon-{{ addon.icon }}\"></span\n\t\t\t\t></span>\n\t\t\t</span>\n\t\t}\n\t</ng-template>\n\n\t@if (prefix()) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\taddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'prefix',\n\t\t\t\t\taddon: prefix(),\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\t@if (suffix()) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\taddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'suffix',\n\t\t\t\t\taddon: suffix(),\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\n\t<div class=\"textField-input\">\n\t\t<input\n\t\t\tluInput\n\t\t\ttype=\"number\"\n\t\t\tclass=\"textField-input-value\"\n\t\t\t[placeholder]=\"placeholder()\"\n\t\t\t[formControl]=\"ngControl.control\"\n\t\t\t[step]=\"step()\"\n\t\t\t[min]=\"min()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[class.pr-u-noSpinButtons]=\"noSpinButtons()\"\n\t\t\t(wheel)=\"$event.preventDefault()\"\n\t\t\t#inputElement\n\t\t/>\n\t\t<div class=\"textField-input-affix\">\n\t\t\t@if (hasClearer() && inputElement.value) {\n\t\t\t\t<lu-clear class=\"textField-input-affix-clear\" (onClear)=\"clearValue(); inputElement.focus()\">{{ intl.clear }}</lu-clear>\n\t\t\t}\n\t\t</div>\n\t</div>\n</div>\n", dependencies: [{ kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: FormFieldIdDirective, selector: "[luFormFieldId]", inputs: ["luFormFieldId", "labelledByStrategy"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["size", "disabled", "product", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: NumberInputComponent, isStandalone: true, selector: "lu-number-input", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, noSpinButtons: { classPropertyName: "noSpinButtons", publicName: "noSpinButtons", isSignal: true, isRequired: false, transformFunction: null }, hasClearer: { classPropertyName: "hasClearer", publicName: "hasClearer", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, valueAlignRight: { classPropertyName: "valueAlignRight", publicName: "valueAlignRight", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], hostDirectives: [{ directive: NoopValueAccessorDirective }], ngImport: i0, template: "<div class=\"textField\" [class.mod-valueAlignRight]=\"valueAlignRight()\">\n\t<ng-template #addon let-addon=\"addon\" let-type=\"type\">\n\t\t@if (addon.content) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\">{{ addon.content }}</span>\n\t\t\t</span>\n\t\t}\n\t\t@if (addon.icon) {\n\t\t\t<span class=\"textField-{{ type }}\" luFormFieldId=\"{{ type }}\">\n\t\t\t\t<span class=\"textField-label-{{ type }}-item\" [attr.aria-label]=\"addon.ariaLabel\"\n\t\t\t\t\t><span class=\"lucca-icon icon-{{ addon.icon }}\"></span\n\t\t\t\t></span>\n\t\t\t</span>\n\t\t}\n\t</ng-template>\n\n\t@if (prefix()) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\taddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'prefix',\n\t\t\t\t\taddon: prefix(),\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\t@if (suffix()) {\n\t\t<ng-container\n\t\t\t*ngTemplateOutlet=\"\n\t\t\t\taddon;\n\t\t\t\tcontext: {\n\t\t\t\t\ttype: 'suffix',\n\t\t\t\t\taddon: suffix(),\n\t\t\t\t}\n\t\t\t\"\n\t\t/>\n\t}\n\n\t<div class=\"textField-input\">\n\t\t<input\n\t\t\tluInput\n\t\t\ttype=\"number\"\n\t\t\tclass=\"textField-input-value\"\n\t\t\t[placeholder]=\"placeholder()\"\n\t\t\t[formControl]=\"ngControl.control\"\n\t\t\t[step]=\"step()\"\n\t\t\t[min]=\"min()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[class.pr-u-noSpinButtons]=\"noSpinButtons()\"\n\t\t\t(wheel)=\"$event.preventDefault()\"\n\t\t\t#inputElement\n\t\t/>\n\t\t<div class=\"textField-input-affix\">\n\t\t\t@if (hasClearer() && inputElement.value) {\n\t\t\t\t<lu-clear class=\"textField-input-affix-clear\" (onClear)=\"clearValue(); inputElement.focus()\">{{ intl.clear }}</lu-clear>\n\t\t\t}\n\t\t</div>\n\t</div>\n</div>\n", dependencies: [{ kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: FormFieldIdDirective, selector: "[luFormFieldId]", inputs: ["luFormFieldId", "labelledByStrategy"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["size", "disabled", "palette", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: NumberInputComponent, decorators: [{
             type: Component,
@@ -731,6 +731,7 @@ class FieldsetComponent {
     constructor() {
         this.heading = input(null);
         this.helper = input(null);
+        this.action = input(null);
         this.size = input(null);
         this.horizontal = input(false, { transform: booleanAttribute });
         this.expandable = input(false, { transform: booleanAttribute });
@@ -738,11 +739,11 @@ class FieldsetComponent {
         this.id = `fieldsetTitleContent${nextId++}`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: FieldsetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: FieldsetComponent, isStandalone: true, selector: "lu-fieldset", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, helper: { classPropertyName: "helper", publicName: "helper", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, horizontal: { classPropertyName: "horizontal", publicName: "horizontal", isSignal: true, isRequired: false, transformFunction: null }, expandable: { classPropertyName: "expandable", publicName: "expandable", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, ngImport: i0, template: "<fieldset\n\tclass=\"fieldset\"\n\t[attr.aria-labelledby]=\"id\"\n\t[class.mod-expandable]=\"expandable()\"\n\t[class.mod-horizontal]=\"horizontal()\"\n\t[class.mod-S]=\"size() === 'S'\"\n>\n\t<legend class=\"fieldset-title\">\n\t\t@if (expandable()) {\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tclass=\"fieldset-title-content\"\n\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t[attr.aria-expanded]=\"expanded()\"\n\t\t\t\t(click)=\"expanded.set(!expanded())\"\n\t\t\t>\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t\t<lu-icon icon=\"arrowChevronBottom\" />\n\t\t\t</button>\n\t\t} @else {\n\t\t\t<span class=\"fieldset-title-content\" [attr.id]=\"id\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t</span>\n\t\t}\n\t</legend>\n\t<div class=\"fieldset-content\" [attr.hidden]=\"!expandable() || expanded() ? null : 'hidden'\"><ng-content /></div>\n</fieldset>\n\n<ng-template #titleContent>\n\t<span class=\"fieldset-title-content-text\">\n\t\t<ng-container *luPortal=\"heading()\" />\n\t\t@if (helper()) {\n\t\t\t<span class=\"fieldset-title-content-text-helper\"><ng-container *luPortal=\"helper()\" /></span>\n\t\t}\n\t</span>\n</ng-template>\n", styles: ["@layer components{.fieldset{--components-fieldset-title: var(--pr-t-font-heading-3);--components-fieldset-gap: var(--pr-t-spacings-150);--components-fieldset-contentMaxWidth: 40rem;--components-fieldset-title-iconRotation: 0deg;border:0;margin:0;padding:0;display:grid;gap:var(--components-fieldset-gap);grid-template-columns:auto}.fieldset-title{font:var(--components-fieldset-title);color:var(--pr-t-color-text-heading);padding:0;margin:0;inline-size:100%;min-block-size:var(--pr-t-spacings-300);display:contents}.fieldset-title-content{border:0;padding:0;margin:0;inline-size:100%;background-color:transparent;text-align:start;display:flex;align-items:flex-start;justify-content:space-between;gap:var(--components-fieldset-gap);max-inline-size:var(--components-fieldset-contentMaxWidth)}.fieldset-title-content .lucca-icon{transform:rotate(var(--components-fieldset-title-iconRotation));transition-property:transform;transition-duration:var(--commons-animations-durations-fast);color:var(--palettes-neutral-700)}.fieldset-title-content-text-helper{font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-regular);color:var(--palettes-neutral-700);display:block}.fieldset-content{min-inline-size:0}}@layer mods{.fieldset.mod-S{--components-fieldset-title: var(--pr-t-font-heading-4)}.fieldset.mod-horizontal{grid-template-columns:1fr auto}.fieldset.mod-expandable .fieldset-title-content{border-radius:var(--pr-t-border-radius-default);cursor:pointer;font:inherit}.fieldset.mod-expandable .fieldset-title-content:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:2px}.fieldset:has(.fieldset-title-content[aria-expanded=true]){--components-fieldset-title-iconRotation: 180deg}}\n"], dependencies: [{ kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "lu-icon", inputs: ["icon", "alt", "size", "color", "AI"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: FieldsetComponent, isStandalone: true, selector: "lu-fieldset", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, helper: { classPropertyName: "helper", publicName: "helper", isSignal: true, isRequired: false, transformFunction: null }, action: { classPropertyName: "action", publicName: "action", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, horizontal: { classPropertyName: "horizontal", publicName: "horizontal", isSignal: true, isRequired: false, transformFunction: null }, expandable: { classPropertyName: "expandable", publicName: "expandable", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, ngImport: i0, template: "<fieldset\n\tclass=\"fieldset\"\n\t[attr.aria-labelledby]=\"id\"\n\t[class.mod-expandable]=\"expandable()\"\n\t[class.mod-horizontal]=\"horizontal()\"\n\t[class.mod-S]=\"size() === 'S'\"\n>\n\t<legend class=\"fieldset-title\">\n\t\t@if (expandable()) {\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tclass=\"fieldset-title-content\"\n\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t[attr.aria-expanded]=\"expanded()\"\n\t\t\t\t(click)=\"expanded.set(!expanded())\"\n\t\t\t>\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t\t<lu-icon icon=\"arrowChevronBottom\" />\n\t\t\t</button>\n\t\t} @else if (action()) {\n\t\t\t<span class=\"fieldset-title-content\" [attr.id]=\"id\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t\t<div class=\"fieldset-title-content-action\">\n\t\t\t\t\t<ng-container *luPortal=\"action()\" />\n\t\t\t\t</div>\n\t\t\t</span>\n\t\t} @else {\n\t\t\t<span class=\"fieldset-title-content\" [attr.id]=\"id\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t</span>\n\t\t}\n\t</legend>\n\t<div class=\"fieldset-content\" [attr.hidden]=\"!expandable() || expanded() ? null : 'hidden'\"><ng-content /></div>\n</fieldset>\n\n<ng-template #titleContent>\n\t<span class=\"fieldset-title-content-text\">\n\t\t<ng-container *luPortal=\"heading()\" />\n\t\t@if (helper()) {\n\t\t\t<span class=\"fieldset-title-content-text-helper\"><ng-container *luPortal=\"helper()\" /></span>\n\t\t}\n\t</span>\n</ng-template>\n", styles: ["@layer components{.fieldset{--components-fieldset-title: var(--pr-t-font-heading-3);--components-fieldset-gap: var(--pr-t-spacings-100);--components-fieldset-contentMaxWidth: 40rem;--components-fieldset-title-iconRotation: 0deg;border:0;margin:0;padding:0;display:grid;gap:var(--components-fieldset-gap);grid-template-columns:auto}.fieldset-title{font:var(--components-fieldset-title);color:var(--pr-t-color-text-heading);padding:0;margin:0;inline-size:100%;min-block-size:var(--pr-t-spacings-300);display:contents}.fieldset-title-content{border:0;padding:0;margin:0;inline-size:100%;background-color:transparent;text-align:start;display:flex;align-items:flex-start;justify-content:space-between;gap:var(--components-fieldset-gap);max-inline-size:var(--components-fieldset-contentMaxWidth)}.fieldset-title-content .lucca-icon{transform:rotate(var(--components-fieldset-title-iconRotation));transition-property:transform;transition-duration:var(--commons-animations-durations-fast);color:var(--palettes-neutral-700)}.fieldset-title-content-text{padding-block:var(--pr-t-spacings-50)}.fieldset-title-content-text-helper{font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-regular);color:var(--palettes-neutral-700);display:block}.fieldset-content{min-inline-size:0}}@layer mods{.fieldset.mod-S{--components-fieldset-title: var(--pr-t-font-heading-4)}.fieldset.mod-horizontal{grid-template-columns:1fr auto}.fieldset.mod-expandable .fieldset-title-content{border-radius:var(--pr-t-border-radius-default);cursor:pointer;font:inherit}.fieldset.mod-expandable .fieldset-title-content:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:2px}.fieldset:has(.fieldset-title-content[aria-expanded=true]){--components-fieldset-title-iconRotation: 180deg}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button{--components-button-backgroundColor: var(--palettes-neutral-0);--components-button-color: var(--palettes-700, var(--palettes-neutral-700));--components-button-boxShadow: var(--pr-t-elevation-shadow-button), 0 0 0 var(--commons-divider-width) var(--palettes-neutral-200);--icon-size: 1.25rem;--components-button-font: var(--pr-t-font-body-S);--components-button-paddingBlock: var(--pr-t-spacings-75);--components-button-paddingInline: var(--pr-t-spacings-100);--components-button-gap: var(--pr-t-spacings-75);--components-button-font-size: var(--pr-t-font-body-S-fontSize);--components-button-line-height: var(--pr-t-font-body-S-lineHeight)}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button:hover{--components-button-boxShadow: var(--pr-t-elevation-shadow-button), 0 0 0 var(--commons-divider-width) var(--palettes-300, var(--palettes-neutral-300));--components-button-color: var(--palettes-700, var(--palettes-neutral-700));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50)) }.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:3px}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button:disabled{--components-button-backgroundColor: var(--palettes-neutral-0);--components-button-boxShadow: 0 0 0 1px var(--palettes-neutral-100);--components-button-color: var(--pr-t-color-text-disabled)}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS);--components-numericBadge-fontSize: var(--pr-t-font-body-XS-fontSize);--components-numericBadge-lineHeight: var(--pr-t-font-body-XS-lineHeight)}}\n"], dependencies: [{ kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "lu-icon", inputs: ["icon", "alt", "size", "color", "AI"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: FieldsetComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lu-fieldset', encapsulation: ViewEncapsulation.None, imports: [PortalDirective, NgTemplateOutlet, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<fieldset\n\tclass=\"fieldset\"\n\t[attr.aria-labelledby]=\"id\"\n\t[class.mod-expandable]=\"expandable()\"\n\t[class.mod-horizontal]=\"horizontal()\"\n\t[class.mod-S]=\"size() === 'S'\"\n>\n\t<legend class=\"fieldset-title\">\n\t\t@if (expandable()) {\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tclass=\"fieldset-title-content\"\n\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t[attr.aria-expanded]=\"expanded()\"\n\t\t\t\t(click)=\"expanded.set(!expanded())\"\n\t\t\t>\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t\t<lu-icon icon=\"arrowChevronBottom\" />\n\t\t\t</button>\n\t\t} @else {\n\t\t\t<span class=\"fieldset-title-content\" [attr.id]=\"id\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t</span>\n\t\t}\n\t</legend>\n\t<div class=\"fieldset-content\" [attr.hidden]=\"!expandable() || expanded() ? null : 'hidden'\"><ng-content /></div>\n</fieldset>\n\n<ng-template #titleContent>\n\t<span class=\"fieldset-title-content-text\">\n\t\t<ng-container *luPortal=\"heading()\" />\n\t\t@if (helper()) {\n\t\t\t<span class=\"fieldset-title-content-text-helper\"><ng-container *luPortal=\"helper()\" /></span>\n\t\t}\n\t</span>\n</ng-template>\n", styles: ["@layer components{.fieldset{--components-fieldset-title: var(--pr-t-font-heading-3);--components-fieldset-gap: var(--pr-t-spacings-150);--components-fieldset-contentMaxWidth: 40rem;--components-fieldset-title-iconRotation: 0deg;border:0;margin:0;padding:0;display:grid;gap:var(--components-fieldset-gap);grid-template-columns:auto}.fieldset-title{font:var(--components-fieldset-title);color:var(--pr-t-color-text-heading);padding:0;margin:0;inline-size:100%;min-block-size:var(--pr-t-spacings-300);display:contents}.fieldset-title-content{border:0;padding:0;margin:0;inline-size:100%;background-color:transparent;text-align:start;display:flex;align-items:flex-start;justify-content:space-between;gap:var(--components-fieldset-gap);max-inline-size:var(--components-fieldset-contentMaxWidth)}.fieldset-title-content .lucca-icon{transform:rotate(var(--components-fieldset-title-iconRotation));transition-property:transform;transition-duration:var(--commons-animations-durations-fast);color:var(--palettes-neutral-700)}.fieldset-title-content-text-helper{font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-regular);color:var(--palettes-neutral-700);display:block}.fieldset-content{min-inline-size:0}}@layer mods{.fieldset.mod-S{--components-fieldset-title: var(--pr-t-font-heading-4)}.fieldset.mod-horizontal{grid-template-columns:1fr auto}.fieldset.mod-expandable .fieldset-title-content{border-radius:var(--pr-t-border-radius-default);cursor:pointer;font:inherit}.fieldset.mod-expandable .fieldset-title-content:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:2px}.fieldset:has(.fieldset-title-content[aria-expanded=true]){--components-fieldset-title-iconRotation: 180deg}}\n"] }]
+            args: [{ selector: 'lu-fieldset', encapsulation: ViewEncapsulation.None, imports: [PortalDirective, NgTemplateOutlet, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<fieldset\n\tclass=\"fieldset\"\n\t[attr.aria-labelledby]=\"id\"\n\t[class.mod-expandable]=\"expandable()\"\n\t[class.mod-horizontal]=\"horizontal()\"\n\t[class.mod-S]=\"size() === 'S'\"\n>\n\t<legend class=\"fieldset-title\">\n\t\t@if (expandable()) {\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tclass=\"fieldset-title-content\"\n\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t[attr.aria-expanded]=\"expanded()\"\n\t\t\t\t(click)=\"expanded.set(!expanded())\"\n\t\t\t>\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t\t<lu-icon icon=\"arrowChevronBottom\" />\n\t\t\t</button>\n\t\t} @else if (action()) {\n\t\t\t<span class=\"fieldset-title-content\" [attr.id]=\"id\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t\t<div class=\"fieldset-title-content-action\">\n\t\t\t\t\t<ng-container *luPortal=\"action()\" />\n\t\t\t\t</div>\n\t\t\t</span>\n\t\t} @else {\n\t\t\t<span class=\"fieldset-title-content\" [attr.id]=\"id\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"titleContent\" />\n\t\t\t</span>\n\t\t}\n\t</legend>\n\t<div class=\"fieldset-content\" [attr.hidden]=\"!expandable() || expanded() ? null : 'hidden'\"><ng-content /></div>\n</fieldset>\n\n<ng-template #titleContent>\n\t<span class=\"fieldset-title-content-text\">\n\t\t<ng-container *luPortal=\"heading()\" />\n\t\t@if (helper()) {\n\t\t\t<span class=\"fieldset-title-content-text-helper\"><ng-container *luPortal=\"helper()\" /></span>\n\t\t}\n\t</span>\n</ng-template>\n", styles: ["@layer components{.fieldset{--components-fieldset-title: var(--pr-t-font-heading-3);--components-fieldset-gap: var(--pr-t-spacings-100);--components-fieldset-contentMaxWidth: 40rem;--components-fieldset-title-iconRotation: 0deg;border:0;margin:0;padding:0;display:grid;gap:var(--components-fieldset-gap);grid-template-columns:auto}.fieldset-title{font:var(--components-fieldset-title);color:var(--pr-t-color-text-heading);padding:0;margin:0;inline-size:100%;min-block-size:var(--pr-t-spacings-300);display:contents}.fieldset-title-content{border:0;padding:0;margin:0;inline-size:100%;background-color:transparent;text-align:start;display:flex;align-items:flex-start;justify-content:space-between;gap:var(--components-fieldset-gap);max-inline-size:var(--components-fieldset-contentMaxWidth)}.fieldset-title-content .lucca-icon{transform:rotate(var(--components-fieldset-title-iconRotation));transition-property:transform;transition-duration:var(--commons-animations-durations-fast);color:var(--palettes-neutral-700)}.fieldset-title-content-text{padding-block:var(--pr-t-spacings-50)}.fieldset-title-content-text-helper{font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-regular);color:var(--palettes-neutral-700);display:block}.fieldset-content{min-inline-size:0}}@layer mods{.fieldset.mod-S{--components-fieldset-title: var(--pr-t-font-heading-4)}.fieldset.mod-horizontal{grid-template-columns:1fr auto}.fieldset.mod-expandable .fieldset-title-content{border-radius:var(--pr-t-border-radius-default);cursor:pointer;font:inherit}.fieldset.mod-expandable .fieldset-title-content:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:2px}.fieldset:has(.fieldset-title-content[aria-expanded=true]){--components-fieldset-title-iconRotation: 180deg}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button{--components-button-backgroundColor: var(--palettes-neutral-0);--components-button-color: var(--palettes-700, var(--palettes-neutral-700));--components-button-boxShadow: var(--pr-t-elevation-shadow-button), 0 0 0 var(--commons-divider-width) var(--palettes-neutral-200);--icon-size: 1.25rem;--components-button-font: var(--pr-t-font-body-S);--components-button-paddingBlock: var(--pr-t-spacings-75);--components-button-paddingInline: var(--pr-t-spacings-100);--components-button-gap: var(--pr-t-spacings-75);--components-button-font-size: var(--pr-t-font-body-S-fontSize);--components-button-line-height: var(--pr-t-font-body-S-lineHeight)}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button:hover{--components-button-boxShadow: var(--pr-t-elevation-shadow-button), 0 0 0 var(--commons-divider-width) var(--palettes-300, var(--palettes-neutral-300));--components-button-color: var(--palettes-700, var(--palettes-neutral-700));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50)) }.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:3px}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button:disabled{--components-button-backgroundColor: var(--palettes-neutral-0);--components-button-boxShadow: 0 0 0 1px var(--palettes-neutral-100);--components-button-color: var(--pr-t-color-text-disabled)}.fieldset:has(.fieldset-title-content-action:not(:empty)) .fieldset-title-content-action .button .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS);--components-numericBadge-fontSize: var(--pr-t-font-body-XS-fontSize);--components-numericBadge-lineHeight: var(--pr-t-font-body-XS-lineHeight)}}\n"] }]
         }] });
 
 /**