@lucca-front/ng 21.0.2 → 21.1.0-rc.0

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

@@ -37,10 +37,10 @@ class LuFormlyFieldApi extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldApi, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyFieldApi, isStandalone: true, selector: "lu-formly-field-api", usesInheritance: true, ngImport: i0, template: "<lu-api-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[api]=\"_api\"\n\t[filters]=\"_filters\"\n\t[orderBy]=\"_orderBy\"\n\t[sort]=\"_sort\"\n\t[standard]=\"_standard\"\n/>\n<span [attr.for]=\"id\" class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuApiSelectInputComponent, selector: "lu-api-select", inputs: ["standard", "api", "fields", "filters", "orderBy", "sort"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldApi, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyFieldApi, isStandalone: true, selector: "lu-formly-field-api", usesInheritance: true, ngImport: i0, template: "<lu-api-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[api]=\"_api\"\n\t[filters]=\"_filters\"\n\t[orderBy]=\"_orderBy\"\n\t[sort]=\"_sort\"\n\t[standard]=\"_standard\"\n/>\n<span [attr.for]=\"id\" class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuApiSelectInputComponent, selector: "lu-api-select", inputs: ["standard", "api", "fields", "filters", "orderBy", "sort"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldApi, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldApi, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-api', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, FormlyModule, LuApiSelectInputComponent], template: "<lu-api-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[api]=\"_api\"\n\t[filters]=\"_filters\"\n\t[orderBy]=\"_orderBy\"\n\t[sort]=\"_sort\"\n\t[standard]=\"_standard\"\n/>\n<span [attr.for]=\"id\" class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"] }]
         }] });
@@ -52,10 +52,10 @@ class LuFormlyFieldCheckbox extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldCheckbox, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyFieldCheckbox, isStandalone: true, selector: "lu-formly-field-checkbox", usesInheritance: true, ngImport: i0, template: "<label class=\"checkbox\" [class]=\"props['mod']\">\n\t<input\n\t\tclass=\"checkbox-input\"\n\t\ttype=\"checkbox\"\n\t\t[name]=\"props['name']\"\n\t\t[id]=\"id\"\n\t\t[formControl]=\"formControl\"\n\t\t[formlyAttributes]=\"field\"\n\t\t(focus)=\"focus()\"\n\t\t(blur)=\"blur()\"\n\t/>\n\t<span class=\"checkbox-label\">{{ props.label }}</span>\n</label>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldCheckbox, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyFieldCheckbox, isStandalone: true, selector: "lu-formly-field-checkbox", usesInheritance: true, ngImport: i0, template: "<label class=\"checkbox\" [class]=\"props['mod']\">\n\t<input\n\t\tclass=\"checkbox-input\"\n\t\ttype=\"checkbox\"\n\t\t[name]=\"props['name']\"\n\t\t[id]=\"id\"\n\t\t[formControl]=\"formControl\"\n\t\t[formlyAttributes]=\"field\"\n\t\t(focus)=\"focus()\"\n\t\t(blur)=\"blur()\"\n\t/>\n\t<span class=\"checkbox-label\">{{ props.label }}</span>\n</label>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldCheckbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldCheckbox, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-checkbox', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, FormlyModule], template: "<label class=\"checkbox\" [class]=\"props['mod']\">\n\t<input\n\t\tclass=\"checkbox-input\"\n\t\ttype=\"checkbox\"\n\t\t[name]=\"props['name']\"\n\t\t[id]=\"id\"\n\t\t[formControl]=\"formControl\"\n\t\t[formlyAttributes]=\"field\"\n\t\t(focus)=\"focus()\"\n\t\t(blur)=\"blur()\"\n\t/>\n\t<span class=\"checkbox-label\">{{ props.label }}</span>\n</label>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"] }]
         }] });
@@ -67,10 +67,10 @@ class LuFormlyFieldDate extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldDate, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyFieldDate, isStandalone: true, selector: "lu-formly-field-date", usesInheritance: true, ngImport: i0, template: "<lu-date-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[min]=\"props.min\"\n\t[max]=\"props.max\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuDateSelectInputComponent, selector: "lu-date-select", inputs: ["min", "max", "granularity", "placeholder", "hideClearer", "startOn"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldDate, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyFieldDate, isStandalone: true, selector: "lu-formly-field-date", usesInheritance: true, ngImport: i0, template: "<lu-date-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[min]=\"props.min\"\n\t[max]=\"props.max\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuDateSelectInputComponent, selector: "lu-date-select", inputs: ["min", "max", "granularity", "placeholder", "hideClearer", "startOn"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldDate, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldDate, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-date', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, FormlyModule, LuDateSelectInputComponent], template: "<lu-date-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[min]=\"props.min\"\n\t[max]=\"props.max\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"] }]
         }] });
@@ -82,10 +82,10 @@ class LuFormlyFieldDepartment extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldDepartment, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyFieldDepartment, isStandalone: true, selector: "lu-formly-field-department", usesInheritance: true, ngImport: i0, template: "<lu-department-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[filters]=\"props['filters']\"\n\t[appInstanceId]=\"props['appInstanceId']\"\n\t[operations]=\"props['operations']\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuDepartmentSelectInputComponent, selector: "lu-department-select", inputs: ["appInstanceId", "operations", "filters", "uniqueOperation"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldDepartment, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyFieldDepartment, isStandalone: true, selector: "lu-formly-field-department", usesInheritance: true, ngImport: i0, template: "<lu-department-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[filters]=\"props['filters']\"\n\t[appInstanceId]=\"props['appInstanceId']\"\n\t[operations]=\"props['operations']\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuDepartmentSelectInputComponent, selector: "lu-department-select", inputs: ["appInstanceId", "operations", "filters", "uniqueOperation"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldDepartment, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldDepartment, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-department', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, FormlyModule, LuDepartmentSelectInputComponent], template: "<lu-department-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[filters]=\"props['filters']\"\n\t[appInstanceId]=\"props['appInstanceId']\"\n\t[operations]=\"props['operations']\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"] }]
         }] });
