@siemens/element-ng 49.11.0 → 49.13.0

package/fesm2022/siemens-element-ng-formly.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { viewChild, model, input, output, computed, inject, Component, Pipe, ChangeDetectionStrategy, Directive, NgModule } from '@angular/core';
+import { viewChild, model, input, output, computed, inject, ChangeDetectionStrategy, Component, Pipe, Directive, NgModule } from '@angular/core';
 import * as i1$2 from '@angular/forms';
 import { FormGroup, ReactiveFormsModule, FormsModule } from '@angular/forms';
 import * as i1$1 from '@ngx-formly/core';
@@ -116,11 +116,11 @@ class SiFormlyComponent {
         apply(formlyFieldConfig);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiFormlyComponent, isStandalone: false, selector: "si-formly", inputs: { form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, schema: { classPropertyName: "schema", publicName: "schema", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null }, labelWidth: { classPropertyName: "labelWidth", publicName: "labelWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { form: "formChange", model: "modelChange", schema: "schemaChange", fieldsChange: "fieldsChange" }, viewQueries: [{ propertyName: "formlyForm", first: true, predicate: FormlyForm, descendants: true, isSignal: true }], ngImport: i0, template: "@let formlyForm = form();\n@let formlyFieldConfig = fieldConfig();\n@let formlyFormOptions = options();\n@if (formlyForm && formlyFieldConfig) {\n  @if (ownForm) {\n    <form [formGroup]=\"formlyForm\">\n      <si-form-container [form]=\"formlyForm\">\n        <div si-form-container-content>\n          <ng-container *ngTemplateOutlet=\"formlytmpl\" />\n        </div>\n      </si-form-container>\n    </form>\n  } @else {\n    <ng-container *ngTemplateOutlet=\"formlytmpl\" />\n  }\n\n  <ng-template #formlytmpl>\n    <formly-form\n      [fields]=\"formlyFieldConfig\"\n      [options]=\"formlyFormOptions\"\n      [form]=\"formlyForm\"\n      [(model)]=\"model\"\n    />\n  </ng-template>\n}\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1$1.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4.SiFormContainerComponent, selector: "si-form-container", inputs: ["form", "readonly", "contentContainerBreakpoints", "disableContainerBreakpoints", "errorCodeTranslateKeyMap", "controlNameTranslateKeyMap", "disableErrorPrinting", "labelWidth"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiFormlyComponent, isStandalone: false, selector: "si-formly", inputs: { form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, schema: { classPropertyName: "schema", publicName: "schema", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null }, labelWidth: { classPropertyName: "labelWidth", publicName: "labelWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { form: "formChange", model: "modelChange", schema: "schemaChange", fieldsChange: "fieldsChange" }, viewQueries: [{ propertyName: "formlyForm", first: true, predicate: FormlyForm, descendants: true, isSignal: true }], ngImport: i0, template: "@let formlyForm = form();\n@let formlyFieldConfig = fieldConfig();\n@let formlyFormOptions = options();\n@if (formlyForm && formlyFieldConfig) {\n  @if (ownForm) {\n    <form [formGroup]=\"formlyForm\">\n      <si-form-container [form]=\"formlyForm\">\n        <div si-form-container-content>\n          <ng-container *ngTemplateOutlet=\"formlytmpl\" />\n        </div>\n      </si-form-container>\n    </form>\n  } @else {\n    <ng-container *ngTemplateOutlet=\"formlytmpl\" />\n  }\n\n  <ng-template #formlytmpl>\n    <formly-form\n      [fields]=\"formlyFieldConfig\"\n      [options]=\"formlyFormOptions\"\n      [form]=\"formlyForm\"\n      [(model)]=\"model\"\n    />\n  </ng-template>\n}\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1$1.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4.SiFormContainerComponent, selector: "si-form-container", inputs: ["form", "readonly", "contentContainerBreakpoints", "disableContainerBreakpoints", "errorCodeTranslateKeyMap", "controlNameTranslateKeyMap", "disableErrorPrinting", "labelWidth"] }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-formly', standalone: false, template: "@let formlyForm = form();\n@let formlyFieldConfig = fieldConfig();\n@let formlyFormOptions = options();\n@if (formlyForm && formlyFieldConfig) {\n  @if (ownForm) {\n    <form [formGroup]=\"formlyForm\">\n      <si-form-container [form]=\"formlyForm\">\n        <div si-form-container-content>\n          <ng-container *ngTemplateOutlet=\"formlytmpl\" />\n        </div>\n      </si-form-container>\n    </form>\n  } @else {\n    <ng-container *ngTemplateOutlet=\"formlytmpl\" />\n  }\n\n  <ng-template #formlytmpl>\n    <formly-form\n      [fields]=\"formlyFieldConfig\"\n      [options]=\"formlyFormOptions\"\n      [form]=\"formlyForm\"\n      [(model)]=\"model\"\n    />\n  </ng-template>\n}\n" }]
+            args: [{ selector: 'si-formly', standalone: false, changeDetection: ChangeDetectionStrategy.Default, template: "@let formlyForm = form();\n@let formlyFieldConfig = fieldConfig();\n@let formlyFormOptions = options();\n@if (formlyForm && formlyFieldConfig) {\n  @if (ownForm) {\n    <form [formGroup]=\"formlyForm\">\n      <si-form-container [form]=\"formlyForm\">\n        <div si-form-container-content>\n          <ng-container *ngTemplateOutlet=\"formlytmpl\" />\n        </div>\n      </si-form-container>\n    </form>\n  } @else {\n    <ng-container *ngTemplateOutlet=\"formlytmpl\" />\n  }\n\n  <ng-template #formlytmpl>\n    <formly-form\n      [fields]=\"formlyFieldConfig\"\n      [options]=\"formlyFormOptions\"\n      [form]=\"formlyForm\"\n      [(model)]=\"model\"\n    />\n  </ng-template>\n}\n" }]
         }], propDecorators: { formlyForm: [{ type: i0.ViewChild, args: [i0.forwardRef(() => FormlyForm), { isSignal: true }] }], form: [{ type: i0.Input, args: [{ isSignal: true, alias: "form", required: false }] }, { type: i0.Output, args: ["formChange"] }], model: [{ type: i0.Input, args: [{ isSignal: true, alias: "model", required: false }] }, { type: i0.Output, args: ["modelChange"] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], schema: [{ type: i0.Input, args: [{ isSignal: true, alias: "schema", required: false }] }, { type: i0.Output, args: ["schemaChange"] }], fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: false }] }], fieldsChange: [{ type: i0.Output, args: ["fieldsChange"] }], labelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelWidth", required: false }] }] } });
 
 /**
@@ -165,11 +165,11 @@ class SiFormlyButtonComponent extends FieldType {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyButtonComponent, isStandalone: true, selector: "si-formly-button", usesInheritance: true, ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"btn\"\n  [class]=\"{\n    'btn-secondary': !props.btnType || props.btnType === 'secondary',\n    'btn-primary': props.btnType === 'primary',\n    'btn-tertiary': props.btnType === 'tertiary',\n    'btn-warning': props.btnType === 'warning',\n    'btn-danger': props.btnType === 'danger'\n  }\"\n  [id]=\"id\"\n  [formlyAttributes]=\"field\"\n  [hidden]=\"props.hidden\"\n  (click)=\"click()\"\n  >{{ props.label | translate }}</button\n>\n", dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyButtonComponent, isStandalone: true, selector: "si-formly-button", usesInheritance: true, ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"btn\"\n  [class]=\"{\n    'btn-secondary': !props.btnType || props.btnType === 'secondary',\n    'btn-primary': props.btnType === 'primary',\n    'btn-tertiary': props.btnType === 'tertiary',\n    'btn-warning': props.btnType === 'warning',\n    'btn-danger': props.btnType === 'danger'\n  }\"\n  [id]=\"id\"\n  [formlyAttributes]=\"field\"\n  [hidden]=\"props.hidden\"\n  (click)=\"click()\"\n  >{{ props.label | translate }}</button\n>\n", dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-formly-button', imports: [SiTranslatePipe, FormlyModule], template: "<button\n  type=\"button\"\n  class=\"btn\"\n  [class]=\"{\n    'btn-secondary': !props.btnType || props.btnType === 'secondary',\n    'btn-primary': props.btnType === 'primary',\n    'btn-tertiary': props.btnType === 'tertiary',\n    'btn-warning': props.btnType === 'warning',\n    'btn-danger': props.btnType === 'danger'\n  }\"\n  [id]=\"id\"\n  [formlyAttributes]=\"field\"\n  [hidden]=\"props.hidden\"\n  (click)=\"click()\"\n  >{{ props.label | translate }}</button\n>\n" }]
+            args: [{ selector: 'si-formly-button', imports: [SiTranslatePipe, FormlyModule], changeDetection: ChangeDetectionStrategy.Default, template: "<button\n  type=\"button\"\n  class=\"btn\"\n  [class]=\"{\n    'btn-secondary': !props.btnType || props.btnType === 'secondary',\n    'btn-primary': props.btnType === 'primary',\n    'btn-tertiary': props.btnType === 'tertiary',\n    'btn-warning': props.btnType === 'warning',\n    'btn-danger': props.btnType === 'danger'\n  }\"\n  [id]=\"id\"\n  [formlyAttributes]=\"field\"\n  [hidden]=\"props.hidden\"\n  (click)=\"click()\"\n  >{{ props.label | translate }}</button\n>\n" }]
         }] });
 
 /**
@@ -222,11 +222,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
  */
 class SiFormlyDateRangeComponent extends FieldType {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyDateRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyDateRangeComponent, isStandalone: true, selector: "si-formly-date-range", usesInheritance: true, ngImport: i0, template: "<si-date-range\n  #dateRange\n  [id]=\"id\"\n  [formlyAttributes]=\"field\"\n  [formControl]=\"formControl\"\n  [siDatepickerConfig]=\"props.siDatepickerConfig\"\n  [startDatePlaceholder]=\"props.startDatePlaceholder ?? dateRange.startDatePlaceholder()\"\n  [endDatePlaceholder]=\"props.endDatePlaceholder ?? dateRange.endDatePlaceholder()\"\n  [ariaLabelCalendarButton]=\"props.ariaLabelCalendarButton ?? dateRange.ariaLabelCalendarButton()\"\n  [startTimeLabel]=\"props.startTimeLabel ?? dateRange.startTimeLabel()\"\n  [endTimeLabel]=\"props.endTimeLabel ?? dateRange.endTimeLabel()\"\n  [required]=\"props.required ?? false\"\n  [readonly]=\"props.readonly ?? dateRange.readonly()\"\n  [autoClose]=\"props.autoClose ?? dateRange.autoClose()\"\n  [errormessageId]=\"id | siValidationErrorId\"\n/>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: SiDateRangeComponent, selector: "si-date-range", inputs: ["id", "siDatepickerConfig", "startDatePlaceholder", "endDatePlaceholder", "ariaLabelCalendarButton", "startTimeLabel", "endTimeLabel", "autoClose", "disabled", "readonly", "value", "errormessageId"], outputs: ["siDatepickerConfigChange", "siDatepickerRangeChange", "disabledTimeChange", "valueChange"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyDateRangeComponent, isStandalone: true, selector: "si-formly-date-range", usesInheritance: true, ngImport: i0, template: "<si-date-range\n  #dateRange\n  [id]=\"id\"\n  [formlyAttributes]=\"field\"\n  [formControl]=\"formControl\"\n  [siDatepickerConfig]=\"props.siDatepickerConfig\"\n  [startDatePlaceholder]=\"props.startDatePlaceholder ?? dateRange.startDatePlaceholder()\"\n  [endDatePlaceholder]=\"props.endDatePlaceholder ?? dateRange.endDatePlaceholder()\"\n  [ariaLabelCalendarButton]=\"props.ariaLabelCalendarButton ?? dateRange.ariaLabelCalendarButton()\"\n  [startTimeLabel]=\"props.startTimeLabel ?? dateRange.startTimeLabel()\"\n  [endTimeLabel]=\"props.endTimeLabel ?? dateRange.endTimeLabel()\"\n  [required]=\"props.required ?? false\"\n  [readonly]=\"props.readonly ?? dateRange.readonly()\"\n  [autoClose]=\"props.autoClose ?? dateRange.autoClose()\"\n  [errormessageId]=\"id | siValidationErrorId\"\n/>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: SiDateRangeComponent, selector: "si-date-range", inputs: ["id", "siDatepickerConfig", "startDatePlaceholder", "endDatePlaceholder", "ariaLabelCalendarButton", "startTimeLabel", "endTimeLabel", "autoClose", "disabled", "readonly", "value", "errormessageId"], outputs: ["siDatepickerConfigChange", "siDatepickerRangeChange", "disabledTimeChange", "valueChange"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyDateRangeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-formly-date-range', imports: [ReactiveFormsModule, FormlyModule, SiDateRangeComponent, SiValidationErrorIdPipe], template: "<si-date-range\n  #dateRange\n  [id]=\"id\"\n  [formlyAttributes]=\"field\"\n  [formControl]=\"formControl\"\n  [siDatepickerConfig]=\"props.siDatepickerConfig\"\n  [startDatePlaceholder]=\"props.startDatePlaceholder ?? dateRange.startDatePlaceholder()\"\n  [endDatePlaceholder]=\"props.endDatePlaceholder ?? dateRange.endDatePlaceholder()\"\n  [ariaLabelCalendarButton]=\"props.ariaLabelCalendarButton ?? dateRange.ariaLabelCalendarButton()\"\n  [startTimeLabel]=\"props.startTimeLabel ?? dateRange.startTimeLabel()\"\n  [endTimeLabel]=\"props.endTimeLabel ?? dateRange.endTimeLabel()\"\n  [required]=\"props.required ?? false\"\n  [readonly]=\"props.readonly ?? dateRange.readonly()\"\n  [autoClose]=\"props.autoClose ?? dateRange.autoClose()\"\n  [errormessageId]=\"id | siValidationErrorId\"\n/>\n" }]
+            args: [{ selector: 'si-formly-date-range', imports: [ReactiveFormsModule, FormlyModule, SiDateRangeComponent, SiValidationErrorIdPipe], changeDetection: ChangeDetectionStrategy.Default, template: "<si-date-range\n  #dateRange\n  [id]=\"id\"\n  [formlyAttributes]=\"field\"\n  [formControl]=\"formControl\"\n  [siDatepickerConfig]=\"props.siDatepickerConfig\"\n  [startDatePlaceholder]=\"props.startDatePlaceholder ?? dateRange.startDatePlaceholder()\"\n  [endDatePlaceholder]=\"props.endDatePlaceholder ?? dateRange.endDatePlaceholder()\"\n  [ariaLabelCalendarButton]=\"props.ariaLabelCalendarButton ?? dateRange.ariaLabelCalendarButton()\"\n  [startTimeLabel]=\"props.startTimeLabel ?? dateRange.startTimeLabel()\"\n  [endTimeLabel]=\"props.endTimeLabel ?? dateRange.endTimeLabel()\"\n  [required]=\"props.required ?? false\"\n  [readonly]=\"props.readonly ?? dateRange.readonly()\"\n  [autoClose]=\"props.autoClose ?? dateRange.autoClose()\"\n  [errormessageId]=\"id | siValidationErrorId\"\n/>\n" }]
         }] });
 
 /**
@@ -251,7 +251,7 @@ class SiFormlyDateTimeComponent extends FieldType {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyDateTimeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyDateTimeComponent, isStandalone: true, selector: "si-formly-datetime", usesInheritance: true, ngImport: i0, template: "<si-calendar-button class=\"w-100\">\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siDatepicker\n    [id]=\"id\"\n    [autoClose]=\"props.autoClose\"\n    [placeholder]=\"props.placeholder\"\n    [formControl]=\"formControl\"\n    [siDatepickerConfig]=\"props.dateConfig\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n</si-calendar-button>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: SiCalendarButtonComponent, selector: "si-calendar-button", inputs: ["ariaLabel"] }, { kind: "directive", type: SiDatepickerDirective, selector: "[siDatepicker]", inputs: ["autoClose"], exportAs: ["siDatepicker"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyDateTimeComponent, isStandalone: true, selector: "si-formly-datetime", usesInheritance: true, ngImport: i0, template: "<si-calendar-button class=\"w-100\">\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siDatepicker\n    [id]=\"id\"\n    [autoClose]=\"props.autoClose\"\n    [placeholder]=\"props.placeholder\"\n    [formControl]=\"formControl\"\n    [siDatepickerConfig]=\"props.dateConfig\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n</si-calendar-button>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: SiCalendarButtonComponent, selector: "si-calendar-button", inputs: ["ariaLabel"] }, { kind: "directive", type: SiDatepickerDirective, selector: "[siDatepicker]", inputs: ["autoClose"], exportAs: ["siDatepicker"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyDateTimeComponent, decorators: [{
             type: Component,
@@ -261,7 +261,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
                         SiCalendarButtonComponent,
                         SiDatepickerDirective,
                         SiValidationErrorIdPipe
-                    ], template: "<si-calendar-button class=\"w-100\">\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siDatepicker\n    [id]=\"id\"\n    [autoClose]=\"props.autoClose\"\n    [placeholder]=\"props.placeholder\"\n    [formControl]=\"formControl\"\n    [siDatepickerConfig]=\"props.dateConfig\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n</si-calendar-button>\n" }]
+                    ], changeDetection: ChangeDetectionStrategy.Default, template: "<si-calendar-button class=\"w-100\">\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siDatepicker\n    [id]=\"id\"\n    [autoClose]=\"props.autoClose\"\n    [placeholder]=\"props.placeholder\"\n    [formControl]=\"formControl\"\n    [siDatepickerConfig]=\"props.dateConfig\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n</si-calendar-button>\n" }]
         }] });
 
 /**
@@ -270,11 +270,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
  */
 class SiFormlyEmailComponent extends FieldType {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyEmailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyEmailComponent, isStandalone: true, selector: "si-formly-email", usesInheritance: true, ngImport: i0, template: "<input\n  type=\"email\"\n  class=\"form-control\"\n  [id]=\"id\"\n  [formControl]=\"formControl\"\n  [formlyAttributes]=\"field\"\n  [attr.aria-describedby]=\"id | siValidationErrorId\"\n/>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyEmailComponent, isStandalone: true, selector: "si-formly-email", usesInheritance: true, ngImport: i0, template: "<input\n  type=\"email\"\n  class=\"form-control\"\n  [id]=\"id\"\n  [formControl]=\"formControl\"\n  [formlyAttributes]=\"field\"\n  [attr.aria-describedby]=\"id | siValidationErrorId\"\n/>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyEmailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-formly-email', imports: [FormsModule, ReactiveFormsModule, FormlyModule, SiValidationErrorIdPipe], template: "<input\n  type=\"email\"\n  class=\"form-control\"\n  [id]=\"id\"\n  [formControl]=\"formControl\"\n  [formlyAttributes]=\"field\"\n  [attr.aria-describedby]=\"id | siValidationErrorId\"\n/>\n" }]
