@stemy/ngx-dynamic-form 19.6.6 → 19.6.8

package/fesm2022/stemy-ngx-dynamic-form.mjs

@@ -259,7 +259,7 @@ function controlStatus(control, timeout = 10) {
  * @param format Expected date format (date, date-time)
  */
 function convertToDateFormat(value, format) {
-    if (!ObjectUtils.isDefined(value) || format?.includes("date"))
+    if (!ObjectUtils.isDefined(value) || !format?.includes("date"))
         return value;
     value = ObjectUtils.isDate(value) ? value : new Date(value);
     const date = isNaN(value) ? new Date() : value;
@@ -275,7 +275,7 @@ function convertToDateFormat(value, format) {
  * @param format Expected date format (date, date-time)
  */
 function convertToDate(value, format) {
-    return (!ObjectUtils.isDefined(value) || format?.includes("date"))
+    return (!ObjectUtils.isDefined(value) || !format?.includes("date"))
         ? value
         : new Date(convertToDateFormat(value, format));
 }
@@ -307,12 +307,15 @@ function getFieldsByPredicate(field, cb) {
 function getFieldsByKey(field, key) {
     return getFieldsByPredicate(field, f => f.key === key);
 }
-async function getSelectOptions(field) {
-    const options = field.props?.options || [];
+async function getSelectOptions(fieldOrOpts) {
+    const options = fieldOrOpts.props?.options || fieldOrOpts;
     if (options instanceof Observable) {
         return firstValueFrom(options);
     }
-    return options;
+    if (options instanceof Promise) {
+        return await options;
+    }
+    return Array.isArray(options) ? options : [];
 }
 function replaceFieldArray(field, items) {
     const model = field.model || [];
@@ -354,10 +357,10 @@ function setFieldProp(field, prop, value) {
     return setFieldProps(field, { [prop]: value });
 }
 function setFieldHidden(field, hidden = true) {
-    setFieldProp(field, "hidden", hidden);
+    setFieldProp(field, "__hidden", ObjectUtils.isFunction(hidden) ? hidden : () => hidden);
 }
 function setFieldDisabled(field, disabled = true) {
-    setFieldProp(field, "disabled", disabled);
+    setFieldProp(field, "__disabled", ObjectUtils.isFunction(disabled) ? disabled : () => disabled);
 }
 function setFieldHooks(field, hooks) {
     field.hooks = field.hooks || {};
@@ -379,6 +382,10 @@ const MAX_INPUT_NUM = 1999999999;
 const EDITOR_FORMATS = ["php", "json", "html", "css", "scss"];
 
 class ConfigForSchemaWrap {
+    opts;
+    mode;
+    injector;
+    schema;
     get labelPrefix() {
         return this.opts.labelPrefix;
     }
@@ -391,6 +398,7 @@ class ConfigForSchemaWrap {
     get context() {
         return this.opts.context;
     }
+    fieldCustomizer;
     constructor(opts, mode, injector, schema) {
         this.opts = opts;
         this.mode = mode;
@@ -480,6 +488,11 @@ function getFormValidationErrors(controls, parentPath = "") {
 }
 
 class DynamicFormBuilderService {
+    injector;
+    events;
+    api;
+    languages;
+    language;
     constructor(injector, events, api, languages) {
         this.injector = injector;
         this.events = events;
@@ -604,12 +617,13 @@ class DynamicFormBuilderService {
         }, parent, options);
         setFieldHooks(field, {
             onInit: target => {
-                const options = data.options(target);
+                const factory = ReflectUtils.resolve(data.options, this.injector);
+                const options = factory(target, this.injector);
                 const root = target.formControl.root;
                 setFieldProp(target, "options", options instanceof Observable
                     ? options
                     : controlValues(root).pipe(combineLatestWith(this.language), switchMap(async () => {
-                        const results = await data.options(target) || [];
+                        const results = await factory(target, this.injector) || [];
                         return this.fixSelectOptions(target, results);
                     })));
             }
@@ -745,6 +759,8 @@ class DynamicFormBuilderService {
         if (type !== "array") {
             wrappers.unshift(!type ? "form-group" : "form-field");
         }
+        const disabled = ReflectUtils.resolve(data.disabled, this.injector);
+        const hidden = ReflectUtils.resolve(data.hidden, this.injector);
         const field = {
             key,
             wrappers,
@@ -756,8 +772,6 @@ class DynamicFormBuilderService {
             props: {
                 ...(data.props || {}),
                 ...props,
-                disabled: data.disabled === true,
-                hidden: data.hidden === true,
                 label: options.labelCustomizer?.(key, data.label, parent, options.labelPrefix)
                     ?? this.getLabel(key, data.label, parent, options),
                 hideLabel: data.hideLabel === true,
@@ -766,7 +780,9 @@ class DynamicFormBuilderService {
                 className: data.className || "",
                 hideRequiredMarker: data.hideRequiredMarker === true,
                 formCheck: "nolabel",
-                labelPosition: "before"
+                labelPosition: "before",
+                __disabled: ObjectUtils.isFunction(disabled) ? disabled : () => disabled,
+                __hidden: ObjectUtils.isFunction(hidden) ? hidden : () => hidden
             },
             modelOptions: {
                 updateOn: "change"
@@ -776,7 +792,15 @@ class DynamicFormBuilderService {
                 serializer: () => data.serializer,
                 serialize: () => data.serialize,
                 "props.hideRequiredMarker": target => target.type === "checkbox",
-                "props.required": target => !!target.validators?.required
+                "props.required": target => !!target.validators?.required,
+                "props.disabled": target => {
+                    const disabled = target.props?.__disabled;
+                    return !!disabled(target, this.injector);
+                },
+                "props.hidden": target => {
+                    const hidden = target.props?.__hidden;
+                    return !!hidden(target, this.injector);
+                }
             }
         };
         // Parent object will be available for customizers as a property, until it gets redefined by formly
@@ -841,8 +865,8 @@ class DynamicFormBuilderService {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService, deps: [{ token: i0.Injector }, { token: i2.EventsService }, { token: API_SERVICE }, { token: LANGUAGE_SERVICE }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService, deps: [{ token: i0.Injector }, { token: i2.EventsService }, { token: API_SERVICE }, { token: LANGUAGE_SERVICE }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService, decorators: [{
             type: Injectable
@@ -855,6 +879,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                 }] }] });
 
 class DynamicFormSchemaService {
+    openApi;
+    injector;
+    builder;
     get api() {
         return this.openApi.api;
     }
@@ -1214,14 +1241,18 @@ class DynamicFormSchemaService {
             validators.itemsMaxValue = maxValueValidation(items.maximum, true);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService, deps: [{ token: i2.OpenApiService }, { token: i0.Injector }, { token: DynamicFormBuilderService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService, deps: [{ token: i2.OpenApiService }, { token: i0.Injector }, { token: DynamicFormBuilderService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i2.OpenApiService }, { type: i0.Injector }, { type: DynamicFormBuilderService }] });
 
 class DynamicFormService {
+    fs;
+    fb;
+    injector;
+    api;
     constructor(fs, fb, injector, api) {
         this.fs = fs;
         this.fb = fb;
@@ -1353,8 +1384,8 @@ class DynamicFormService {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService, deps: [{ token: DynamicFormSchemaService }, { token: DynamicFormBuilderService }, { token: i0.Injector }, { token: API_SERVICE }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService, deps: [{ token: DynamicFormSchemaService }, { token: DynamicFormBuilderService }, { token: i0.Injector }, { token: API_SERVICE }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService, decorators: [{
             type: Injectable
@@ -1364,6 +1395,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                 }] }] });
 
 class AsyncSubmitDirective {
+    method = input(null, { alias: "async-submit" });
+    mode = input("click");
+    form = input();
+    context = input();
+    onSuccess = output();
+    onError = output();
+    toaster = inject(TOASTER_SERVICE);
+    renderer = inject(Renderer2);
+    elem = inject(ElementRef);
+    status = computed(() => {
+        const form = this.form();
+        return form?.status() || null;
+    });
+    group = computed(() => {
+        const form = this.form();
+        return form?.group() || null;
+    });
+    loading = signal(false);
+    callback = signal(null);
     get isDisabled() {
         return this.status() !== "VALID";
     }
@@ -1371,25 +1421,6 @@ class AsyncSubmitDirective {
         return this.loading();
     }
     constructor() {
-        this.method = input(null, { alias: "async-submit" });
-        this.mode = input("click");
-        this.form = input();
-        this.context = input();
-        this.onSuccess = output();
-        this.onError = output();
-        this.toaster = inject(TOASTER_SERVICE);
-        this.renderer = inject(Renderer2);
-        this.elem = inject(ElementRef);
-        this.status = computed(() => {
-            const form = this.form();
-            return form?.status() || null;
-        });
-        this.group = computed(() => {
-            const form = this.form();
-            return form?.group() || null;
-        });
-        this.loading = signal(false);
-        this.callback = signal(null);
         if (this.elem.nativeElement.tagName === "BUTTON") {
             this.renderer.setAttribute(this.elem.nativeElement, "type", "button");
         }
@@ -1444,8 +1475,8 @@ class AsyncSubmitDirective {
             this.toaster.error(reason.message, reason.context);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AsyncSubmitDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.14", type: AsyncSubmitDirective, isStandalone: false, selector: "[async-submit]", inputs: { method: { classPropertyName: "method", publicName: "async-submit", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSuccess: "onSuccess", onError: "onError" }, host: { listeners: { "click": "click()" }, properties: { "class.disabled": "this.isDisabled", "class.loading": "this.isLoading" } }, exportAs: ["async-submit"], ngImport: i0 }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AsyncSubmitDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.14", type: AsyncSubmitDirective, isStandalone: false, selector: "[async-submit]", inputs: { method: { classPropertyName: "method", publicName: "async-submit", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSuccess: "onSuccess", onError: "onError" }, host: { listeners: { "click": "click()" }, properties: { "class.disabled": "this.isDisabled", "class.loading": "this.isLoading" } }, exportAs: ["async-submit"], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AsyncSubmitDirective, decorators: [{
             type: Directive,
@@ -1466,12 +1497,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
             }] } });
 
 class DynamicFieldType extends FieldType {
-    constructor() {
-        super(...arguments);
-        this.stateChanges = new Subject();
-        this._errorState = false;
-        this._focused = false;
-    }
+    stateChanges = new Subject();
+    _errorState = false;
+    _focused = false;
     ngOnDestroy() {
         delete this.formField?._control;
         this.stateChanges.complete();
@@ -1558,8 +1586,8 @@ class DynamicFieldType extends FieldType {
             };
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFieldType, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFieldType, isStandalone: false, selector: "dynamic-field-type", usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFieldType, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFieldType, isStandalone: false, selector: "dynamic-field-type", usesInheritance: true, ngImport: i0, template: "", isInline: true });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFieldType, decorators: [{
             type: Component,
@@ -1571,57 +1599,57 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
         }] });
 
 class DynamicFormComponent {
-    constructor() {
-        this.builder = inject(DynamicFormBuilderService);
-        this.events = inject(EventsService);
-        this.languages = inject(LANGUAGE_SERVICE);
-        this.labelPrefix = input("label");
-        this.labelCustomizer = input(null);
-        this.testId = input("");
-        this.useTabs = input(false);
-        this.data = input({});
-        this.fields = input(null);
-        this.fieldChanges = new Subject();
-        this.language = toSignal(this.events.languageChanged, {
-            initialValue: this.languages.currentLanguage
-        });
-        this.enableTranslations = toSignal(this.events.translationsEnabled, {
-            initialValue: this.languages.enableTranslations
-        });
-        this.config = computed(() => {
-            const options = {
-                labelPrefix: this.labelPrefix(),
-                labelCustomizer: this.labelCustomizer(),
-                testId: this.testId(),
-            };
-            const fields = this.fields() || this.builder.resolveFormFields(this.data()?.constructor, null, options);
-            return [
-                this.builder.createFormGroup(null, () => fields, {
-                    label: "",
-                    useTabs: this.useTabs(),
-                    hidden: false,
-                    className: "dynamic-form-root-group"
-                }, null, options)
-            ];
-        });
-        this.group = computed(() => {
-            this.config();
-            return new FormGroup$1({});
-        });
-        this.status$ = rxResource({
-            request: () => this.group(),
-            loader: p => controlStatus(p.request),
-            defaultValue: "PENDING"
-        });
-        this.status = computed(() => this.status$.value());
-        this.onSubmit = output();
-        this.onChanges = outputFromObservable(this.fieldChanges);
-        this.options = {
-            fieldChanges: this.fieldChanges,
-            formState: {
-                injector: inject(Injector)
-            }
+    builder = inject(DynamicFormBuilderService);
+    events = inject(EventsService);
+    languages = inject(LANGUAGE_SERVICE);
+    labelPrefix = input("label");
+    labelCustomizer = input(null);
+    testId = input("");
+    useTabs = input(false);
+    data = input({});
+    fields = input(null);
+    fieldChanges = new Subject();
+    language = toSignal(this.events.languageChanged, {
+        initialValue: this.languages.currentLanguage
+    });
+    enableTranslations = toSignal(this.events.translationsEnabled, {
+        initialValue: this.languages.enableTranslations
+    });
+    config = computed(() => {
+        const options = {
+            labelPrefix: this.labelPrefix(),
+            labelCustomizer: this.labelCustomizer(),
+            testId: this.testId(),
         };
+        const fields = this.fields() || this.builder.resolveFormFields(this.data()?.constructor, null, options);
+        return [
+            this.builder.createFormGroup(null, () => fields, {
+                label: "",
+                useTabs: this.useTabs(),
+                hidden: false,
+                className: "dynamic-form-root-group"
+            }, null, options)
+        ];
+    });
+    group = computed(() => {
+        this.config();
+        return new FormGroup$1({});
+    });
+    status$ = rxResource({
+        request: () => this.group(),
+        loader: p => controlStatus(p.request),
+        defaultValue: "PENDING"
+    });
+    status = computed(() => this.status$.value());
+    onSubmit = output();
+    onChanges = outputFromObservable(this.fieldChanges);
+    options = {
+        fieldChanges: this.fieldChanges,
+        formState: {
+            injector: inject(Injector)
+        }
+    };
+    constructor() {
         effect(() => {
             this.language();
             this.enableTranslations();
@@ -1638,8 +1666,8 @@ class DynamicFormComponent {
     reset() {
         this.options?.resetModel?.();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormComponent, isStandalone: false, selector: "dynamic-form", inputs: { labelPrefix: { classPropertyName: "labelPrefix", publicName: "labelPrefix", isSignal: true, isRequired: false, transformFunction: null }, labelCustomizer: { classPropertyName: "labelCustomizer", publicName: "labelCustomizer", isSignal: true, isRequired: false, transformFunction: null }, testId: { classPropertyName: "testId", publicName: "testId", isSignal: true, isRequired: false, transformFunction: null }, useTabs: { classPropertyName: "useTabs", publicName: "useTabs", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", onChanges: "onChanges" }, ngImport: i0, template: "@if (config() && group()) {\n    <form [formGroup]=\"group()\" (ngSubmit)=\"submit()\" autocomplete=\"off\" role=\"presentation\">\n        <input type=\"submit\" [hidden]=\"true\" />\n        <formly-form [model]=\"data()\"\n                     [fields]=\"config()\"\n                     [form]=\"group()\"\n                     [options]=\"options\"></formly-form>\n        <ng-content></ng-content>\n    </form>\n}\n", styles: [".dynamic-form-field.dynamic-form-hidden{display:none}\n"], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.LegacyFormlyForm, selector: "formly-form" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormComponent, isStandalone: false, selector: "dynamic-form", inputs: { labelPrefix: { classPropertyName: "labelPrefix", publicName: "labelPrefix", isSignal: true, isRequired: false, transformFunction: null }, labelCustomizer: { classPropertyName: "labelCustomizer", publicName: "labelCustomizer", isSignal: true, isRequired: false, transformFunction: null }, testId: { classPropertyName: "testId", publicName: "testId", isSignal: true, isRequired: false, transformFunction: null }, useTabs: { classPropertyName: "useTabs", publicName: "useTabs", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", onChanges: "onChanges" }, ngImport: i0, template: "@if (config() && group()) {\n    <form [formGroup]=\"group()\" (ngSubmit)=\"submit()\" autocomplete=\"off\" role=\"presentation\">\n        <input type=\"submit\" [hidden]=\"true\" />\n        <formly-form [model]=\"data()\"\n                     [fields]=\"config()\"\n                     [form]=\"group()\"\n                     [options]=\"options\"></formly-form>\n        <ng-content></ng-content>\n    </form>\n}\n", styles: [".dynamic-form-field.dynamic-form-hidden{display:none}\n"], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.LegacyFormlyForm, selector: "formly-form" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormComponent, decorators: [{
             type: Component,
@@ -1647,10 +1675,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
         }], ctorParameters: () => [] });
 
 class DynamicFormArrayComponent extends FieldArrayType {
-    constructor() {
-        super(...arguments);
-        this.currentTab = signal(0);
-    }
+    currentTab = signal(0);
     clearItems() {
         const control = this.formControl;
         while (control.length > 0) {
@@ -1668,8 +1693,8 @@ class DynamicFormArrayComponent extends FieldArrayType {
         const length = this.field.fieldGroup.length;
         this.currentTab.set(Math.min(this.currentTab(), length - 1));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormArrayComponent, isStandalone: false, selector: "dynamic-form-array", usesInheritance: true, ngImport: i0, template: "@if (field.display) {\n    @if (props.label && props.hideLabel !== true) {\n        <label class=\"field-label\">\n            {{ props.label | translate }}\n            <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n        </label>\n    }\n    <div class=\"field-container\">\n        <tabs class=\"form-array-items\" [(value)]=\"currentTab\">\n            @for (itemField of field.fieldGroup; track itemField.key; let ix = $index) {\n                <ng-template #fieldContent>\n                    <div class=\"form-array-buttons\">\n                        @if (itemField.removeItem) {\n                            <btn icon=\"trash\" (click)=\"removeItem(ix)\"></btn>\n                        }\n                        @if (itemField.insertItem) {\n                            <btn icon=\"plus\" (click)=\"addItem(ix)\"></btn>\n                        }\n                    </div>\n                    <formly-field [field]=\"itemField\"></formly-field>\n                </ng-template>\n                @if (props.useTabs) {\n                    <div class=\"form-array-item\"\n                         [tabsItem]=\"ix\"\n                         [label]=\"(itemField.formControl.value | getValue : props.tabsLabel) || ix + 1\">\n                        <ng-container [ngTemplateOutlet]=\"fieldContent\"></ng-container>\n                    </div>\n                } @else {\n                    <div class=\"form-array-item\">\n                        <ng-container [ngTemplateOutlet]=\"fieldContent\"></ng-container>\n                    </div>\n                }\n            }\n        </tabs>\n\n        <div class=\"form-array-buttons\">\n            @if (props.clearItems) {\n                <btn icon=\"trash\" label=\"button.clear-items\" (click)=\"clearItems()\"></btn>\n            }\n            @if (props.addItem) {\n                <btn icon=\"plus\" label=\"button.insert-item\" (click)=\"addItem()\"></btn>\n            }\n        </div>\n    </div>\n}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.TabsItemDirective, selector: "[tabsItem]", inputs: ["tabsItem", "label", "tooltip", "icon", "disabled", "classes"] }, { kind: "component", type: i2.BtnComponent, selector: "btn", inputs: ["label", "tooltip", "icon", "disabled", "type", "size"] }, { kind: "component", type: i2.TabsComponent, selector: "tabs", inputs: ["value", "options", "type", "size", "testId", "tabsClass"], outputs: ["valueChange", "selectedChange"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.GetValuePipe, name: "getValue" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormArrayComponent, isStandalone: false, selector: "dynamic-form-array", usesInheritance: true, ngImport: i0, template: "@if (field.display) {\n    @if (props.label && props.hideLabel !== true) {\n        <label class=\"field-label\">\n            {{ props.label | translate }}\n            <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n        </label>\n    }\n    <div class=\"field-container\">\n        <tabs class=\"form-array-items\" [(value)]=\"currentTab\">\n            @for (itemField of field.fieldGroup; track itemField.key; let ix = $index) {\n                <ng-template #fieldContent>\n                    <div class=\"form-array-buttons\">\n                        @if (itemField.removeItem) {\n                            <btn icon=\"trash\" (click)=\"removeItem(ix)\"></btn>\n                        }\n                        @if (itemField.insertItem) {\n                            <btn icon=\"plus\" (click)=\"addItem(ix)\"></btn>\n                        }\n                    </div>\n                    <formly-field [field]=\"itemField\"></formly-field>\n                </ng-template>\n                @if (props.useTabs) {\n                    <div class=\"form-array-item\"\n                         [tabsItem]=\"ix\"\n                         [label]=\"(itemField.formControl.value | getValue : props.tabsLabel) || ix + 1\">\n                        <ng-container [ngTemplateOutlet]=\"fieldContent\"></ng-container>\n                    </div>\n                } @else {\n                    <div class=\"form-array-item\">\n                        <ng-container [ngTemplateOutlet]=\"fieldContent\"></ng-container>\n                    </div>\n                }\n            }\n        </tabs>\n\n        <div class=\"form-array-buttons\">\n            @if (props.clearItems) {\n                <btn icon=\"trash\" label=\"button.clear-items\" (click)=\"clearItems()\"></btn>\n            }\n            @if (props.addItem) {\n                <btn icon=\"plus\" label=\"button.insert-item\" (click)=\"addItem()\"></btn>\n            }\n        </div>\n    </div>\n}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.TabsItemDirective, selector: "[tabsItem]", inputs: ["tabsItem", "label", "tooltip", "icon", "disabled", "classes"] }, { kind: "component", type: i2.BtnComponent, selector: "btn", inputs: ["label", "tooltip", "icon", "disabled", "type", "size"] }, { kind: "component", type: i2.TabsComponent, selector: "tabs", inputs: ["value", "options", "type", "size", "testId", "tabsClass"], outputs: ["valueChange", "selectedChange"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.GetValuePipe, name: "getValue" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormArrayComponent, decorators: [{
             type: Component,
@@ -1677,8 +1702,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
         }] });
 
 class DynamicFormChipsComponent extends DynamicFieldType {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFormChipsComponent, isStandalone: false, selector: "dynamic-form-chips", usesInheritance: true, ngImport: i0, template: "<chips [formControl]=\"formControl\"\n       [type]=\"props.type\"\n       [step]=\"props.step\"\n       [minLength]=\"props.minLength\"\n       [maxLength]=\"props.maxLength\"\n       [min]=\"props.min\"\n       [max]=\"props.max\"\n       [multiple]=\"props.multiple\"\n       [formlyAttributes]=\"field\">\n</chips>\n", dependencies: [{ 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: i2.ChipsComponent, selector: "chips", inputs: ["value", "multiple", "disabled", "type", "min", "max", "minLength", "maxLength", "step", "placeholder", "unique", "options"], outputs: ["valueChange"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFormChipsComponent, isStandalone: false, selector: "dynamic-form-chips", usesInheritance: true, ngImport: i0, template: "<chips [formControl]=\"formControl\"\n       [type]=\"props.type\"\n       [step]=\"props.step\"\n       [minLength]=\"props.minLength\"\n       [maxLength]=\"props.maxLength\"\n       [min]=\"props.min\"\n       [max]=\"props.max\"\n       [multiple]=\"props.multiple\"\n       [formlyAttributes]=\"field\">\n</chips>\n", dependencies: [{ 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: i2.ChipsComponent, selector: "chips", inputs: ["value", "multiple", "disabled", "type", "min", "max", "minLength", "maxLength", "step", "placeholder", "unique", "options"], outputs: ["valueChange"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormChipsComponent, decorators: [{
             type: Component,
@@ -1686,8 +1711,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
         }] });
 
 class DynamicFormUploadComponent extends DynamicFieldType {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormUploadComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFormUploadComponent, isStandalone: false, selector: "dynamic-form-upload", usesInheritance: true, ngImport: i0, template: "<upload [formControl]=\"formControl\"\n        [multiple]=\"props.multiple\"\n        [inline]=\"props.inline\"\n        [accept]=\"props.accept\"\n        [baseUrl]=\"props.url\"\n        [makeUpload]=\"props.createUploadData\"\n        [formlyAttributes]=\"field\">\n</upload>\n", dependencies: [{ 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: i2.UploadComponent, selector: "upload", inputs: ["value", "disabled", "inline", "accept", "baseUrl", "message", "multiple", "buttonText", "makeUpload", "preProcess"], outputs: ["onUploaded", "onRemove"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormUploadComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFormUploadComponent, isStandalone: false, selector: "dynamic-form-upload", usesInheritance: true, ngImport: i0, template: "<upload [formControl]=\"formControl\"\n        [multiple]=\"props.multiple\"\n        [inline]=\"props.inline\"\n        [accept]=\"props.accept\"\n        [baseUrl]=\"props.url\"\n        [makeUpload]=\"props.createUploadData\"\n        [formlyAttributes]=\"field\">\n</upload>\n", dependencies: [{ 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: i2.UploadComponent, selector: "upload", inputs: ["value", "disabled", "inline", "accept", "baseUrl", "message", "multiple", "buttonText", "makeUpload", "preProcess"], outputs: ["onUploaded", "onRemove"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormUploadComponent, decorators: [{
             type: Component,
@@ -1698,8 +1723,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
  * This is just a test wrapper component
  */
 class DynamicFormAlertComponent extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormAlertComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFormAlertComponent, isStandalone: false, selector: "dynamic-form-alert", usesInheritance: true, ngImport: i0, template: "<div class=\"dynamic-form-alert\">\n    <ng-container #fieldComponent></ng-container>\n</div>\n", styles: [".dynamic-form-alert{border:2px dashed red;width:100%}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormAlertComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFormAlertComponent, isStandalone: false, selector: "dynamic-form-alert", usesInheritance: true, ngImport: i0, template: "<div class=\"dynamic-form-alert\">\n    <ng-container #fieldComponent></ng-container>\n</div>\n", styles: [".dynamic-form-alert{border:2px dashed red;width:100%}\n"], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormAlertComponent, decorators: [{
             type: Component,
@@ -1707,8 +1732,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
         }] });
 
 class DynamicFormFieldComponent extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormFieldComponent, isStandalone: false, selector: "dynamic-form-field", usesInheritance: true, ngImport: i0, template: "@if (props.label && props.hideLabel !== true) {\n    <label class=\"field-label\" [for]=\"id\">\n        {{ props.label | translate }}\n        <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n        @if (props.required && props.hideRequiredMarker !== true) {\n            <span class=\"field-required\" aria-hidden=\"true\">*</span>\n        }\n    </label>\n}\n<div class=\"field-container\">\n    <ng-container #fieldComponent></ng-container>\n    <div *ngIf=\"showError\" class=\"field-errors invalid-feedback\">\n        <formly-validation-message\n            [field]=\"field\"\n            id=\"{{ id }}-formly-validation-error\"\n            role=\"alert\"\n        ></formly-validation-message>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormFieldComponent, isStandalone: false, selector: "dynamic-form-field", usesInheritance: true, ngImport: i0, template: "@if (props.label && props.hideLabel !== true) {\n    <label class=\"field-label\" [for]=\"id\">\n        {{ props.label | translate }}\n        <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n        @if (props.required && props.hideRequiredMarker !== true) {\n            <span class=\"field-required\" aria-hidden=\"true\">*</span>\n        }\n    </label>\n}\n<div class=\"field-container\">\n    <ng-container #fieldComponent></ng-container>\n    <div *ngIf=\"showError\" class=\"field-errors invalid-feedback\">\n        <formly-validation-message\n            [field]=\"field\"\n            id=\"{{ id }}-formly-validation-error\"\n            role=\"alert\"\n        ></formly-validation-message>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
             type: Component,
@@ -1716,8 +1741,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
         }] });
 
 class DynamicFormFieldsetComponent extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormFieldsetComponent, isStandalone: false, selector: "dynamic-form-fieldset", usesInheritance: true, ngImport: i0, template: "@if (field.display) {\n    <legend class=\"field-legend\" *ngIf=\"props.label && !field.parent.props.useTabs\">\n        {{ props.label | translate }}\n    </legend>\n    <div class=\"field-container\">\n        @for (itemField of field.fieldGroup; track itemField) {\n            @if (itemField.display) {\n                <formly-field [field]=\"itemField\"></formly-field>\n            }\n        }\n    </div>\n}\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormFieldsetComponent, isStandalone: false, selector: "dynamic-form-fieldset", usesInheritance: true, ngImport: i0, template: "@if (field.display) {\n    <legend class=\"field-legend\" *ngIf=\"props.label && !field.parent.props.useTabs\">\n        {{ props.label | translate }}\n    </legend>\n    <div class=\"field-container\">\n        @for (itemField of field.fieldGroup; track itemField) {\n            @if (itemField.display) {\n                <formly-field [field]=\"itemField\"></formly-field>\n            }\n        }\n    </div>\n}\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldsetComponent, decorators: [{
             type: Component,
@@ -1725,8 +1750,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
         }] });
 
 class DynamicFormGroupComponent extends FieldWrapper {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormGroupComponent, isStandalone: false, selector: "dynamic-form-group", usesInheritance: true, ngImport: i0, template: "@if (field.display) {\n    @if (props.label && props.hideLabel !== true) {\n        <label class=\"field-label\">\n            {{ props.label | translate }}\n            <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n        </label>\n    }\n    <tabs class=\"field-container\">\n        @for (itemField of field.fieldGroup; track itemField; let ix = $index) {\n            @if (itemField.display) {\n                @if (props.useTabs && itemField.wrappers | includes: 'form-fieldset') {\n                    <div class=\"form-fieldset-item\"\n                         [tabsItem]=\"ix\"\n                         [classes]=\"['form-fieldset-tab', itemField.valid ? 'valid' : 'invalid']\"\n                         [label]=\"itemField.props.label\">\n                        <formly-field [field]=\"itemField\"></formly-field>\n                    </div>\n                } @else {\n                    <formly-field [field]=\"itemField\"></formly-field>\n                }\n            }\n        }\n    </tabs>\n}\n", styles: [".form-fieldset-item.hidden-tab{display:none}.form-fieldset-tab{position:relative;--invalid-bg: rgba(184, 38, 38, 1);--invalid-border: rgba(184, 38, 38, .6);--invalid-color: #ececec;--invalid-box-size: 15px;--invalid-box-pull: -3px}.form-fieldset-tab.invalid>btn .async-target{border:1px solid var(--invalid-border)}.form-fieldset-tab.invalid:after{background:var(--invalid-bg);color:var(--invalid-color);font-size:10px;line-height:var(--invalid-box-size);width:var(--invalid-box-size);height:var(--invalid-box-size);text-align:center;border-radius:5px;content:\"!\";display:block;position:absolute;top:var(--invalid-box-pull);right:var(--invalid-box-pull)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.TabsItemDirective, selector: "[tabsItem]", inputs: ["tabsItem", "label", "tooltip", "icon", "disabled", "classes"] }, { kind: "component", type: i2.TabsComponent, selector: "tabs", inputs: ["value", "options", "type", "size", "testId", "tabsClass"], outputs: ["valueChange", "selectedChange"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.IncludesPipe, name: "includes" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormGroupComponent, isStandalone: false, selector: "dynamic-form-group", usesInheritance: true, ngImport: i0, template: "@if (field.display) {\n    @if (props.label && props.hideLabel !== true) {\n        <label class=\"field-label\">\n            {{ props.label | translate }}\n            <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n        </label>\n    }\n    <tabs class=\"field-container\">\n        @for (itemField of field.fieldGroup; track itemField; let ix = $index) {\n            @if (itemField.display) {\n                @if (props.useTabs && itemField.wrappers | includes: 'form-fieldset') {\n                    <div class=\"form-fieldset-item\"\n                         [tabsItem]=\"ix\"\n                         [classes]=\"['form-fieldset-tab', itemField.valid ? 'valid' : 'invalid']\"\n                         [label]=\"itemField.props.label\">\n                        <formly-field [field]=\"itemField\"></formly-field>\n                    </div>\n                } @else {\n                    <formly-field [field]=\"itemField\"></formly-field>\n                }\n            }\n        }\n    </tabs>\n}\n", styles: [".form-fieldset-item.hidden-tab{display:none}.form-fieldset-tab{position:relative;--invalid-bg: rgba(184, 38, 38, 1);--invalid-border: rgba(184, 38, 38, .6);--invalid-color: #ececec;--invalid-box-size: 15px;--invalid-box-pull: -3px}.form-fieldset-tab.invalid>btn .async-target{border:1px solid var(--invalid-border)}.form-fieldset-tab.invalid:after{background:var(--invalid-bg);color:var(--invalid-color);font-size:10px;line-height:var(--invalid-box-size);width:var(--invalid-box-size);height:var(--invalid-box-size);text-align:center;border-radius:5px;content:\"!\";display:block;position:absolute;top:var(--invalid-box-pull);right:var(--invalid-box-pull)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.TabsItemDirective, selector: "[tabsItem]", inputs: ["tabsItem", "label", "tooltip", "icon", "disabled", "classes"] }, { kind: "component", type: i2.TabsComponent, selector: "tabs", inputs: ["value", "options", "type", "size", "testId", "tabsClass"], outputs: ["valueChange", "selectedChange"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.IncludesPipe, name: "includes" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormGroupComponent, decorators: [{
             type: Component,
@@ -1788,16 +1813,16 @@ class NgxDynamicFormModule {
     static provideForms(config) {
         return makeEnvironmentProviders(NgxDynamicFormModule.getProviders(config));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, declarations: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormUploadComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective], imports: [CommonModule,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, declarations: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormUploadComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective], imports: [CommonModule,
             FormsModule,
             ReactiveFormsModule,
             NgxUtilsModule,
             FormlyModule], exports: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormUploadComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective, FormsModule,
             ReactiveFormsModule,
             NgxUtilsModule,
-            FormlyModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, providers: [
+            FormlyModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, providers: [
             ...pipes
         ], imports: [CommonModule,
             FormsModule,
@@ -1806,7 +1831,7 @@ class NgxDynamicFormModule {
             FormlyModule, FormsModule,
             ReactiveFormsModule,
             NgxUtilsModule,
-            FormlyModule] }); }
+            FormlyModule] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, decorators: [{
             type: NgModule,