@@ -97,10 +97,10 @@ class LuFormlyFieldEstablishment extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldEstablishment, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyFieldEstablishment, isStandalone: true, selector: "lu-formly-field-establishment", usesInheritance: true, ngImport: i0, template: "<lu-establishment-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[filters]=\"props['filters']\"\n\t[appInstanceId]=\"props['appInstanceId']\"\n\t[operations]=\"props['operations']\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuEstablishmentSelectInputComponent, selector: "lu-establishment-select", inputs: ["filters", "appInstanceId", "operations"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldEstablishment, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyFieldEstablishment, isStandalone: true, selector: "lu-formly-field-establishment", usesInheritance: true, ngImport: i0, template: "<lu-establishment-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[filters]=\"props['filters']\"\n\t[appInstanceId]=\"props['appInstanceId']\"\n\t[operations]=\"props['operations']\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuEstablishmentSelectInputComponent, selector: "lu-establishment-select", inputs: ["filters", "appInstanceId", "operations"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldEstablishment, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldEstablishment, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-establishment', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, FormlyModule, LuEstablishmentSelectInputComponent], template: "<lu-establishment-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n\t[filters]=\"props['filters']\"\n\t[appInstanceId]=\"props['appInstanceId']\"\n\t[operations]=\"props['operations']\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"] }]
         }] });
@@ -115,10 +115,10 @@ class LuFormlyFieldInput extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldInput, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: LuFormlyFieldInput, isStandalone: true, selector: "lu-formly-field-input", usesInheritance: true, ngImport: i0, template: "@if (type === \"number\") {\n\t<!-- type=\"number\" has to be static in order to have NumberValueAccessor instead of DefaultValueAccessor -->\n\t<input\n\t\ttype=\"number\"\n\t\tclass=\"textfield-input\"\n\t\t[name]=\"props['name']\"\n\t\t[formControl]=\"formControl\"\n\t\t[formlyAttributes]=\"field\"\n\t\tluInput\n\t\t(focus)=\"focus()\"\n\t\t(blur)=\"blur()\"\n\t\t[placeholder]=\"props.placeholder\"\n\t/>\n} @else {\n\t<input\n\t\t[type]=\"type\"\n\t\tclass=\"textfield-input\"\n\t\t[name]=\"props['name']\"\n\t\t[formControl]=\"formControl\"\n\t\t[formlyAttributes]=\"field\"\n\t\tluInput\n\t\t(focus)=\"focus()\"\n\t\t(blur)=\"blur()\"\n\t\t[placeholder]=\"props.placeholder\"\n\t/>\n}\n\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "directive", type: LuInputDirective, selector: "[luInput]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldInput, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: LuFormlyFieldInput, isStandalone: true, selector: "lu-formly-field-input", usesInheritance: true, ngImport: i0, template: "@if (type === \"number\") {\n\t<!-- type=\"number\" has to be static in order to have NumberValueAccessor instead of DefaultValueAccessor -->\n\t<input\n\t\ttype=\"number\"\n\t\tclass=\"textfield-input\"\n\t\t[name]=\"props['name']\"\n\t\t[formControl]=\"formControl\"\n\t\t[formlyAttributes]=\"field\"\n\t\tluInput\n\t\t(focus)=\"focus()\"\n\t\t(blur)=\"blur()\"\n\t\t[placeholder]=\"props.placeholder\"\n\t/>\n} @else {\n\t<input\n\t\t[type]=\"type\"\n\t\tclass=\"textfield-input\"\n\t\t[name]=\"props['name']\"\n\t\t[formControl]=\"formControl\"\n\t\t[formlyAttributes]=\"field\"\n\t\tluInput\n\t\t(focus)=\"focus()\"\n\t\t(blur)=\"blur()\"\n\t\t[placeholder]=\"props.placeholder\"\n\t/>\n}\n\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "directive", type: LuInputDirective, selector: "[luInput]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldInput, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-input', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, FormlyModule, LuInputDirective], template: "@if (type === \"number\") {\n\t<!-- type=\"number\" has to be static in order to have NumberValueAccessor instead of DefaultValueAccessor -->\n\t<input\n\t\ttype=\"number\"\n\t\tclass=\"textfield-input\"\n\t\t[name]=\"props['name']\"\n\t\t[formControl]=\"formControl\"\n\t\t[formlyAttributes]=\"field\"\n\t\tluInput\n\t\t(focus)=\"focus()\"\n\t\t(blur)=\"blur()\"\n\t\t[placeholder]=\"props.placeholder\"\n\t/>\n} @else {\n\t<input\n\t\t[type]=\"type\"\n\t\tclass=\"textfield-input\"\n\t\t[name]=\"props['name']\"\n\t\t[formControl]=\"formControl\"\n\t\t[formlyAttributes]=\"field\"\n\t\tluInput\n\t\t(focus)=\"focus()\"\n\t\t(blur)=\"blur()\"\n\t\t[placeholder]=\"props.placeholder\"\n\t/>\n}\n\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"] }]
         }] });
@@ -133,10 +133,10 @@ class LuFormlyFieldRadios extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldRadios, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: LuFormlyFieldRadios, isStandalone: true, selector: "lu-formly-field-radios", usesInheritance: true, ngImport: i0, template: "<legend class=\"radiosfield-label\">{{ props.label }}</legend>\n<div class=\"radiosfield-input\">\n\t@for (option of _options; track $index) {\n\t\t<label class=\"radio\">\n\t\t\t<input\n\t\t\t\tclass=\"radio-input\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\t[name]=\"props['name']\"\n\t\t\t\t[value]=\"option.value\"\n\t\t\t\t[id]=\"id + '_' + $index\"\n\t\t\t\t[formControl]=\"formControl\"\n\t\t\t\t[formlyAttributes]=\"field\"\n\t\t\t/>\n\t\t\t<span class=\"radio-label\">{{ option.label }}</span>\n\t\t</label>\n\t}\n</div>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldRadios, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: LuFormlyFieldRadios, isStandalone: true, selector: "lu-formly-field-radios", usesInheritance: true, ngImport: i0, template: "<legend class=\"radiosfield-label\">{{ props.label }}</legend>\n<div class=\"radiosfield-input\">\n\t@for (option of _options; track $index) {\n\t\t<label class=\"radio\">\n\t\t\t<input\n\t\t\t\tclass=\"radio-input\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\t[name]=\"props['name']\"\n\t\t\t\t[value]=\"option.value\"\n\t\t\t\t[id]=\"id + '_' + $index\"\n\t\t\t\t[formControl]=\"formControl\"\n\t\t\t\t[formlyAttributes]=\"field\"\n\t\t\t/>\n\t\t\t<span class=\"radio-label\">{{ option.label }}</span>\n\t\t</label>\n\t}\n</div>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldRadios, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldRadios, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-radios', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, FormlyModule], template: "<legend class=\"radiosfield-label\">{{ props.label }}</legend>\n<div class=\"radiosfield-input\">\n\t@for (option of _options; track $index) {\n\t\t<label class=\"radio\">\n\t\t\t<input\n\t\t\t\tclass=\"radio-input\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\t[name]=\"props['name']\"\n\t\t\t\t[value]=\"option.value\"\n\t\t\t\t[id]=\"id + '_' + $index\"\n\t\t\t\t[formControl]=\"formControl\"\n\t\t\t\t[formlyAttributes]=\"field\"\n\t\t\t/>\n\t\t\t<span class=\"radio-label\">{{ option.label }}</span>\n\t\t</label>\n\t}\n</div>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"] }]
         }] });