+            args: [{ selector: 'si-formly-email', imports: [FormsModule, ReactiveFormsModule, FormlyModule, SiValidationErrorIdPipe], changeDetection: ChangeDetectionStrategy.Default, template: "<input\n  type=\"email\"\n  class=\"form-control\"\n  [id]=\"id\"\n  [formControl]=\"formControl\"\n  [formlyAttributes]=\"field\"\n  [attr.aria-describedby]=\"id | siValidationErrorId\"\n/>\n" }]
         }] });
 
 /**
@@ -283,7 +283,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
  */
 class SiFormlyIpInputComponent extends FieldType {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyIpInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiFormlyIpInputComponent, isStandalone: true, selector: "si-formly-ip-address", usesInheritance: true, ngImport: i0, template: "@if (field.type === 'ipv6') {\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siIpV6\n    [cidr]=\"props.cidr\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [id]=\"id\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  />\n} @else {\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siIpV4\n    [cidr]=\"props.cidr\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [id]=\"id\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  />\n}\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "directive", type: SiIp4InputDirective, selector: "input[siIpV4]", exportAs: ["siIpV4"] }, { kind: "directive", type: SiIp6InputDirective, selector: "input[siIpV6]", exportAs: ["siIpV6"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiFormlyIpInputComponent, isStandalone: true, selector: "si-formly-ip-address", usesInheritance: true, ngImport: i0, template: "@if (field.type === 'ipv6') {\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siIpV6\n    [cidr]=\"props.cidr\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [id]=\"id\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  />\n} @else {\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siIpV4\n    [cidr]=\"props.cidr\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [id]=\"id\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  />\n}\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "directive", type: SiIp4InputDirective, selector: "input[siIpV4]", exportAs: ["siIpV4"] }, { kind: "directive", type: SiIp6InputDirective, selector: "input[siIpV6]", exportAs: ["siIpV6"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyIpInputComponent, decorators: [{
             type: Component,
@@ -293,7 +293,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
                         SiIp4InputDirective,
                         SiIp6InputDirective,
                         SiValidationErrorIdPipe
-                    ], template: "@if (field.type === 'ipv6') {\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siIpV6\n    [cidr]=\"props.cidr\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [id]=\"id\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  />\n} @else {\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siIpV4\n    [cidr]=\"props.cidr\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [id]=\"id\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  />\n}\n" }]
+                    ], changeDetection: ChangeDetectionStrategy.Default, template: "@if (field.type === 'ipv6') {\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siIpV6\n    [cidr]=\"props.cidr\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [id]=\"id\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  />\n} @else {\n  <input\n    type=\"text\"\n    class=\"form-control\"\n    siIpV4\n    [cidr]=\"props.cidr\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [id]=\"id\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  />\n}\n" }]
         }] });
 
 /**
@@ -335,7 +335,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
  */
 class SiFormlySelectComponent extends FieldType {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlySelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiFormlySelectComponent, isStandalone: true, selector: "si-formly-select", usesInheritance: true, ngImport: i0, template: "@if (props.multi) {\n  <si-select\n    #select\n    class=\"form-control\"\n    multi\n    [id]=\"id\"\n    [options]=\"props.optionsList\"\n    [hasFilter]=\"props.hasFilter ?? select.hasFilter()\"\n    [filterPlaceholder]=\"props.filterPlaceholder ?? select.filterPlaceholder()\"\n    [placeholder]=\"props.placeholder ?? select.placeholder()\"\n    [ariaLabel]=\"props.ariaLabel ?? select.ariaLabel()\"\n    [noResultsFoundLabel]=\"props.noResultsFoundLabel ?? select.noResultsFoundLabel()\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n} @else {\n  <si-select\n    #select\n    class=\"form-control\"\n    [id]=\"id\"\n    [options]=\"props.optionsList\"\n    [hasFilter]=\"props.hasFilter ?? select.hasFilter()\"\n    [filterPlaceholder]=\"props.filterPlaceholder ?? select.filterPlaceholder()\"\n    [placeholder]=\"props.placeholder ?? select.placeholder()\"\n    [ariaLabel]=\"props.ariaLabel ?? select.ariaLabel()\"\n    [noResultsFoundLabel]=\"props.noResultsFoundLabel ?? select.noResultsFoundLabel()\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n}\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: SiSelectComponent, selector: "si-select", inputs: ["id", "ariaLabel", "labelledby", "filterPlaceholder", "noResultsFoundLabel", "placeholder", "readonly", "errormessageId", "hasFilter"], outputs: ["openChange"] }, { kind: "directive", type: SiSelectSimpleOptionsDirective, selector: "si-select[options]", inputs: ["options", "optionEqualCheckFn"] }, { kind: "directive", type: SiSelectMultiValueDirective, selector: "si-select[multi]" }, { kind: "directive", type: SiSelectSingleValueDirective, selector: "si-select:not([multi])" }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiFormlySelectComponent, isStandalone: true, selector: "si-formly-select", usesInheritance: true, ngImport: i0, template: "@if (props.multi) {\n  <si-select\n    #select\n    class=\"form-control\"\n    multi\n    [id]=\"id\"\n    [options]=\"props.optionsList\"\n    [hasFilter]=\"props.hasFilter ?? select.hasFilter()\"\n    [filterPlaceholder]=\"props.filterPlaceholder ?? select.filterPlaceholder()\"\n    [placeholder]=\"props.placeholder ?? select.placeholder()\"\n    [ariaLabel]=\"props.ariaLabel ?? select.ariaLabel()\"\n    [noResultsFoundLabel]=\"props.noResultsFoundLabel ?? select.noResultsFoundLabel()\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n} @else {\n  <si-select\n    #select\n    class=\"form-control\"\n    [id]=\"id\"\n    [options]=\"props.optionsList\"\n    [hasFilter]=\"props.hasFilter ?? select.hasFilter()\"\n    [filterPlaceholder]=\"props.filterPlaceholder ?? select.filterPlaceholder()\"\n    [placeholder]=\"props.placeholder ?? select.placeholder()\"\n    [ariaLabel]=\"props.ariaLabel ?? select.ariaLabel()\"\n    [noResultsFoundLabel]=\"props.noResultsFoundLabel ?? select.noResultsFoundLabel()\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n}\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: SiSelectComponent, selector: "si-select", inputs: ["id", "ariaLabel", "labelledby", "filterPlaceholder", "noResultsFoundLabel", "placeholder", "readonly", "errormessageId", "hasFilter"], outputs: ["openChange"] }, { kind: "directive", type: SiSelectSimpleOptionsDirective, selector: "si-select[options]", inputs: ["options", "optionEqualCheckFn"] }, { kind: "directive", type: SiSelectMultiValueDirective, selector: "si-select[multi]" }, { kind: "directive", type: SiSelectSingleValueDirective, selector: "si-select:not([multi])" }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlySelectComponent, decorators: [{
             type: Component,
@@ -348,7 +348,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
                         SiSelectMultiValueDirective,
                         SiSelectSingleValueDirective,
                         SiValidationErrorIdPipe
-                    ], template: "@if (props.multi) {\n  <si-select\n    #select\n    class=\"form-control\"\n    multi\n    [id]=\"id\"\n    [options]=\"props.optionsList\"\n    [hasFilter]=\"props.hasFilter ?? select.hasFilter()\"\n    [filterPlaceholder]=\"props.filterPlaceholder ?? select.filterPlaceholder()\"\n    [placeholder]=\"props.placeholder ?? select.placeholder()\"\n    [ariaLabel]=\"props.ariaLabel ?? select.ariaLabel()\"\n    [noResultsFoundLabel]=\"props.noResultsFoundLabel ?? select.noResultsFoundLabel()\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n} @else {\n  <si-select\n    #select\n    class=\"form-control\"\n    [id]=\"id\"\n    [options]=\"props.optionsList\"\n    [hasFilter]=\"props.hasFilter ?? select.hasFilter()\"\n    [filterPlaceholder]=\"props.filterPlaceholder ?? select.filterPlaceholder()\"\n    [placeholder]=\"props.placeholder ?? select.placeholder()\"\n    [ariaLabel]=\"props.ariaLabel ?? select.ariaLabel()\"\n    [noResultsFoundLabel]=\"props.noResultsFoundLabel ?? select.noResultsFoundLabel()\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n}\n" }]
+                    ], changeDetection: ChangeDetectionStrategy.Default, template: "@if (props.multi) {\n  <si-select\n    #select\n    class=\"form-control\"\n    multi\n    [id]=\"id\"\n    [options]=\"props.optionsList\"\n    [hasFilter]=\"props.hasFilter ?? select.hasFilter()\"\n    [filterPlaceholder]=\"props.filterPlaceholder ?? select.filterPlaceholder()\"\n    [placeholder]=\"props.placeholder ?? select.placeholder()\"\n    [ariaLabel]=\"props.ariaLabel ?? select.ariaLabel()\"\n    [noResultsFoundLabel]=\"props.noResultsFoundLabel ?? select.noResultsFoundLabel()\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n} @else {\n  <si-select\n    #select\n    class=\"form-control\"\n    [id]=\"id\"\n    [options]=\"props.optionsList\"\n    [hasFilter]=\"props.hasFilter ?? select.hasFilter()\"\n    [filterPlaceholder]=\"props.filterPlaceholder ?? select.filterPlaceholder()\"\n    [placeholder]=\"props.placeholder ?? select.placeholder()\"\n    [ariaLabel]=\"props.ariaLabel ?? select.ariaLabel()\"\n    [noResultsFoundLabel]=\"props.noResultsFoundLabel ?? select.noResultsFoundLabel()\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [readonly]=\"props.readonly || false\"\n    [errormessageId]=\"id | siValidationErrorId\"\n  />\n}\n" }]
         }] });
 
 /**
@@ -373,11 +373,11 @@ class SiFormlyTextDisplayComponent extends FieldType {
         return getFieldValue(sourceModel, path);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyTextDisplayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiFormlyTextDisplayComponent, isStandalone: true, selector: "si-formly-text-display", usesInheritance: true, ngImport: i0, template: "<input type=\"hidden\" [id]=\"id\" [formControl]=\"formControl\" [formlyAttributes]=\"field\" />\n<div class=\"py-4\">\n  @if (props.prefix) {\n    {{ props.prefix | translate }}\n  }\n  {{ value }}\n  @if (props.suffix) {\n    {{ props.suffix | translate }}\n  }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiFormlyTextDisplayComponent, isStandalone: true, selector: "si-formly-text-display", usesInheritance: true, ngImport: i0, template: "<input type=\"hidden\" [id]=\"id\" [formControl]=\"formControl\" [formlyAttributes]=\"field\" />\n<div class=\"py-4\">\n  @if (props.prefix) {\n    {{ props.prefix | translate }}\n  }\n  {{ value }}\n  @if (props.suffix) {\n    {{ props.suffix | translate }}\n  }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyTextDisplayComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-formly-text-display', imports: [FormlyModule, ReactiveFormsModule, SiTranslatePipe], template: "<input type=\"hidden\" [id]=\"id\" [formControl]=\"formControl\" [formlyAttributes]=\"field\" />\n<div class=\"py-4\">\n  @if (props.prefix) {\n    {{ props.prefix | translate }}\n  }\n  {{ value }}\n  @if (props.suffix) {\n    {{ props.suffix | translate }}\n  }\n</div>\n" }]
+            args: [{ selector: 'si-formly-text-display', imports: [FormlyModule, ReactiveFormsModule, SiTranslatePipe], changeDetection: ChangeDetectionStrategy.Default, template: "<input type=\"hidden\" [id]=\"id\" [formControl]=\"formControl\" [formlyAttributes]=\"field\" />\n<div class=\"py-4\">\n  @if (props.prefix) {\n    {{ props.prefix | translate }}\n  }\n  {{ value }}\n  @if (props.suffix) {\n    {{ props.suffix | translate }}\n  }\n</div>\n" }]
         }] });
 
 /**
@@ -409,11 +409,11 @@ class SiFormlyTextareaComponent extends FieldType {
             this.textArea().nativeElement.value;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyTextareaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.8", type: SiFormlyTextareaComponent, isStandalone: true, selector: "si-formly-textarea", viewQueries: [{ propertyName: "textArea", first: true, predicate: ["textArea"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"textarea-grow-wrap text-break\"\n  [style.--content-grow]=\"contentGrowTextarea()\"\n  [style.max-height]=\"maxHeightConfiguration()\"\n>\n  <textarea\n    #textArea\n    class=\"form-control\"\n    [id]=\"id\"\n    [rows]=\"props.rows ?? 1\"\n    [cols]=\"props.cols ?? 1\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [style.resize]=\"resizeConfiguration()\"\n    [style.max-height]=\"maxHeightConfiguration()\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  >\n  </textarea>\n</div>\n", styles: [".textarea-grow-wrap{display:grid}.textarea-grow-wrap:after{content:var(--content-grow);white-space:pre-wrap;visibility:hidden;margin-block:3px}.textarea-grow-wrap>textarea,.textarea-grow-wrap:after{grid-area:1/1/2/2;padding-block:6px;font:inherit}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.8", type: SiFormlyTextareaComponent, isStandalone: true, selector: "si-formly-textarea", viewQueries: [{ propertyName: "textArea", first: true, predicate: ["textArea"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"textarea-grow-wrap text-break\"\n  [style.--content-grow]=\"contentGrowTextarea()\"\n  [style.max-height]=\"maxHeightConfiguration()\"\n>\n  <textarea\n    #textArea\n    class=\"form-control\"\n    [id]=\"id\"\n    [rows]=\"props.rows ?? 1\"\n    [cols]=\"props.cols ?? 1\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [style.resize]=\"resizeConfiguration()\"\n    [style.max-height]=\"maxHeightConfiguration()\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  >\n  </textarea>\n</div>\n", styles: [".textarea-grow-wrap{display:grid}.textarea-grow-wrap:after{content:var(--content-grow);white-space:pre-wrap;visibility:hidden;margin-block:3px}.textarea-grow-wrap>textarea,.textarea-grow-wrap:after{grid-area:1/1/2/2;padding-block:6px;font:inherit}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i1$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyTextareaComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'si-formly-textarea', imports: [FormsModule, ReactiveFormsModule, FormlyModule, SiValidationErrorIdPipe], template: "<div\n  class=\"textarea-grow-wrap text-break\"\n  [style.--content-grow]=\"contentGrowTextarea()\"\n  [style.max-height]=\"maxHeightConfiguration()\"\n>\n  <textarea\n    #textArea\n    class=\"form-control\"\n    [id]=\"id\"\n    [rows]=\"props.rows ?? 1\"\n    [cols]=\"props.cols ?? 1\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [style.resize]=\"resizeConfiguration()\"\n    [style.max-height]=\"maxHeightConfiguration()\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  >\n  </textarea>\n</div>\n", styles: [".textarea-grow-wrap{display:grid}.textarea-grow-wrap:after{content:var(--content-grow);white-space:pre-wrap;visibility:hidden;margin-block:3px}.textarea-grow-wrap>textarea,.textarea-grow-wrap:after{grid-area:1/1/2/2;padding-block:6px;font:inherit}\n"] }]
+            args: [{ selector: 'si-formly-textarea', imports: [FormsModule, ReactiveFormsModule, FormlyModule, SiValidationErrorIdPipe], changeDetection: ChangeDetectionStrategy.Default, template: "<div\n  class=\"textarea-grow-wrap text-break\"\n  [style.--content-grow]=\"contentGrowTextarea()\"\n  [style.max-height]=\"maxHeightConfiguration()\"\n>\n  <textarea\n    #textArea\n    class=\"form-control\"\n    [id]=\"id\"\n    [rows]=\"props.rows ?? 1\"\n    [cols]=\"props.cols ?? 1\"\n    [formControl]=\"formControl\"\n    [formlyAttributes]=\"field\"\n    [style.resize]=\"resizeConfiguration()\"\n    [style.max-height]=\"maxHeightConfiguration()\"\n    [attr.aria-describedby]=\"id | siValidationErrorId\"\n  >\n  </textarea>\n</div>\n", styles: [".textarea-grow-wrap{display:grid}.textarea-grow-wrap:after{content:var(--content-grow);white-space:pre-wrap;visibility:hidden;margin-block:3px}.textarea-grow-wrap>textarea,.textarea-grow-wrap:after{grid-area:1/1/2/2;padding-block:6px;font:inherit}\n"] }]
         }], propDecorators: { textArea: [{ type: i0.ViewChild, args: ['textArea', { isSignal: true }] }] } });
 
 /**
@@ -448,7 +448,7 @@ class SiFormlyTimeComponent extends FieldType {
     [formControl]="formControl"
     [readonly]="props.readonly || false"
     [errormessageId]="id | siValidationErrorId"
-  />`, isInline: true, dependencies: [{ kind: "component", type: SiTimepickerComponent, selector: "si-timepicker", inputs: ["id", "disabled", "hoursLabel", "minutesLabel", "secondsLabel", "millisecondsLabel", "hideLabels", "hoursAriaLabel", "minutesAriaLabel", "secondsAriaLabel", "millisecondsAriaLabel", "hoursPlaceholder", "minutesPlaceholder", "secondsPlaceholder", "millisecondsPlaceholder", "meridians", "meridiansLabel", "meridiansAriaLabel", "showMinutes", "showSeconds", "showMilliseconds", "showMeridian", "min", "max", "readonly", "errormessageId"], outputs: ["isValid", "meridianChange", "inputCompleted"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }] });
+  />`, isInline: true, dependencies: [{ kind: "component", type: SiTimepickerComponent, selector: "si-timepicker", inputs: ["id", "disabled", "hoursLabel", "minutesLabel", "secondsLabel", "millisecondsLabel", "hideLabels", "hoursAriaLabel", "minutesAriaLabel", "secondsAriaLabel", "millisecondsAriaLabel", "hoursPlaceholder", "minutesPlaceholder", "secondsPlaceholder", "millisecondsPlaceholder", "meridians", "meridiansLabel", "meridiansAriaLabel", "showMinutes", "showSeconds", "showMilliseconds", "showMeridian", "min", "max", "readonly", "errormessageId"], outputs: ["isValid", "meridianChange", "inputCompleted"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyTimeComponent, decorators: [{
             type: Component,
@@ -465,7 +465,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
     [formControl]="formControl"
     [readonly]="props.readonly || false"
     [errormessageId]="id | siValidationErrorId"
-  />`
+  />`,
+                    changeDetection: ChangeDetectionStrategy.Default
                 }]
         }] });
 
@@ -750,7 +751,7 @@ class SiFormlyWrapperComponent extends FieldWrapper {
         return this.props.labelWidth;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyWrapperComponent, isStandalone: true, selector: "si-formly-wrapper", usesInheritance: true, ngImport: i0, template: "<si-form-item\n  [class.ms-n8]=\"field.type === 'checkbox'\"\n  [label]=\"label\"\n  [labelWidth]=\"labelWidth\"\n  [required]=\"props.required\"\n>\n  <div class=\"w-100\" siFormlyFormFieldProvider [field]=\"field\">\n    <ng-template #fieldComponent />\n    <div class=\"invalid-feedback\" [class.d-block]=\"showError\">\n      <!-- This string is hard-coded in the bootstrap fields. -->\n      <!-- See https://github.com/ngx-formly/ngx-formly/blob/main/src/ui/bootstrap/input/src/input.type.ts -->\n      <!-- We should get rid of the bootstrap package, to make it rely on our si-form-item code. -->\n      <formly-validation-message [field]=\"field\" [id]=\"id | siValidationErrorId\" />\n    </div>\n  </div>\n</si-form-item>\n", dependencies: [{ kind: "component", type: SiFormItemComponent, selector: "si-form-item", inputs: ["label", "labelWidth", "disableErrorPrinting", "formErrorMapper", "required"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$1.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "directive", type: SiFormlyFormFieldProviderDirective, selector: "[siFormlyFormFieldProvider]", inputs: ["field"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: SiFormlyWrapperComponent, isStandalone: true, selector: "si-formly-wrapper", usesInheritance: true, ngImport: i0, template: "<si-form-item\n  [class.ms-n8]=\"field.type === 'checkbox'\"\n  [label]=\"label\"\n  [labelWidth]=\"labelWidth\"\n  [required]=\"props.required\"\n>\n  <div class=\"w-100\" siFormlyFormFieldProvider [field]=\"field\">\n    <ng-template #fieldComponent />\n    <div class=\"invalid-feedback\" [class.d-block]=\"showError\">\n      <!-- This string is hard-coded in the bootstrap fields. -->\n      <!-- See https://github.com/ngx-formly/ngx-formly/blob/main/src/ui/bootstrap/input/src/input.type.ts -->\n      <!-- We should get rid of the bootstrap package, to make it rely on our si-form-item code. -->\n      <formly-validation-message [field]=\"field\" [id]=\"id | siValidationErrorId\" />\n    </div>\n  </div>\n</si-form-item>\n", dependencies: [{ kind: "component", type: SiFormItemComponent, selector: "si-form-item", inputs: ["label", "labelWidth", "disableErrorPrinting", "formErrorMapper", "required"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i1$1.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "directive", type: SiFormlyFormFieldProviderDirective, selector: "[siFormlyFormFieldProvider]", inputs: ["field"] }, { kind: "pipe", type: SiValidationErrorIdPipe, name: "siValidationErrorId" }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiFormlyWrapperComponent, decorators: [{
             type: Component,
@@ -759,7 +760,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
                         FormlyModule,
                         SiFormlyFormFieldProviderDirective,
                         SiValidationErrorIdPipe
-                    ], template: "<si-form-item\n  [class.ms-n8]=\"field.type === 'checkbox'\"\n  [label]=\"label\"\n  [labelWidth]=\"labelWidth\"\n  [required]=\"props.required\"\n>\n  <div class=\"w-100\" siFormlyFormFieldProvider [field]=\"field\">\n    <ng-template #fieldComponent />\n    <div class=\"invalid-feedback\" [class.d-block]=\"showError\">\n      <!-- This string is hard-coded in the bootstrap fields. -->\n      <!-- See https://github.com/ngx-formly/ngx-formly/blob/main/src/ui/bootstrap/input/src/input.type.ts -->\n      <!-- We should get rid of the bootstrap package, to make it rely on our si-form-item code. -->\n      <formly-validation-message [field]=\"field\" [id]=\"id | siValidationErrorId\" />\n    </div>\n  </div>\n</si-form-item>\n" }]
+                    ], changeDetection: ChangeDetectionStrategy.Default, template: "<si-form-item\n  [class.ms-n8]=\"field.type === 'checkbox'\"\n  [label]=\"label\"\n  [labelWidth]=\"labelWidth\"\n  [required]=\"props.required\"\n>\n  <div class=\"w-100\" siFormlyFormFieldProvider [field]=\"field\">\n    <ng-template #fieldComponent />\n    <div class=\"invalid-feedback\" [class.d-block]=\"showError\">\n      <!-- This string is hard-coded in the bootstrap fields. -->\n      <!-- See https://github.com/ngx-formly/ngx-formly/blob/main/src/ui/bootstrap/input/src/input.type.ts -->\n      <!-- We should get rid of the bootstrap package, to make it rely on our si-form-item code. -->\n      <formly-validation-message [field]=\"field\" [id]=\"id | siValidationErrorId\" />\n    </div>\n  </div>\n</si-form-item>\n" }]
         }] });
 
 /**