@@ -151,10 +151,10 @@ class LuFormlyFieldSelect extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldSelect, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: LuFormlyFieldSelect, isStandalone: true, selector: "lu-formly-field-select", usesInheritance: true, ngImport: i0, template: "<lu-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[multiple]=\"props['multiple']\"\n\t[placeholder]=\"props.placeholder\"\n>\n\t<ng-container *luDisplayer=\"let option\">\n\t\t<span [class.chip]=\"props['multiple']\" [class.mod-unkillable]=\"props['multiple']\"\n\t\t\t><span class=\"pr-u-ellipsis\">{{ option.name }}</span></span\n\t\t>\n\t</ng-container>\n\t<lu-option-picker>\n\t\t@for (option of _options; track $index) {\n\t\t\t<lu-option [value]=\"option\"> {{ option.name }} </lu-option>\n\t\t}\n\t</lu-option-picker>\n\t@if (!props.required && !props[\"multiple\"]) {\n\t\t<lu-clear />\n\t}\n</lu-select>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuSelectInputComponent, selector: "lu-select" }, { kind: "ngmodule", type: LuOptionPickerModule }, { kind: "component", type: i3.LuOptionPickerComponent, selector: "lu-option-picker", exportAs: ["LuOptionPicker"] }, { kind: "component", type: i3.LuOptionItemComponent, selector: "lu-option", inputs: ["selected", "highlighted", "value", "disabled"], outputs: ["onSelect"] }, { kind: "directive", type: LuInputDisplayerDirective, selector: "[luDisplayer]", inputs: ["luDisplayerMultiple", "multiple"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["size", "disabled", "palette", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldSelect, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: LuFormlyFieldSelect, isStandalone: true, selector: "lu-formly-field-select", usesInheritance: true, ngImport: i0, template: "<lu-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[multiple]=\"props['multiple']\"\n\t[placeholder]=\"props.placeholder\"\n>\n\t<ng-container *luDisplayer=\"let option\">\n\t\t<span [class.chip]=\"props['multiple']\" [class.mod-unkillable]=\"props['multiple']\"\n\t\t\t><span class=\"pr-u-ellipsis\">{{ option.name }}</span></span\n\t\t>\n\t</ng-container>\n\t<lu-option-picker>\n\t\t@for (option of _options; track $index) {\n\t\t\t<lu-option [value]=\"option\"> {{ option.name }} </lu-option>\n\t\t}\n\t</lu-option-picker>\n\t@if (!props.required && !props[\"multiple\"]) {\n\t\t<lu-clear />\n\t}\n</lu-select>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuSelectInputComponent, selector: "lu-select" }, { kind: "ngmodule", type: LuOptionPickerModule }, { kind: "component", type: i3.LuOptionPickerComponent, selector: "lu-option-picker", exportAs: ["LuOptionPicker"] }, { kind: "component", type: i3.LuOptionItemComponent, selector: "lu-option", inputs: ["selected", "highlighted", "value", "disabled"], outputs: ["onSelect"] }, { kind: "directive", type: LuInputDisplayerDirective, selector: "[luDisplayer]", inputs: ["luDisplayerMultiple", "multiple"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["size", "disabled", "palette", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldSelect, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldSelect, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-select', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ReactiveFormsModule, FormlyModule, LuSelectInputComponent, LuOptionPickerModule, LuInputDisplayerDirective, ClearComponent], template: "<lu-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[multiple]=\"props['multiple']\"\n\t[placeholder]=\"props.placeholder\"\n>\n\t<ng-container *luDisplayer=\"let option\">\n\t\t<span [class.chip]=\"props['multiple']\" [class.mod-unkillable]=\"props['multiple']\"\n\t\t\t><span class=\"pr-u-ellipsis\">{{ option.name }}</span></span\n\t\t>\n\t</ng-container>\n\t<lu-option-picker>\n\t\t@for (option of _options; track $index) {\n\t\t\t<lu-option [value]=\"option\"> {{ option.name }} </lu-option>\n\t\t}\n\t</lu-option-picker>\n\t@if (!props.required && !props[\"multiple\"]) {\n\t\t<lu-clear />\n\t}\n</lu-select>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"] }]
         }] });
@@ -166,10 +166,10 @@ class LuFormlyFieldTextarea extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldTextarea, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyFieldTextarea, isStandalone: true, selector: "lu-formly-field-input", usesInheritance: true, ngImport: i0, template: "<textarea\n\tclass=\"textfield-input\"\n\t[name]=\"props['name']\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\tluInput\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n></textarea>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "directive", type: LuInputDirective, selector: "[luInput]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldTextarea, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyFieldTextarea, isStandalone: true, selector: "lu-formly-field-input", usesInheritance: true, ngImport: i0, template: "<textarea\n\tclass=\"textfield-input\"\n\t[name]=\"props['name']\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\tluInput\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n></textarea>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "directive", type: LuInputDirective, selector: "[luInput]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldTextarea, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldTextarea, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-input', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, FormlyModule, LuInputDirective], template: "<textarea\n\tclass=\"textfield-input\"\n\t[name]=\"props['name']\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\tluInput\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n></textarea>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n"] }]
         }] });
@@ -181,10 +181,10 @@ class LuFormlyFieldUser extends FieldType {
     blur() {
         this.props['_isFocused'] = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldUser, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyFieldUser, isStandalone: true, selector: "lu-formly-field-user", usesInheritance: true, ngImport: i0, template: "<lu-user-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuUserSelectInputComponent, selector: "lu-user-select", inputs: ["placeholder", "fields", "filters", "orderBy", "appInstanceId", "operations", "enableFormerEmployees", "disablePrincipal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldUser, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyFieldUser, isStandalone: true, selector: "lu-formly-field-user", usesInheritance: true, ngImport: i0, template: "<lu-user-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: LuUserSelectInputComponent, selector: "lu-user-select", inputs: ["placeholder", "fields", "filters", "orderBy", "appInstanceId", "operations", "enableFormerEmployees", "disablePrincipal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyFieldUser, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyFieldUser, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-field-user', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, FormlyModule, LuUserSelectInputComponent], template: "<lu-user-select\n\tclass=\"textfield-input\"\n\t[formControl]=\"formControl\"\n\t[formlyAttributes]=\"field\"\n\t[multiple]=\"props['multiple']\"\n\t(focus)=\"focus()\"\n\t(blur)=\"blur()\"\n\t[placeholder]=\"props.placeholder\"\n/>\n<span class=\"textfield-label\">{{ props.label }}</span>\n", styles: ["@layer components{:host{inline-size:100%;display:inherit;align-items:inherit;flex-direction:inherit}}\n", "@layer mods{:host-context(.mod-framed) lu-select{display:block}:host-context(.mod-framed) lu-api-select{display:block}:host-context(.mod-framed) lu-user-select{display:block}:host-context(.mod-framed) lu-date-select{display:block}:host-context(.mod-framed) lu-department-select{display:block}}\n"] }]
         }] });
@@ -212,8 +212,8 @@ class LuFormlyErrorMessage {
         }
         return messages;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyErrorMessage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: LuFormlyErrorMessage, isStandalone: true, selector: "lu-formly-error-message", inputs: { formControl: "formControl", field: "field" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyErrorMessage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: LuFormlyErrorMessage, isStandalone: true, selector: "lu-formly-error-message", inputs: { formControl: "formControl", field: "field" }, ngImport: i0, template: `
 		@for (message of errorMessages; track $index) {
 			<div class="textfield-messages-error">
 				{{ message }}
@@ -221,7 +221,7 @@ class LuFormlyErrorMessage {
 		}
 	`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyErrorMessage, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyErrorMessage, decorators: [{
             type: Component,
             args: [{
                     selector: 'lu-formly-error-message',
@@ -244,10 +244,10 @@ class LuFormlyWrapperError extends FieldWrapper {
     get validationId() {
         return this.field.id + '-message';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperError, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: LuFormlyWrapperError, isStandalone: true, selector: "lu-formly-wrapper-error", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #fieldComponent />\n@if (formControl.touched && formControl.invalid) {\n\t<div class=\"textfield-messages\" [id]=\"validationId\">\n\t\t<lu-formly-error-message [formControl]=\"formControl\" [field]=\"field\" />\n\t</div>\n}\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: LuFormlyErrorMessage, selector: "lu-formly-error-message", inputs: ["formControl", "field"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperError, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: LuFormlyWrapperError, isStandalone: true, selector: "lu-formly-wrapper-error", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #fieldComponent />\n@if (formControl.touched && formControl.invalid) {\n\t<div class=\"textfield-messages\" [id]=\"validationId\">\n\t\t<lu-formly-error-message [formControl]=\"formControl\" [field]=\"field\" />\n\t</div>\n}\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: LuFormlyErrorMessage, selector: "lu-formly-error-message", inputs: ["formControl", "field"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperError, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperError, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-wrapper-error', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, LuFormlyErrorMessage], template: "<ng-container #fieldComponent />\n@if (formControl.touched && formControl.invalid) {\n\t<div class=\"textfield-messages\" [id]=\"validationId\">\n\t\t<lu-formly-error-message [formControl]=\"formControl\" [field]=\"field\" />\n\t</div>\n}\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"] }]
         }], propDecorators: { fieldComponent: [{
@@ -258,10 +258,10 @@ const templateErrorExtension = buildAddWrapperExtension('error', (field) => !!fi
 
 // wrapper component
 class LuFormlyWrapperHelper extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperHelper, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyWrapperHelper, isStandalone: true, selector: "lu-formly-wrapper-helper", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #fieldComponent />\n<div class=\"textfield-messages mod-helper\">\n\t<div class=\"textfield-messages-helper\">{{ props[\"helper\"] }}</div>\n</div>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperHelper, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyWrapperHelper, isStandalone: true, selector: "lu-formly-wrapper-helper", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #fieldComponent />\n<div class=\"textfield-messages mod-helper\">\n\t<div class=\"textfield-messages-helper\">{{ props[\"helper\"] }}</div>\n</div>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperHelper, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperHelper, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-wrapper-helper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container #fieldComponent />\n<div class=\"textfield-messages mod-helper\">\n\t<div class=\"textfield-messages-helper\">{{ props[\"helper\"] }}</div>\n</div>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"] }]
         }], propDecorators: { fieldComponent: [{
@@ -272,10 +272,10 @@ const templateHelperExtension = buildAddWrapperExtension('helper', (field) => !!
 
 // wrapper component
 class LuFormlyWrapperIcon extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperIcon, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyWrapperIcon, isStandalone: true, selector: "lu-formly-wrapper-suffix", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #fieldComponent /><span aria-hidden=\"true\" class=\"textfield-suffix mod-icon lucca-icon\">{{ props[\"icon\"] }}</span>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n", "@layer components{:host .textfield-suffix{pointer-events:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperIcon, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyWrapperIcon, isStandalone: true, selector: "lu-formly-wrapper-suffix", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #fieldComponent /><span aria-hidden=\"true\" class=\"textfield-suffix mod-icon lucca-icon\">{{ props[\"icon\"] }}</span>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n", "@layer components{:host .textfield-suffix{pointer-events:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperIcon, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-wrapper-suffix', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container #fieldComponent /><span aria-hidden=\"true\" class=\"textfield-suffix mod-icon lucca-icon\">{{ props[\"icon\"] }}</span>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n", "@layer components{:host .textfield-suffix{pointer-events:none}}\n"] }]
         }], propDecorators: { fieldComponent: [{
@@ -298,10 +298,10 @@ class LuFormlyWrapperRadiosfieldLayout extends FieldWrapper {
     get isError() {
         return this.formControl.invalid && this.formControl.touched ? 'is-error' : '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperRadiosfieldLayout, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyWrapperRadiosfieldLayout, isStandalone: true, selector: "lu-formly-wrapper-radiosfield-layout", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fieldsetWrapper\">\n\t<fieldset class=\"radiosfield\" [class]=\"[mod, isRequired, isFocused, isError]\">\n\t\t<ng-container #fieldComponent />\n\t</fieldset>\n</div>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperRadiosfieldLayout, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyWrapperRadiosfieldLayout, isStandalone: true, selector: "lu-formly-wrapper-radiosfield-layout", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fieldsetWrapper\">\n\t<fieldset class=\"radiosfield\" [class]=\"[mod, isRequired, isFocused, isError]\">\n\t\t<ng-container #fieldComponent />\n\t</fieldset>\n</div>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperRadiosfieldLayout, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperRadiosfieldLayout, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-wrapper-radiosfield-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"fieldsetWrapper\">\n\t<fieldset class=\"radiosfield\" [class]=\"[mod, isRequired, isFocused, isError]\">\n\t\t<ng-container #fieldComponent />\n\t</fieldset>\n</div>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"] }]
         }], propDecorators: { fieldComponent: [{
@@ -311,10 +311,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
 
 // wrapper component
 class LuFormlyWrapperSuffix extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperSuffix, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyWrapperSuffix, isStandalone: true, selector: "lu-formly-wrapper-suffix", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #fieldComponent /><span class=\"textfield-suffix\">{{ props[\"suffix\"] }}</span>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n", "@layer components{:host .textfield-suffix{pointer-events:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperSuffix, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyWrapperSuffix, isStandalone: true, selector: "lu-formly-wrapper-suffix", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #fieldComponent /><span class=\"textfield-suffix\">{{ props[\"suffix\"] }}</span>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n", "@layer components{:host .textfield-suffix{pointer-events:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperSuffix, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperSuffix, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-wrapper-suffix', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container #fieldComponent /><span class=\"textfield-suffix\">{{ props[\"suffix\"] }}</span>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n", "@layer components{:host .textfield-suffix{pointer-events:none}}\n"] }]
         }], propDecorators: { fieldComponent: [{
@@ -346,10 +346,10 @@ class LuFormlyWrapperTextfieldLayout extends FieldWrapper {
     get isError() {
         return this.formControl.invalid && this.formControl.touched ? 'is-error' : '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperTextfieldLayout, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyWrapperTextfieldLayout, isStandalone: true, selector: "lu-formly-wrapper-layout", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<label class=\"textfield\" [class]=\"[mod, modWithSuffix, modMultiline, isRequired, isFocused, isError, isDisabled]\">\n\t<ng-container #fieldComponent />\n</label>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperTextfieldLayout, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyWrapperTextfieldLayout, isStandalone: true, selector: "lu-formly-wrapper-layout", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<label class=\"textfield\" [class]=\"[mod, modWithSuffix, modMultiline, isRequired, isFocused, isError, isDisabled]\">\n\t<ng-container #fieldComponent />\n</label>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperTextfieldLayout, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperTextfieldLayout, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-wrapper-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<label class=\"textfield\" [class]=\"[mod, modWithSuffix, modMultiline, isRequired, isFocused, isError, isDisabled]\">\n\t<ng-container #fieldComponent />\n</label>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"] }]
         }], propDecorators: { fieldComponent: [{
@@ -371,10 +371,10 @@ class LuFormlyWrapperCheckboxLayout extends FieldWrapper {
     get isError() {
         return this.formControl.invalid && this.formControl.touched ? 'is-error' : '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperCheckboxLayout, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: LuFormlyWrapperCheckboxLayout, isStandalone: true, selector: "lu-formly-wrapper-checkbox-layout", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fieldsetWrapper\">\n\t<fieldset class=\"checkboxesfield\" [class]=\"[mod, isRequired, isFocused, isError]\">\n\t\t<ng-container #fieldComponent />\n\t</fieldset>\n</div>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperCheckboxLayout, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuFormlyWrapperCheckboxLayout, isStandalone: true, selector: "lu-formly-wrapper-checkbox-layout", viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fieldsetWrapper\">\n\t<fieldset class=\"checkboxesfield\" [class]=\"[mod, isRequired, isFocused, isError]\">\n\t\t<ng-container #fieldComponent />\n\t</fieldset>\n</div>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyWrapperCheckboxLayout, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyWrapperCheckboxLayout, decorators: [{
             type: Component,
             args: [{ selector: 'lu-formly-wrapper-checkbox-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"fieldsetWrapper\">\n\t<fieldset class=\"checkboxesfield\" [class]=\"[mod, isRequired, isFocused, isError]\">\n\t\t<ng-container #fieldComponent />\n\t</fieldset>\n</div>\n", styles: ["@layer components{:host{display:inherit;flex-direction:inherit;flex:1 1 auto;inline-size:100%}}\n"] }]
         }], propDecorators: { fieldComponent: [{
@@ -461,11 +461,11 @@ function provideLuFormly() {
  * @deprecated use provideLuFormly() in a lazy loaded route (and stop using formly please)
  * */
 class LuFormlyModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyModule }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyModule, providers: [provideLuFormly()] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyModule, providers: [provideLuFormly()] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: LuFormlyModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuFormlyModule, decorators: [{
             type: NgModule,
             args: [{
                     providers: [provideLuFormly()],

package/fesm2022/lucca-front-ng-forms-phone-number-input.mjs

@@ -1,10 +1,9 @@
 import * as i0 from '@angular/core';
-import { inject, LOCALE_ID, input, output, computed, signal, forwardRef, ChangeDetectionStrategy, ViewEncapsulation, Component, Pipe } from '@angular/core';
+import { inject, LOCALE_ID, input, output, signal, computed, forwardRef, ChangeDetectionStrategy, ViewEncapsulation, Component, Pipe } from '@angular/core';
 import * as i1 from '@angular/forms';
 import { FormsModule, NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
 import { LuDisplayerDirective, LuOptionDirective } from '@lucca-front/ng/core-select';
-import { InputDirective, FormFieldComponent } from '@lucca-front/ng/form-field';
-import { TextInputComponent } from '@lucca-front/ng/forms';
+import { InputDirective, ɵPresentationDisplayDefaultDirective as _PresentationDisplayDefaultDirective } from '@lucca-front/ng/form-field';
 import { LuSimpleSelectInputComponent } from '@lucca-front/ng/simple-select';
 import { validatePhoneNumberLength, isValidPhoneNumber, parsePhoneNumber, getCountries, getCountryCallingCode, getExampleNumber, formatIncompletePhoneNumber } from 'libphonenumber-js';
 import examples from 'libphonenumber-js/mobile/examples';
@@ -57,6 +56,7 @@ class PhoneNumberInputComponent {
         this.noAutoPlaceholder = input(false, ...(ngDevMode ? [{ debugName: "noAutoPlaceholder" }] : []));
         this.defaultCountryCode = input(undefined, { ...(ngDevMode ? { debugName: "defaultCountryCode" } : {}), alias: 'country' });
         this.countryChange = output();
+        this.currentValue = signal('', ...(ngDevMode ? [{ debugName: "currentValue" }] : []));
         this.disabled = false;
         this.#displayNames = new Intl.DisplayNames(this.#locale, { type: 'region' });
         this.prefixEntries = getCountries()
@@ -65,7 +65,7 @@ class PhoneNumberInputComponent {
             prefix: getCountryCallingCode(country),
             name: this.#displayNames.of(country),
         }))
-            .sort((a, b) => a.name.localeCompare(b.name));
+            .sort((a, b) => a.name?.localeCompare(b.name));
         this.#prefixEntries = computed(() => {
             const whitelist = this.allowedCountries();
             if (whitelist.length === 0) {
@@ -80,7 +80,7 @@ class PhoneNumberInputComponent {
                 return this.#prefixEntries();
             }
             return this.#prefixEntries().filter((entry) => {
-                return entry.country.toLowerCase().includes(query.toLowerCase()) || `+${entry.prefix}`.includes(query) || entry.name.toLowerCase().includes(query.toLowerCase());
+                return entry.country.toLowerCase().includes(query.toLowerCase()) || `+${entry.prefix}`.includes(query) || entry.name?.toLowerCase().includes(query.toLowerCase());
             });
         }, ...(ngDevMode ? [{ debugName: "prefixesDisplay" }] : []));
         this.countryCodeSelected = signal(undefined, ...(ngDevMode ? [{ debugName: "countryCodeSelected" }] : []));
@@ -116,6 +116,7 @@ class PhoneNumberInputComponent {
         catch {
             this.displayedNumber.set(value);
         }
+        this.currentValue.set(value);
         this.formatNationalNumber();
     }
     registerOnChange(fn) {
@@ -176,8 +177,8 @@ class PhoneNumberInputComponent {
     validate(control) {
         return PhoneNumberValidators.validPhoneNumber(control, this.countryCode());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PhoneNumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.6", type: PhoneNumberInputComponent, isStandalone: true, selector: "lu-phone-number-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, allowedCountries: { classPropertyName: "allowedCountries", publicName: "allowedCountries", isSignal: true, isRequired: false, transformFunction: null }, noAutoPlaceholder: { classPropertyName: "noAutoPlaceholder", publicName: "noAutoPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, defaultCountryCode: { classPropertyName: "defaultCountryCode", publicName: "country", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { countryChange: "countryChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PhoneNumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.8", type: PhoneNumberInputComponent, isStandalone: true, selector: "lu-phone-number-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, allowedCountries: { classPropertyName: "allowedCountries", publicName: "allowedCountries", isSignal: true, isRequired: false, transformFunction: null }, noAutoPlaceholder: { classPropertyName: "noAutoPlaceholder", publicName: "noAutoPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, defaultCountryCode: { classPropertyName: "defaultCountryCode", publicName: "country", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { countryChange: "countryChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => PhoneNumberInputComponent),
@@ -188,11 +189,11 @@ class PhoneNumberInputComponent {
                 useExisting: forwardRef(() => PhoneNumberInputComponent),
                 multi: true,
             },
-        ], ngImport: i0, template: "<fieldset [disabled]=\"disabled\" class=\"phoneNumber-fieldset\">\n\t<legend>\n\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t</legend>\n\t<label>\n\t\t<span class=\"pr-u-mask\">Prefix</span>\n\t\t<lu-simple-select\n\t\t\t[options]=\"prefixesDisplay()\"\n\t\t\t[ngModel]=\"prefixEntry()\"\n\t\t\t(ngModelChange)=\"updatePrefix($event)\"\n\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t[optionKey]=\"getPrefixKey\"\n\t\t\t[optionComparer]=\"prefixComparator\"\n\t\t\t(clueChange)=\"query.set($event)\"\n\t\t\tnoClueIcon\n\t\t\t#selectRef\n\t\t\tclass=\"phoneNumber-fieldset-select\"\n\t\t\t[autocomplete]=\"autocomplete() ? (autocomplete() === 'off' ? 'off' : 'tel-country-code') : null\"\n\t\t>\n\t\t\t<ng-container *luOption=\"let prefixOption; select: selectRef\"\n\t\t\t\t><img class=\"phoneNumber-option-flag\" src=\"https://cdn.lucca.fr/assets/misc/flags/{{ prefixOption.country }}.svg\" alt=\"\" />{{\n\t\t\t\t\tprefixOption.name\n\t\t\t\t}}\n\t\t\t\t(+{{ prefixOption.prefix }})\n\t\t\t</ng-container>\n\t\t\t<ng-container *luDisplayer=\"let prefixOption; select: selectRef\"\n\t\t\t\t><img\n\t\t\t\t\tsrc=\"https://cdn.lucca.fr/assets/misc/flags/{{ prefixOption.country }}.svg\"\n\t\t\t\t\talt=\"{{ prefixOption.country }} +{{ prefixOption.prefix }}\"\n\t\t\t\t\tclass=\"phoneNumber-countryCode-flag\"\n\t\t\t\t/>\n\t\t\t</ng-container>\n\t\t</lu-simple-select>\n\t</label>\n\t<label for=\"phoneNumberFieldsetTextfieldInput\" class=\"pr-u-mask\">Number</label>\n\t<div class=\"textField phoneNumber-fieldset-textfield\">\n\t\t<div class=\"textField-input\">\n\t\t\t<input\n\t\t\t\ttype=\"text\"\n\t\t\t\tid=\"phoneNumberFieldsetTextfieldInput\"\n\t\t\t\t[ngModel]=\"displayedNumber()\"\n\t\t\t\t(ngModelChange)=\"updateNumber($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t(blur)=\"touched(); formatNationalNumber()\"\n\t\t\t\tluInput\n\t\t\t\tluInputStandalone\n\t\t\t\tclass=\"textField-input-value\"\n\t\t\t\t[attr.autocomplete]=\"autocomplete() ? (autocomplete() === 'off' ? 'off' : 'tel-national') : null\"\n\t\t\t\t[placeholder]=\"placeholder()\"\n\t\t\t/>\n\t\t</div>\n\t</div>\n</fieldset>\n", styles: ["@layer components{.phoneNumber-fieldset{border:0;padding:0;gap:var(--pr-t-spacings-100);inline-size:17.5rem;display:flex}.phoneNumber-fieldset-select .simpleSelect-field-input{inline-size:21px}.phoneNumber-fieldset-textfield{flex-grow:1}.phoneNumber-option-flag{vertical-align:top;margin-block-start:var(--pr-t-spacings-50);margin-inline-end:var(--pr-t-spacings-100)}.phoneNumber-countryCode-flag{display:block}}\n"], dependencies: [{ kind: "component", type: LuSimpleSelectInputComponent, selector: "lu-simple-select", inputs: ["autocomplete"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: LuDisplayerDirective, selector: "[luDisplayer]", inputs: ["luDisplayerSelect"] }, { kind: "directive", type: LuOptionDirective, selector: "[luOption]", inputs: ["luOptionSelect"] }, { kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], ngImport: i0, template: "<fieldset [disabled]=\"disabled\" class=\"phoneNumber-fieldset\">\n\t<legend>\n\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t</legend>\n\t<label>\n\t\t<span class=\"pr-u-mask\">Prefix</span>\n\t\t<lu-simple-select\n\t\t\tignorePresentation\n\t\t\t[options]=\"prefixesDisplay()\"\n\t\t\t[ngModel]=\"prefixEntry()\"\n\t\t\t(ngModelChange)=\"updatePrefix($event)\"\n\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t[optionKey]=\"getPrefixKey\"\n\t\t\t[optionComparer]=\"prefixComparator\"\n\t\t\t(clueChange)=\"query.set($event)\"\n\t\t\tnoClueIcon\n\t\t\t#selectRef\n\t\t\tclass=\"phoneNumber-fieldset-select\"\n\t\t\t[autocomplete]=\"autocomplete() ? (autocomplete() === 'off' ? 'off' : 'tel-country-code') : null\"\n\t\t>\n\t\t\t<ng-container *luOption=\"let prefixOption; select: selectRef\"\n\t\t\t\t><img class=\"phoneNumber-option-flag\" src=\"https://cdn.lucca.fr/assets/misc/flags/{{ prefixOption.country }}.svg\" alt=\"\" />{{\n\t\t\t\t\tprefixOption.name\n\t\t\t\t}}\n\t\t\t\t(+{{ prefixOption.prefix }})\n\t\t\t</ng-container>\n\t\t\t<ng-container *luDisplayer=\"let prefixOption; select: selectRef\"\n\t\t\t\t><img\n\t\t\t\t\tsrc=\"https://cdn.lucca.fr/assets/misc/flags/{{ prefixOption.country }}.svg\"\n\t\t\t\t\talt=\"{{ prefixOption.country }} +{{ prefixOption.prefix }}\"\n\t\t\t\t\tclass=\"phoneNumber-countryCode-flag\"\n\t\t\t\t/>\n\t\t\t</ng-container>\n\t\t</lu-simple-select>\n\t</label>\n\t<label for=\"phoneNumberFieldsetTextfieldInput\" class=\"pr-u-mask\">Number</label>\n\t<div class=\"textField phoneNumber-fieldset-textfield\">\n\t\t<div class=\"textField-input\">\n\t\t\t<input\n\t\t\t\ttype=\"text\"\n\t\t\t\tid=\"phoneNumberFieldsetTextfieldInput\"\n\t\t\t\t[ngModel]=\"displayedNumber()\"\n\t\t\t\t(ngModelChange)=\"updateNumber($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t(blur)=\"touched(); formatNationalNumber()\"\n\t\t\t\tluInput\n\t\t\t\tluInputStandalone\n\t\t\t\tclass=\"textField-input-value\"\n\t\t\t\t[attr.autocomplete]=\"autocomplete() ? (autocomplete() === 'off' ? 'off' : 'tel-national') : null\"\n\t\t\t\t[placeholder]=\"placeholder()\"\n\t\t\t/>\n\t\t</div>\n\t</div>\n</fieldset>\n\n<ng-container *luPresentationDisplayDefault>\n\t<a class=\"formPresentation-description-definition-link\" href=\"tel:{{ currentValue() }}\">{{ currentValue() }}</a>\n</ng-container>\n", styles: ["@layer components{.phoneNumber-fieldset{border:0;padding:0;gap:var(--pr-t-spacings-100);inline-size:17.5rem;display:flex}.phoneNumber-fieldset-select .simpleSelect-field-input{inline-size:21px}.phoneNumber-fieldset-textfield{flex-grow:1}.phoneNumber-option-flag{vertical-align:top;margin-block-start:var(--pr-t-spacings-50);margin-inline-end:var(--pr-t-spacings-100)}.phoneNumber-countryCode-flag{display:block}}\n"], dependencies: [{ kind: "component", type: LuSimpleSelectInputComponent, selector: "lu-simple-select", inputs: ["autocomplete"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: LuDisplayerDirective, selector: "[luDisplayer]", inputs: ["luDisplayerSelect"] }, { kind: "directive", type: LuOptionDirective, selector: "[luOption]", inputs: ["luOptionSelect"] }, { kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }, { kind: "directive", type: _PresentationDisplayDefaultDirective, selector: "[luPresentationDisplayDefault]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PhoneNumberInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PhoneNumberInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lu-phone-number-input', imports: [LuSimpleSelectInputComponent, TextInputComponent, FormsModule, LuDisplayerDirective, LuOptionDirective, InputDirective, FormFieldComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+            args: [{ selector: 'lu-phone-number-input', imports: [LuSimpleSelectInputComponent, FormsModule, LuDisplayerDirective, LuOptionDirective, InputDirective, _PresentationDisplayDefaultDirective], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => PhoneNumberInputComponent),
@@ -203,7 +204,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
                             useExisting: forwardRef(() => PhoneNumberInputComponent),
                             multi: true,
                         },
-                    ], template: "<fieldset [disabled]=\"disabled\" class=\"phoneNumber-fieldset\">\n\t<legend>\n\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t</legend>\n\t<label>\n\t\t<span class=\"pr-u-mask\">Prefix</span>\n\t\t<lu-simple-select\n\t\t\t[options]=\"prefixesDisplay()\"\n\t\t\t[ngModel]=\"prefixEntry()\"\n\t\t\t(ngModelChange)=\"updatePrefix($event)\"\n\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t[optionKey]=\"getPrefixKey\"\n\t\t\t[optionComparer]=\"prefixComparator\"\n\t\t\t(clueChange)=\"query.set($event)\"\n\t\t\tnoClueIcon\n\t\t\t#selectRef\n\t\t\tclass=\"phoneNumber-fieldset-select\"\n\t\t\t[autocomplete]=\"autocomplete() ? (autocomplete() === 'off' ? 'off' : 'tel-country-code') : null\"\n\t\t>\n\t\t\t<ng-container *luOption=\"let prefixOption; select: selectRef\"\n\t\t\t\t><img class=\"phoneNumber-option-flag\" src=\"https://cdn.lucca.fr/assets/misc/flags/{{ prefixOption.country }}.svg\" alt=\"\" />{{\n\t\t\t\t\tprefixOption.name\n\t\t\t\t}}\n\t\t\t\t(+{{ prefixOption.prefix }})\n\t\t\t</ng-container>\n\t\t\t<ng-container *luDisplayer=\"let prefixOption; select: selectRef\"\n\t\t\t\t><img\n\t\t\t\t\tsrc=\"https://cdn.lucca.fr/assets/misc/flags/{{ prefixOption.country }}.svg\"\n\t\t\t\t\talt=\"{{ prefixOption.country }} +{{ prefixOption.prefix }}\"\n\t\t\t\t\tclass=\"phoneNumber-countryCode-flag\"\n\t\t\t\t/>\n\t\t\t</ng-container>\n\t\t</lu-simple-select>\n\t</label>\n\t<label for=\"phoneNumberFieldsetTextfieldInput\" class=\"pr-u-mask\">Number</label>\n\t<div class=\"textField phoneNumber-fieldset-textfield\">\n\t\t<div class=\"textField-input\">\n\t\t\t<input\n\t\t\t\ttype=\"text\"\n\t\t\t\tid=\"phoneNumberFieldsetTextfieldInput\"\n\t\t\t\t[ngModel]=\"displayedNumber()\"\n\t\t\t\t(ngModelChange)=\"updateNumber($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t(blur)=\"touched(); formatNationalNumber()\"\n\t\t\t\tluInput\n\t\t\t\tluInputStandalone\n\t\t\t\tclass=\"textField-input-value\"\n\t\t\t\t[attr.autocomplete]=\"autocomplete() ? (autocomplete() === 'off' ? 'off' : 'tel-national') : null\"\n\t\t\t\t[placeholder]=\"placeholder()\"\n\t\t\t/>\n\t\t</div>\n\t</div>\n</fieldset>\n", styles: ["@layer components{.phoneNumber-fieldset{border:0;padding:0;gap:var(--pr-t-spacings-100);inline-size:17.5rem;display:flex}.phoneNumber-fieldset-select .simpleSelect-field-input{inline-size:21px}.phoneNumber-fieldset-textfield{flex-grow:1}.phoneNumber-option-flag{vertical-align:top;margin-block-start:var(--pr-t-spacings-50);margin-inline-end:var(--pr-t-spacings-100)}.phoneNumber-countryCode-flag{display:block}}\n"] }]
+                    ], template: "<fieldset [disabled]=\"disabled\" class=\"phoneNumber-fieldset\">\n\t<legend>\n\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t</legend>\n\t<label>\n\t\t<span class=\"pr-u-mask\">Prefix</span>\n\t\t<lu-simple-select\n\t\t\tignorePresentation\n\t\t\t[options]=\"prefixesDisplay()\"\n\t\t\t[ngModel]=\"prefixEntry()\"\n\t\t\t(ngModelChange)=\"updatePrefix($event)\"\n\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t[optionKey]=\"getPrefixKey\"\n\t\t\t[optionComparer]=\"prefixComparator\"\n\t\t\t(clueChange)=\"query.set($event)\"\n\t\t\tnoClueIcon\n\t\t\t#selectRef\n\t\t\tclass=\"phoneNumber-fieldset-select\"\n\t\t\t[autocomplete]=\"autocomplete() ? (autocomplete() === 'off' ? 'off' : 'tel-country-code') : null\"\n\t\t>\n\t\t\t<ng-container *luOption=\"let prefixOption; select: selectRef\"\n\t\t\t\t><img class=\"phoneNumber-option-flag\" src=\"https://cdn.lucca.fr/assets/misc/flags/{{ prefixOption.country }}.svg\" alt=\"\" />{{\n\t\t\t\t\tprefixOption.name\n\t\t\t\t}}\n\t\t\t\t(+{{ prefixOption.prefix }})\n\t\t\t</ng-container>\n\t\t\t<ng-container *luDisplayer=\"let prefixOption; select: selectRef\"\n\t\t\t\t><img\n\t\t\t\t\tsrc=\"https://cdn.lucca.fr/assets/misc/flags/{{ prefixOption.country }}.svg\"\n\t\t\t\t\talt=\"{{ prefixOption.country }} +{{ prefixOption.prefix }}\"\n\t\t\t\t\tclass=\"phoneNumber-countryCode-flag\"\n\t\t\t\t/>\n\t\t\t</ng-container>\n\t\t</lu-simple-select>\n\t</label>\n\t<label for=\"phoneNumberFieldsetTextfieldInput\" class=\"pr-u-mask\">Number</label>\n\t<div class=\"textField phoneNumber-fieldset-textfield\">\n\t\t<div class=\"textField-input\">\n\t\t\t<input\n\t\t\t\ttype=\"text\"\n\t\t\t\tid=\"phoneNumberFieldsetTextfieldInput\"\n\t\t\t\t[ngModel]=\"displayedNumber()\"\n\t\t\t\t(ngModelChange)=\"updateNumber($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t(blur)=\"touched(); formatNationalNumber()\"\n\t\t\t\tluInput\n\t\t\t\tluInputStandalone\n\t\t\t\tclass=\"textField-input-value\"\n\t\t\t\t[attr.autocomplete]=\"autocomplete() ? (autocomplete() === 'off' ? 'off' : 'tel-national') : null\"\n\t\t\t\t[placeholder]=\"placeholder()\"\n\t\t\t/>\n\t\t</div>\n\t</div>\n</fieldset>\n\n<ng-container *luPresentationDisplayDefault>\n\t<a class=\"formPresentation-description-definition-link\" href=\"tel:{{ currentValue() }}\">{{ currentValue() }}</a>\n</ng-container>\n", styles: ["@layer components{.phoneNumber-fieldset{border:0;padding:0;gap:var(--pr-t-spacings-100);inline-size:17.5rem;display:flex}.phoneNumber-fieldset-select .simpleSelect-field-input{inline-size:21px}.phoneNumber-fieldset-textfield{flex-grow:1}.phoneNumber-option-flag{vertical-align:top;margin-block-start:var(--pr-t-spacings-50);margin-inline-end:var(--pr-t-spacings-100)}.phoneNumber-countryCode-flag{display:block}}\n"] }]
         }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], allowedCountries: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowedCountries", required: false }] }], noAutoPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "noAutoPlaceholder", required: false }] }], defaultCountryCode: [{ type: i0.Input, args: [{ isSignal: true, alias: "country", required: false }] }], countryChange: [{ type: i0.Output, args: ["countryChange"] }] } });
 
 class PhoneNumberFormatter {
@@ -216,10 +217,10 @@ class PhoneNumberFormatPipe {
     transform(value, format = 'NATIONAL') {
         return PhoneNumberFormatter.format(value, format);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PhoneNumberFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.6", ngImport: i0, type: PhoneNumberFormatPipe, isStandalone: true, name: "luPhoneNumberFormat" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PhoneNumberFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.8", ngImport: i0, type: PhoneNumberFormatPipe, isStandalone: true, name: "luPhoneNumberFormat" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PhoneNumberFormatPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: PhoneNumberFormatPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'luPhoneNumberFormat',