@stemy/ngx-dynamic-form 19.9.23 → 19.9.25

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

@@ -1,10 +1,9 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, Inject, Injectable, untracked, input, Renderer2, ElementRef, computed, signal, effect, HostBinding, Directive, Input, Optional, Pipe, Type, Component, Injector, output, ChangeDetectionStrategy, ViewEncapsulation, viewChild, makeEnvironmentProviders, NgModule } from '@angular/core';
 import * as i2 from '@stemy/ngx-utils';
-import { cachedFactory, ReflectUtils, ObjectUtils, LANGUAGE_SERVICE, ForbiddenZone, ArrayUtils, API_SERVICE, StringUtils, AsyncMethodBase, EventsService, NgxUtilsModule } from '@stemy/ngx-utils';
-import { of, merge, Observable, firstValueFrom, BehaviorSubject, combineLatestWith, switchMap, distinctUntilChanged, first, Subject, map, filter } from 'rxjs';
+import { cachedFactory, ReflectUtils, ObjectUtils, LANGUAGE_SERVICE, ForbiddenZone, SetUtils, ArrayUtils, API_SERVICE, StringUtils, AsyncMethodBase, EventsService, NgxUtilsModule } from '@stemy/ngx-utils';
+import { of, merge, map, Observable, firstValueFrom, BehaviorSubject, combineLatestWith, switchMap, distinctUntilChanged, first, Subject, filter } from 'rxjs';
 import { debounceTime } from 'rxjs/operators';
-import { __decorate } from 'tslib';
 import * as i1 from '@angular/forms';
 import { FormGroup as FormGroup$1, FormArray as FormArray$1, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { outputToObservable, toSignal, rxResource, outputFromObservable } from '@angular/core/rxjs-interop';
@@ -131,7 +130,10 @@ function replaceSpecialChars(str, to = "-") {
 function controlValues(control, timeout = 500) {
     const initial$ = of(control.value); // Emit immediately
     const changes$ = control.valueChanges.pipe(debounceTime(timeout));
-    return merge(initial$, changes$);
+    return merge(initial$, changes$).pipe(map(value => {
+        console.log(value, "why");
+        return value;
+    }));
 }
 /**
  * Creates a new observable that always starts with the controls current status.
@@ -289,8 +291,17 @@ function isFieldVisible(field) {
     let visible = true;
     let current = field;
     while (current && visible) {
+        // Discriminator based visibility
+        let parent = current.parent;
+        while (parent && !parent.key) {
+            parent = parent.parent;
+        }
+        const discriminator = parent?.discriminator;
+        const schema = !discriminator ? null : discriminator(parent.parent?.model || {});
+        visible = visible && (!schema || current.schemas.size === 0 || current.schemas.has(schema));
+        // Field based visibility
         const hiddenFn = current.props?.__hidden;
-        const injector = field.options?.formState?.injector;
+        const injector = current.options?.formState?.injector;
         visible = visible && (!injector || !hiddenFn?.(current, injector));
         current = current.parent;
     }
@@ -304,7 +315,8 @@ function isFieldHidden(field) {
 }
 const MIN_INPUT_NUM = -1999999999;
 const MAX_INPUT_NUM = 1999999999;
-const EDITOR_FORMATS = ["php", "json", "html", "css", "scss"];
+const EDITOR_TYPES = ["php", "json", "html", "css", "scss"];
+const CUSTOM_INPUT_TYPES = ["checkbox", "textarea", "wysiwyg", "password"];
 
 function validationMessage(errorKey) {
     const key = `form.error.${errorKey}`;
@@ -467,34 +479,54 @@ class ModelUtils {
     }
 }
 
+var __decorate$1 = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata$1 = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
 class RichTranslationModel {
-    lang = "";
-    translation = "";
     constructor(data) {
+        this.lang = "";
+        this.translation = "";
         if (data)
             Object.assign(this, data);
     }
 }
-__decorate([
+__decorate$1([
     FormSelect({
         options: {
             type: ModelUtils,
             func: ModelUtils.getLanguages
         }
     }),
-    FormSerializable()
+    FormSerializable(),
+    __metadata$1("design:type", String)
 ], RichTranslationModel.prototype, "lang", void 0);
-__decorate([
+__decorate$1([
     FormInput({
         type: "wysiwyg"
     }),
-    FormSerializable()
+    FormSerializable(),
+    __metadata$1("design:type", String)
 ], RichTranslationModel.prototype, "translation", void 0);
 
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
 class TranslationModel {
-    lang = "";
-    translation = "";
     constructor(data) {
+        this.lang = "";
+        this.translation = "";
         if (data)
             Object.assign(this, data);
     }
@@ -506,18 +538,16 @@ __decorate([
             func: ModelUtils.getLanguages
         }
     }),
-    FormSerializable()
+    FormSerializable(),
+    __metadata("design:type", String)
 ], TranslationModel.prototype, "lang", void 0);
 __decorate([
     FormInput(),
-    FormSerializable()
+    FormSerializable(),
+    __metadata("design:type", String)
 ], TranslationModel.prototype, "translation", void 0);
 
 class ConfigForSchemaWrap {
-    opts;
-    mode;
-    injector;
-    schema;
     get labelPrefix() {
         return this.opts.labelPrefix;
     }
@@ -533,7 +563,6 @@ class ConfigForSchemaWrap {
     get context() {
         return this.opts.context;
     }
-    fieldCustomizer;
     constructor(opts, mode, injector, schema) {
         this.opts = opts;
         this.mode = mode;
@@ -611,14 +640,7 @@ function getFormValidationErrors(controls, parentPath = "") {
     return errors;
 }
 
-const customInputTypes = ["checkbox", "textarea", "wysiwyg", "password"];
 class DynamicFormBuilderService {
-    injector;
-    events;
-    api;
-    languages;
-    defaultNumericStep;
-    language;
     constructor(injector, events, api, languages, defaultNumericStep) {
         this.injector = injector;
         this.events = events;
@@ -657,7 +679,8 @@ class DynamicFormBuilderService {
         return this.setExpressions({
             id,
             parent,
-            schemas: [],
+            schemas: new Set(),
+            discriminator: parent.discriminator,
             fieldGroup: fields,
             wrappers: ["form-fieldset"],
             props: {
@@ -670,15 +693,15 @@ class DynamicFormBuilderService {
             expressions: {}
         }, options);
     }
-    createFieldSets(fields, parent, options, sets = []) {
+    createFieldSets(fields, parent, options, data = []) {
         const result = [];
-        const groups = {};
+        const fieldSets = {};
         fields = Array.from(fields || [])
             .sort((a, b) => a.priority - b.priority);
         fields.forEach(field => {
             if (this.isFieldset(field)) {
                 // This field is an already existing set
-                groups[field.id] = field.fieldGroup;
+                fieldSets[field.id] = field;
             }
         });
         for (const field of fields) {
@@ -686,19 +709,20 @@ class DynamicFormBuilderService {
             // If we have a fieldset name defined, then push the property fields into a group
             if (fsName) {
                 const id = !parent?.path ? fsName : `${parent.path}.${fsName}`;
-                const set = sets.find(s => s.id === fsName) || { id: fsName, layout: "" };
-                let fieldGroup = groups[id];
-                if (!fieldGroup) {
-                    fieldGroup = [];
-                    groups[id] = fieldGroup;
-                    result.push(this.createFieldSet(set, fieldGroup, parent, options));
+                const setData = data.find(s => s.id === fsName) || { id: fsName, layout: "" };
+                let fieldSet = fieldSets[id];
+                if (!fieldSet) {
+                    fieldSet = this.createFieldSet(setData, [], parent, options);
+                    fieldSets[id] = fieldSet;
+                    result.push(fieldSet);
                 }
-                fieldGroup.push(field);
+                SetUtils.merge(fieldSet.schemas, field.schemas);
+                fieldSet.fieldGroup.push(field);
                 continue;
             }
-            else if (field.asFieldSet && !groups[field.id]) {
+            else if (field.asFieldSet && !fieldSets[field.id]) {
                 const fsName = String(field.key);
-                const set = sets.find(s => s.id === fsName);
+                const set = data.find(s => s.id === fsName);
                 field.id = !parent?.path ? fsName : `${parent.path}.${fsName}`;
                 field.wrappers = ["form-fieldset"];
                 field.props = {
@@ -717,7 +741,7 @@ class DynamicFormBuilderService {
     }
     createFormInput(key, data, parent, options) {
         data = data || {};
-        const type = `${data.type || "text"}`;
+        const type = String(data.type || "text");
         const autocomplete = data.autocomplete || (type === "password" ? "new-password" : "none");
         const props = {
             type,
@@ -755,7 +779,10 @@ class DynamicFormBuilderService {
                 props.maxLength = isNaN(data.maxLength) ? MAX_INPUT_NUM : data.maxLength;
                 break;
         }
-        return this.createFormField(key, customInputTypes.includes(type) ? type : "input", data, props, parent, options);
+        const fieldType = CUSTOM_INPUT_TYPES.includes(type)
+            ? type
+            : (EDITOR_TYPES.includes(type) ? "editor" : "input");
+        return this.createFormField(key, fieldType, data, props, parent, options);
     }
     createFormSelect(key, data, parent, options) {
         data = data || {};
@@ -779,6 +806,7 @@ class DynamicFormBuilderService {
                 setFieldProp(target, "options", options instanceof Observable
                     ? options
                     : controlValues(root).pipe(combineLatestWith(this.language), switchMap(async (a, b) => {
+                        console.log(a, b, "????", target.key, target.formControl?.value);
                         const results = await factory(target, this.injector) || [];
                         return this.fixSelectOptions(target, results);
                     })));
@@ -855,7 +883,7 @@ class DynamicFormBuilderService {
                     wrappers: ["form-group"],
                     fieldGroup: items,
                     className: "dynamic-form-field dynamic-form-group",
-                    defaultValue: [],
+                    defaultValue: {},
                     hooks: {},
                     expressions
                 };
@@ -888,7 +916,7 @@ class DynamicFormBuilderService {
                     ...items.props,
                     label: "",
                 },
-                defaultValue: [],
+                defaultValue: props.type === "json" ? {} : "",
                 hooks: {},
                 expressions
             };
@@ -926,10 +954,10 @@ class DynamicFormBuilderService {
         const control = field.formControl;
         const multiple = field.props.multiple;
         if (multiple) {
+            if (Array.isArray(control.value))
+                return options;
             // Handle if current control value is not an array
-            const value = Array.isArray(control.value)
-                ? control.value
-                : String(control.value || "").split(",");
+            const value = String(control.value || "").split(",");
             control.setValue(value);
             return options;
         }
@@ -981,7 +1009,7 @@ class DynamicFormBuilderService {
             prefixTemplateKey: String(data.prefixTemplateKey || ""),
             suffixTemplateKey: String(data.suffixTemplateKey || ""),
             purposes: toStringArray(data.purposes),
-            schemas: toStringArray(data.schemas),
+            schemas: new Set(toStringArray(data.schemas)),
             discriminator: data.discriminator,
             priority: isNaN(data.priority) ? Number.MAX_SAFE_INTEGER : Number(data.priority),
             wrappers: wrappers.filter(ObjectUtils.isDefined),
@@ -1089,10 +1117,10 @@ class DynamicFormBuilderService {
         });
         return field;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormBuilderService, deps: [{ token: i0.Injector }, { token: i2.EventsService }, { token: API_SERVICE }, { token: LANGUAGE_SERVICE }, { token: DEFAULT_NUMERIC_STEP }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormBuilderService });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormBuilderService, deps: [{ token: i0.Injector }, { token: i2.EventsService }, { token: API_SERVICE }, { token: LANGUAGE_SERVICE }, { token: DEFAULT_NUMERIC_STEP }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormBuilderService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormBuilderService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormBuilderService, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i0.Injector }, { type: i2.EventsService }, { type: undefined, decorators: [{
                     type: Inject,
@@ -1107,9 +1135,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
 
 const PRIORITY_DIFF = 20;
 class DynamicFormSchemaService {
-    openApi;
-    injector;
-    builder;
     get api() {
         return this.openApi.api;
     }
@@ -1128,39 +1153,50 @@ class DynamicFormSchemaService {
         if (!schema)
             return [];
         const options = await toWrapOptions(customizeOrOptions, this.injector, schema);
-        const keys = Object.keys(schema.properties || {});
-        const fields = [];
-        // Collect all properties of this schema def
-        let priority = Number.MAX_SAFE_INTEGER - (keys.length * PRIORITY_DIFF);
-        for (const key of keys) {
-            const property = schema.properties[key];
-            // Property priority is necessary when merging different schemas
-            property.priority = property.priority ?? (priority += PRIORITY_DIFF);
-            // Generate sub-fields for property
-            const propFields = await this.getFormFieldsForProp(property, schema, options, parent);
-            fields.push(...propFields);
-        }
-        return this.builder.createFieldSets(fields.filter(f => null !== f), parent, options, schema.sets || []);
-    }
-    async getFormFieldsForRefs(subSchemas, parent, options) {
-        const subFields = await Promise.all(subSchemas.map(async (s) => this.getFormFieldsForSchema(s, parent, options)));
+        return this.getFormFieldsForSchemas(parent, options, schema);
+    }
+    async getFormFieldsForSchemas(parent, options, ...schemas) {
+        const sets = [];
+        const fieldsForSchemas = await Promise.all(schemas.map(async (schema) => {
+            const keys = Object.keys(schema.properties || {});
+            const fields = [];
+            // Collect field set definitions for this schema
+            const schemaSets = Array.isArray(schema.sets) ? schema.sets : [];
+            for (const set of schemaSets) {
+                const existing = sets.find(s => s.id === set.id);
+                if (!existing) {
+                    Object.assign(existing, set);
+                    continue;
+                }
+                sets.push(set);
+            }
+            // Collect all properties of this schema def
+            let priority = Number.MAX_SAFE_INTEGER - (keys.length * PRIORITY_DIFF);
+            for (const key of keys) {
+                const property = schema.properties[key];
+                // Property priority is necessary when merging different schemas
+                property.priority = property.priority ?? (priority += PRIORITY_DIFF);
+                // Generate sub-fields for property
+                const propFields = await this.getFormFieldsForProp(property, schema, options, parent);
+                fields.push(...propFields);
+            }
+            return fields.filter(ObjectUtils.isObject);
+        }));
         const res = [];
-        for (const ix in subSchemas) {
-            const schema = subSchemas[ix];
-            const fields = subFields[ix];
+        for (const ix in schemas) {
+            const schema = schemas[ix];
+            const fields = fieldsForSchemas[ix];
             for (const field of fields) {
-                const index = field.key
-                    ? res.findIndex(t => t.key === field.key)
-                    : res.findIndex(t => t.id === field.id);
+                const index = res.findIndex(t => t.key === field.key);
                 if (index >= 0) {
-                    res[index].schemas.push(schema.name);
+                    res[index].schemas.add(schema.name);
                     continue;
                 }
-                field.schemas.push(schema.name);
+                field.schemas.add(schema.name);
                 res.push(field);
             }
         }
-        return this.builder.createFieldSets(res, parent, options);
+        return this.builder.createFieldSets(res, parent, options, sets);
     }
     async getFormFieldsForProp(property, schema, options, parent) {
         const field = await this.getFormFieldForProp(property, options, parent);
@@ -1168,8 +1204,8 @@ class DynamicFormSchemaService {
     }
     async getFormFieldForProp(property, options, parent) {
         switch (property.type) {
-            // case "object":
-            //     return this.getFormEditorConfig(property, options, parent);
+            case "object":
+                return this.getFormEditorConfig(property, options, parent);
             case "file":
             case "upload":
                 return this.getFormUploadConfig(property, options, parent);
@@ -1198,11 +1234,16 @@ class DynamicFormSchemaService {
         if (refs.length > 0) {
             return this.getFormGroupConfig(property, options, parent);
         }
-        // if (this.checkIsEditorProperty(property)) {
-        //     return this.getFormEditorConfig(property, options, parent);
-        // }
+        if (this.checkIsEditorProperty(property)) {
+            return this.getFormEditorConfig(property, options, parent);
+        }
         return this.getFormInputConfig(property, options, parent);
     }
+    checkIsEditorProperty(property) {
+        if (!property.format)
+            return false;
+        return EDITOR_TYPES.indexOf(property.format) >= 0 || property.format.endsWith("script");
+    }
     getFormFieldData(property, options) {
         const validators = {};
         const schema = options.schema;
@@ -1227,7 +1268,7 @@ class DynamicFormSchemaService {
             fieldSet: property.fieldSet,
             labelPrefix: property.labelPrefix,
             purposes: property.purposes || property.purpose,
-            discriminator: property.discriminator,
+            discriminator: property.discriminatorFn,
             priority: property.priority,
             componentType: property.componentType,
             wrappers: wrappers.filter(ObjectUtils.isStringWithValue),
@@ -1242,7 +1283,7 @@ class DynamicFormSchemaService {
         return this.builder.createFormArray(property.id, async (sp) => {
             const subSchemas = await this.openApi.getReferences(property, options.schema);
             if (subSchemas.length > 0) {
-                return this.getFormFieldsForRefs(subSchemas, sp, options);
+                return this.getFormFieldsForSchemas(sp, options, ...subSchemas);
             }
             return this.getFormFieldForProp(property.items, options, sp);
         }, {
@@ -1262,7 +1303,7 @@ class DynamicFormSchemaService {
     async getFormGroupConfig(property, options, parent) {
         return this.builder.createFormGroup(property.id, async (sp) => {
             const subSchemas = await this.openApi.getReferences(property, options.schema);
-            return this.getFormFieldsForRefs(subSchemas, sp, options);
+            return this.getFormFieldsForSchemas(sp, options, ...subSchemas);
         }, {
             ...this.getFormFieldData(property, options),
             useTabs: property.useTabs
@@ -1313,25 +1354,12 @@ class DynamicFormSchemaService {
             placeholder: property.placeholder || ""
         }, parent, options);
     }
-    // getFormEditorConfig(property: OpenApiSchemaProperty, options: ConfigForSchemaWrap): DynamicEditorModelConfig {
-    //     const sub = property.type == "array" ? property.items || property : property;
-    //     return Object.assign(
-    //         this.getFormControlConfig(property, options),
-    //         {
-    //             inputType: property.format || "json",
-    //             convertObject: property.type !== "string",
-    //             autoComplete: property.autoComplete || "off",
-    //             multiple: property.type == "array",
-    //             accept: ObjectUtils.isString(property.accept) ? property.accept : null,
-    //             mask: ObjectUtils.isString(property.mask) ? property.mask : null,
-    //             pattern: ObjectUtils.isString(property.pattern) ? property.pattern : null,
-    //             step: isNaN(sub.step) ? (isNaN(property.step) ? 1 : property.step) : sub.step,
-    //             minLength: isNaN(sub.minLength) ? 0 : sub.minLength,
-    //             maxLength: isNaN(sub.maxLength) ? MAX_INPUT_NUM : sub.maxLength,
-    //             placeholder: property.placeholder || ""
-    //         }
-    //     );
-    // }
+    getFormEditorConfig(property, options, parent) {
+        return this.builder.createFormInput(property.id, {
+            ...this.getFormFieldData(property, options),
+            type: property.format || "json"
+        }, parent, options);
+    }
     getFormDatepickerConfig(property, options, parent) {
         const type = property.format == "date-time" ? "datetime-local" : "date";
         return this.builder.createFormInput(property.id, {
@@ -1526,18 +1554,14 @@ class DynamicFormSchemaService {
             validators.enum = enumValidation(items.enum);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", 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.19", ngImport: i0, type: DynamicFormSchemaService });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", 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.22", ngImport: i0, type: DynamicFormSchemaService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormSchemaService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", 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;
@@ -1590,6 +1614,7 @@ class DynamicFormService {
         const root = await wrapOptions.customize(config, {
             id: FORM_ROOT_ID,
             type: "object",
+            discriminator: null,
             properties: schema?.properties || {}
         }, schema);
         // Check if the customized root wrapper returned an array
@@ -1691,10 +1716,10 @@ class DynamicFormService {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", 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.19", ngImport: i0, type: DynamicFormService });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", 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.22", ngImport: i0, type: DynamicFormService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormService, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: DynamicFormSchemaService }, { type: DynamicFormBuilderService }, { type: i0.Injector }, { type: undefined, decorators: [{
                     type: Inject,
@@ -1703,10 +1728,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
 
 const templateTypes = ["control", "label", "input", "prefix", "suffix"];
 class DynamicFormTemplateService {
-    globalTemplates;
-    templatesUpdated;
-    templates;
-    globalTemplatePrefix;
     get globalPrefix() {
         return this.globalTemplatePrefix;
     }
@@ -1747,28 +1768,14 @@ class DynamicFormTemplateService {
         this.templates.get(type).delete(key);
         this.templatesUpdated.next();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTemplateService, deps: [{ token: i2.GlobalTemplateService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTemplateService });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTemplateService, deps: [{ token: i2.GlobalTemplateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTemplateService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTemplateService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTemplateService, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i2.GlobalTemplateService }] });
 
 class AsyncSubmitDirective extends AsyncMethodBase {
-    method = input(null, { alias: "async-submit" });
-    mode = input("click");
-    form = input();
-    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;
-    });
-    callback = signal(null);
     get isDisabled() {
         return this.status() !== "VALID";
     }
@@ -1777,6 +1784,20 @@ class AsyncSubmitDirective extends AsyncMethodBase {
     }
     constructor() {
         super();
+        this.method = input(null, { alias: "async-submit" });
+        this.mode = input("click");
+        this.form = input();
+        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.callback = signal(null);
         if (this.elem.nativeElement.tagName === "BUTTON") {
             this.renderer.setAttribute(this.elem.nativeElement, "type", "button");
         }
@@ -1819,12 +1840,12 @@ class AsyncSubmitDirective extends AsyncMethodBase {
     getArgs(ev) {
         return untracked(() => [this.form(), this.context(), ev]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: AsyncSubmitDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.19", 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 } }, host: { properties: { "class.disabled": "this.isDisabled", "class.loading": "this.isLoading" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: AsyncSubmitDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.22", 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 } }, host: { properties: { "class.disabled": "this.isDisabled", "class.loading": "this.isLoading" } }, providers: [
             { provide: AsyncMethodBase, useExisting: AsyncSubmitDirective }
-        ], exportAs: ["async-submit"], usesInheritance: true, ngImport: i0 });
+        ], exportAs: ["async-submit"], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: AsyncSubmitDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: AsyncSubmitDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: false,
@@ -1843,19 +1864,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
             }] } });
 
 class DynamicFormTemplateDirective {
-    templates;
-    template;
-    control;
-    label;
-    input;
-    prefix;
-    suffix;
-    setPrefix;
-    setSuffix;
-    setting = null;
     constructor(templates, template) {
         this.templates = templates;
         this.template = template;
+        this.setting = null;
     }
     ngOnChanges() {
         this.ngOnDestroy();
@@ -1881,10 +1893,10 @@ class DynamicFormTemplateDirective {
         }
         return null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTemplateDirective, deps: [{ token: DynamicFormTemplateService, optional: true }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.19", type: DynamicFormTemplateDirective, isStandalone: false, selector: "ng-template[control],\n                ng-template[label],\n                ng-template[input],\n                ng-template[prefix],\n                ng-template[suffix],\n                ng-template[setPrefix],\n                ng-template[setSuffix]", inputs: { control: "control", label: "label", input: "input", prefix: "prefix", suffix: "suffix", setPrefix: "setPrefix", setSuffix: "setSuffix" }, usesOnChanges: true, ngImport: i0 });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTemplateDirective, deps: [{ token: DynamicFormTemplateService, optional: true }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.22", type: DynamicFormTemplateDirective, isStandalone: false, selector: "ng-template[control],\n                ng-template[label],\n                ng-template[input],\n                ng-template[prefix],\n                ng-template[suffix],\n                ng-template[setPrefix],\n                ng-template[setSuffix]", inputs: { control: "control", label: "label", input: "input", prefix: "prefix", suffix: "suffix", setPrefix: "setPrefix", setSuffix: "setSuffix" }, usesOnChanges: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: false,
@@ -1915,11 +1927,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
             }] } });
 
 class DynamicFormTemplatePipe {
-    templates;
-    templatesUpdated;
-    cachedKey;
-    cachedType;
-    cachedTemplate;
     constructor(templates) {
         this.templates = templates;
         this.cachedKey = null;
@@ -1948,10 +1955,10 @@ class DynamicFormTemplatePipe {
         }
         return this.cachedTemplate;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTemplatePipe, deps: [{ token: DynamicFormTemplateService }], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTemplatePipe, isStandalone: false, name: "dynamicFormTemplate", pure: false });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTemplatePipe, deps: [{ token: DynamicFormTemplateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTemplatePipe, isStandalone: false, name: "dynamicFormTemplate", pure: false }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTemplatePipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTemplatePipe, decorators: [{
             type: Pipe,
             args: [{
                     standalone: false,
@@ -1961,9 +1968,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
         }], ctorParameters: () => [{ type: DynamicFormTemplateService }] });
 
 class DynamicFieldType extends FieldType {
-    stateChanges = new Subject();
-    _errorState = false;
-    _focused = false;
+    constructor() {
+        super(...arguments);
+        this.stateChanges = new Subject();
+        this._errorState = false;
+        this._focused = false;
+    }
     ngOnDestroy() {
         delete this.formField?._control;
         this.stateChanges.complete();
@@ -2050,10 +2060,10 @@ class DynamicFieldType extends FieldType {
             };
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFieldType, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DynamicFieldType, isStandalone: false, selector: "dynamic-field-type", usesInheritance: true, ngImport: i0, template: "", isInline: true });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFieldType, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.22", type: DynamicFieldType, isStandalone: false, selector: "dynamic-field-type", usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFieldType, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFieldType, decorators: [{
             type: Component,
             args: [{
                     standalone: false,
@@ -2063,76 +2073,74 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
         }] });
 
 class DynamicFormComponent {
-    forms;
-    templates;
-    builder = inject(DynamicFormBuilderService);
-    events = inject(EventsService);
-    languages = inject(LANGUAGE_SERVICE);
-    globalTemplatePrefix = input("dynamic-form");
-    labelPrefix = input("label");
-    labelCustomizer = input(null);
-    testId = input("form");
-    useTabs = input(false);
-    legacyLabels = input(false);
-    data = input({});
-    fields = input(null);
-    options = {
-        fieldChanges: new Subject(),
-        formState: {
-            injector: inject(Injector)
-        }
-    };
-    fieldChanges = this.options.fieldChanges.pipe(map(changes => ({
-        ...changes,
-        form: this
-    })));
-    init = this.fieldChanges.pipe(first());
-    valueChanges = this.fieldChanges
-        .pipe(filter(c => c.type === "valueChanges"));
-    expressionChanges = this.fieldChanges
-        .pipe(filter(c => c.type === "expressionChanges"));
-    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(),
-            legacyLabels: this.legacyLabels(),
-            testId: this.testId(),
-        };
-        const defs = this.fields();
-        const fields = Array.isArray(defs) ? defs : null;
-        const constructor = this.data()?.constructor;
-        const root = (Array.isArray(defs) ? null : defs) ?? this.builder.createFormGroup(null, parent => this.builder.createFieldSets(fields ?? this.builder.resolveFormFields(constructor, parent, options), parent, options), {
-            label: "",
-            hidden: false,
-            useTabs: this.useTabs(),
-            className: "dynamic-form-root-group"
-        });
-        return [root];
-    });
-    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();
-    onFieldChanges = outputFromObservable(this.fieldChanges);
-    onValueChanges = outputFromObservable(this.valueChanges);
-    onExpressionChanges = outputFromObservable(this.expressionChanges);
-    onInit = outputFromObservable(this.init);
     constructor(forms, templates) {
         this.forms = forms;
         this.templates = templates;
+        this.builder = inject(DynamicFormBuilderService);
+        this.events = inject(EventsService);
+        this.languages = inject(LANGUAGE_SERVICE);
+        this.globalTemplatePrefix = input("dynamic-form");
+        this.labelPrefix = input("label");
+        this.labelCustomizer = input(null);
+        this.testId = input("form");
+        this.useTabs = input(false);
+        this.legacyLabels = input(false);
+        this.data = input({});
+        this.fields = input(null);
+        this.options = {
+            fieldChanges: new Subject(),
+            formState: {
+                injector: inject(Injector)
+            }
+        };
+        this.fieldChanges = this.options.fieldChanges.pipe(map(changes => ({
+            ...changes,
+            form: this
+        })));
+        this.init = this.fieldChanges.pipe(first());
+        this.valueChanges = this.fieldChanges
+            .pipe(filter(c => c.type === "valueChanges"));
+        this.expressionChanges = this.fieldChanges
+            .pipe(filter(c => c.type === "expressionChanges"));
+        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(),
+                legacyLabels: this.legacyLabels(),
+                testId: this.testId(),
+            };
+            const defs = this.fields();
+            const fields = Array.isArray(defs) ? defs : null;
+            const constructor = this.data()?.constructor;
+            const root = (Array.isArray(defs) ? null : defs) ?? this.builder.createFormGroup(null, parent => this.builder.createFieldSets(fields ?? this.builder.resolveFormFields(constructor, parent, options), parent, options), {
+                label: "",
+                hidden: false,
+                useTabs: this.useTabs(),
+                className: "dynamic-form-root-group"
+            });
+            return [root];
+        });
+        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.onFieldChanges = outputFromObservable(this.fieldChanges);
+        this.onValueChanges = outputFromObservable(this.valueChanges);
+        this.onExpressionChanges = outputFromObservable(this.expressionChanges);
+        this.onInit = outputFromObservable(this.init);
         effect(() => {
             this.language();
             this.enableTranslations();
@@ -2163,16 +2171,19 @@ class DynamicFormComponent {
         const field = this.getField(path);
         return field?.formControl ?? null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormComponent, deps: [{ token: DynamicFormService }, { token: DynamicFormTemplateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormComponent, isStandalone: false, selector: "dynamic-form", inputs: { globalTemplatePrefix: { classPropertyName: "globalTemplatePrefix", publicName: "globalTemplatePrefix", isSignal: true, isRequired: false, transformFunction: null }, 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 }, legacyLabels: { classPropertyName: "legacyLabels", publicName: "legacyLabels", 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", onFieldChanges: "onFieldChanges", onValueChanges: "onValueChanges", onExpressionChanges: "onExpressionChanges", onInit: "onInit" }, providers: [DynamicFormTemplateService], 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}.dynamic-form-field>.field-label{position:relative}.dynamic-form-field>.field-label>.field-description{font-size:.95em;font-weight:400;color:#777;margin:0}\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 { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormComponent, deps: [{ token: DynamicFormService }, { token: DynamicFormTemplateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.22", type: DynamicFormComponent, isStandalone: false, selector: "dynamic-form", inputs: { globalTemplatePrefix: { classPropertyName: "globalTemplatePrefix", publicName: "globalTemplatePrefix", isSignal: true, isRequired: false, transformFunction: null }, 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 }, legacyLabels: { classPropertyName: "legacyLabels", publicName: "legacyLabels", 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", onFieldChanges: "onFieldChanges", onValueChanges: "onValueChanges", onExpressionChanges: "onExpressionChanges", onInit: "onInit" }, providers: [DynamicFormTemplateService], 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}.dynamic-form-field>.field-label{position:relative}.dynamic-form-field>.field-label>.field-description{font-size:.95em;font-weight:400;color:#777;margin:0}\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.19", ngImport: i0, type: DynamicFormComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [DynamicFormTemplateService], 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}.dynamic-form-field>.field-label{position:relative}.dynamic-form-field>.field-label>.field-description{font-size:.95em;font-weight:400;color:#777;margin:0}\n"] }]
         }], ctorParameters: () => [{ type: DynamicFormService }, { type: DynamicFormTemplateService }] });
 
 class DynamicFormArrayComponent extends FieldArrayType {
-    currentTab = signal(0);
+    constructor() {
+        super(...arguments);
+        this.currentTab = signal(0);
+    }
     clearItems() {
         const control = this.formControl;
         while (control.length > 0) {
@@ -2190,29 +2201,41 @@ class DynamicFormArrayComponent extends FieldArrayType {
         const length = this.field.fieldGroup.length;
         this.currentTab.set(Math.min(this.currentTab(), length - 1));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormArrayComponent, isStandalone: false, selector: "dynamic-form-array", usesInheritance: true, ngImport: i0, template: "@let label = !props.label || props.hideLabel ? null : props.label | translate;\n@if (field.display) {\n    @if (label) {\n        <label class=\"field-label\">\n            <span [innerHTML]=\"label | safe: 'html'\"></span>\n            <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n            @if (props.markRequired) {\n                <span class=\"field-required\" aria-hidden=\"true\">*</span>\n            }\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\" [attr.data-testid]=\"field.testId + '-remove-item-' + ix\" (click)=\"removeItem(ix)\"></btn>\n                        }\n                        @if (itemField.insertItem) {\n                            <btn icon=\"plus\" [attr.data-testid]=\"field.testId + '-insert-item-' + ix\" (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 [attr.data-testid]=\"field.testId + '-clear-items'\" icon=\"trash\" label=\"button.clear-items\" (click)=\"clearItems()\"></btn>\n            }\n            @if (props.addItem) {\n                <btn [attr.data-testid]=\"field.testId + '-add-item'\" icon=\"plus\" label=\"button.insert-item\" (click)=\"addItem()\"></btn>\n            }\n        </div>\n\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\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", "path", "classes"] }, { kind: "component", type: i2.BtnComponent, selector: "btn", inputs: ["label", "tooltip", "icon", "disabled", "path", "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: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.GetValuePipe, name: "getValue" }, { kind: "pipe", type: i2.SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.22", type: DynamicFormArrayComponent, isStandalone: false, selector: "dynamic-form-array", usesInheritance: true, ngImport: i0, template: "@let label = !props.label || props.hideLabel ? null : props.label | translate;\n@if (field.display) {\n    @if (label) {\n        <label class=\"field-label\">\n            <span [innerHTML]=\"label | safe: 'html'\"></span>\n            <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n            @if (props.markRequired) {\n                <span class=\"field-required\" aria-hidden=\"true\">*</span>\n            }\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\" [attr.data-testid]=\"field.testId + '-remove-item-' + ix\" (click)=\"removeItem(ix)\"></btn>\n                        }\n                        @if (itemField.insertItem) {\n                            <btn icon=\"plus\" [attr.data-testid]=\"field.testId + '-insert-item-' + ix\" (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 [attr.data-testid]=\"field.testId + '-clear-items'\" icon=\"trash\" label=\"button.clear-items\" (click)=\"clearItems()\"></btn>\n            }\n            @if (props.addItem) {\n                <btn [attr.data-testid]=\"field.testId + '-add-item'\" icon=\"plus\" label=\"button.insert-item\" (click)=\"addItem()\"></btn>\n            }\n        </div>\n\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\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", "path", "classes"] }, { kind: "component", type: i2.BtnComponent, selector: "btn", inputs: ["label", "tooltip", "icon", "disabled", "path", "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: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.GetValuePipe, name: "getValue" }, { kind: "pipe", type: i2.SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormArrayComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormArrayComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-array", encapsulation: ViewEncapsulation.None, template: "@let label = !props.label || props.hideLabel ? null : props.label | translate;\n@if (field.display) {\n    @if (label) {\n        <label class=\"field-label\">\n            <span [innerHTML]=\"label | safe: 'html'\"></span>\n            <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n            @if (props.markRequired) {\n                <span class=\"field-required\" aria-hidden=\"true\">*</span>\n            }\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\" [attr.data-testid]=\"field.testId + '-remove-item-' + ix\" (click)=\"removeItem(ix)\"></btn>\n                        }\n                        @if (itemField.insertItem) {\n                            <btn icon=\"plus\" [attr.data-testid]=\"field.testId + '-insert-item-' + ix\" (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 [attr.data-testid]=\"field.testId + '-clear-items'\" icon=\"trash\" label=\"button.clear-items\" (click)=\"clearItems()\"></btn>\n            }\n            @if (props.addItem) {\n                <btn [attr.data-testid]=\"field.testId + '-add-item'\" icon=\"plus\" label=\"button.insert-item\" (click)=\"addItem()\"></btn>\n            }\n        </div>\n\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\n"] }]
         }] });
 
 class DynamicFormChipsComponent extends DynamicFieldType {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", 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       [strict]=\"props.strict\"\n       [options]=\"props.options | formlySelectOptions | async\"\n       [testId]=\"field.testId\"\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: ["testId", "value", "multiple", "disabled", "type", "min", "max", "minLength", "maxLength", "step", "placeholder", "unique", "strict", "options"], outputs: ["valueChange"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.LegacyFormlySelectOptionsPipe, name: "formlySelectOptions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.22", 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       [strict]=\"props.strict\"\n       [options]=\"props.options | formlySelectOptions | async\"\n       [testId]=\"field.testId\"\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: ["testId", "value", "multiple", "disabled", "type", "min", "max", "minLength", "maxLength", "step", "placeholder", "unique", "strict", "options"], outputs: ["valueChange"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.LegacyFormlySelectOptionsPipe, name: "formlySelectOptions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormChipsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormChipsComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-chips", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, 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       [strict]=\"props.strict\"\n       [options]=\"props.options | formlySelectOptions | async\"\n       [testId]=\"field.testId\"\n       [formlyAttributes]=\"field\">\n</chips>\n" }]
         }] });
 
+class DynamicFormEditorComponent extends DynamicFieldType {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.22", type: DynamicFormEditorComponent, isStandalone: false, selector: "dynamic-form-editor", usesInheritance: true, ngImport: i0, template: "<code-editor [lang]=\"props.type\"\n             [formControl]=\"formControl\"\n             [formlyAttributes]=\"field\">\n</code-editor>\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.CodeEditorComponent, selector: "code-editor", inputs: ["value", "lang", "disabled"], 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.22", ngImport: i0, type: DynamicFormEditorComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: false, selector: "dynamic-form-editor", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<code-editor [lang]=\"props.type\"\n             [formControl]=\"formControl\"\n             [formlyAttributes]=\"field\">\n</code-editor>\n" }]
+        }] });
+
 class DynamicFormPasswordComponent extends DynamicFieldType {
-    type = signal("password");
-    icon = computed(() => {
-        return this.type() === "password" ? "eye" : "eye-slash";
-    });
-    input = viewChild.required("input");
+    constructor() {
+        super(...arguments);
+        this.type = signal("password");
+        this.icon = computed(() => {
+            return this.type() === "password" ? "eye" : "eye-slash";
+        });
+        this.input = viewChild.required("input");
+    }
     switchType() {
         const el = this.input().nativeElement;
         const start = el.selectionStart;
@@ -2223,27 +2246,24 @@ class DynamicFormPasswordComponent extends DynamicFieldType {
             el.setSelectionRange(start, end);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormPasswordComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.19", type: DynamicFormPasswordComponent, isStandalone: false, selector: "dynamic-form-password", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"form-password-group\">\n    <input #input\n           class=\"form-control\"\n           [attr.type]=\"type()\"\n           [attr.data-testid]=\"field.testId\"\n           [formControl]=\"formControl\"\n           [formlyAttributes]=\"field\" />\n    <btn type=\"transparent\"\n         [icon]=\"icon()\"\n         [attr.data-testid]=\"field.testId + '-toggle'\"\n         (mousedown)=\"switchType()\"></btn>\n</div>\n", styles: [".form-password-group{position:relative}.form-password-group btn{display:block;position:absolute;aspect-ratio:1;top:0;bottom:0;right:0}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2.BtnComponent, selector: "btn", inputs: ["label", "tooltip", "icon", "disabled", "path", "type", "size"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormPasswordComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.22", type: DynamicFormPasswordComponent, isStandalone: false, selector: "dynamic-form-password", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"form-password-group\">\n    <input #input\n           class=\"form-control\"\n           [attr.type]=\"type()\"\n           [attr.data-testid]=\"field.testId\"\n           [formControl]=\"formControl\"\n           [formlyAttributes]=\"field\" />\n    <btn type=\"transparent\"\n         [icon]=\"icon()\"\n         [attr.data-testid]=\"field.testId + '-toggle'\"\n         (mousedown)=\"switchType()\"></btn>\n</div>\n", styles: [".form-password-group{position:relative}.form-password-group btn{display:block;position:absolute;aspect-ratio:1;top:0;bottom:0;right:0}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2.BtnComponent, selector: "btn", inputs: ["label", "tooltip", "icon", "disabled", "path", "type", "size"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormPasswordComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormPasswordComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-password", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-password-group\">\n    <input #input\n           class=\"form-control\"\n           [attr.type]=\"type()\"\n           [attr.data-testid]=\"field.testId\"\n           [formControl]=\"formControl\"\n           [formlyAttributes]=\"field\" />\n    <btn type=\"transparent\"\n         [icon]=\"icon()\"\n         [attr.data-testid]=\"field.testId + '-toggle'\"\n         (mousedown)=\"switchType()\"></btn>\n</div>\n", styles: [".form-password-group{position:relative}.form-password-group btn{display:block;position:absolute;aspect-ratio:1;top:0;bottom:0;right:0}\n"] }]
         }] });
 
 class DynamicFormStaticComponent extends DynamicFieldType {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormStaticComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DynamicFormStaticComponent, isStandalone: false, selector: "dynamic-form-chips", usesInheritance: true, ngImport: i0, template: "<unordered-list [listStyle]=\"props.style\" [ngClass]=\"{disabled: props.disabled}\"\n                [data]=\"!props.properties ? {value: value} : props.properties | remap: value\">\n    <ng-template [type]=\"!props.properties ? 'key' : null\" selector=\"level == 0\" let-item=\"item\"></ng-template>\n    <ng-template type=\"value\" selector=\"valueType == 'date'\" let-item=\"item\">\n        {{ item.value | date }}\n    </ng-template>\n</unordered-list>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.UnorderedListTemplateDirective, selector: "ng-template[type][selector]", inputs: ["type", "selector"] }, { kind: "component", type: i2.UnorderedListComponent, selector: "unordered-list", inputs: ["data", "keyPrefix", "listStyle", "path", "level", "templates"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i2.RemapPipe, name: "remap" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormStaticComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.22", type: DynamicFormStaticComponent, isStandalone: false, selector: "dynamic-form-chips", usesInheritance: true, ngImport: i0, template: "<unordered-list [listStyle]=\"props.style\" [ngClass]=\"{disabled: props.disabled}\"\n                [data]=\"!props.properties ? {value: value} : props.properties | remap: value\">\n    <ng-template [type]=\"!props.properties ? 'key' : null\" selector=\"level == 0\" let-item=\"item\"></ng-template>\n    <ng-template type=\"value\" selector=\"valueType == 'date'\" let-item=\"item\">\n        {{ item.value | date }}\n    </ng-template>\n</unordered-list>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.UnorderedListTemplateDirective, selector: "ng-template[type][selector]", inputs: ["type", "selector"] }, { kind: "component", type: i2.UnorderedListComponent, selector: "unordered-list", inputs: ["data", "keyPrefix", "listStyle", "path", "level", "templates"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i2.RemapPipe, name: "remap" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormStaticComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormStaticComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-chips", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<unordered-list [listStyle]=\"props.style\" [ngClass]=\"{disabled: props.disabled}\"\n                [data]=\"!props.properties ? {value: value} : props.properties | remap: value\">\n    <ng-template [type]=\"!props.properties ? 'key' : null\" selector=\"level == 0\" let-item=\"item\"></ng-template>\n    <ng-template type=\"value\" selector=\"valueType == 'date'\" let-item=\"item\">\n        {{ item.value | date }}\n    </ng-template>\n</unordered-list>\n" }]
         }] });
 
 class DynamicFormTranslationComponent extends DynamicFormArrayComponent {
-    events;
-    language;
-    subscription;
     constructor(events, language) {
         super();
         this.events = events;
@@ -2269,10 +2289,10 @@ class DynamicFormTranslationComponent extends DynamicFormArrayComponent {
         }
         this.currentTab.set(index);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTranslationComponent, deps: [{ token: i2.EventsService }, { token: LANGUAGE_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormTranslationComponent, isStandalone: false, selector: "dynamic-form-translation", 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            @if (props.markRequired) {\n                <span class=\"field-required\" aria-hidden=\"true\">*</span>\n            }\n        </label>\n    }\n    <div class=\"field-container\">\n        @for (itemField of field.fieldGroup; track itemField.key; let ix = $index) {\n            @if (ix === currentTab()) {\n                <formly-field [field]=\"itemField\"></formly-field>\n            }\n        }\n\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTranslationComponent, deps: [{ token: i2.EventsService }, { token: LANGUAGE_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.22", type: DynamicFormTranslationComponent, isStandalone: false, selector: "dynamic-form-translation", 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            @if (props.markRequired) {\n                <span class=\"field-required\" aria-hidden=\"true\">*</span>\n            }\n        </label>\n    }\n    <div class=\"field-container\">\n        @for (itemField of field.fieldGroup; track itemField.key; let ix = $index) {\n            @if (ix === currentTab()) {\n                <formly-field [field]=\"itemField\"></formly-field>\n            }\n        }\n\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { 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.19", ngImport: i0, type: DynamicFormTranslationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormTranslationComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-translation", encapsulation: ViewEncapsulation.None, 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            @if (props.markRequired) {\n                <span class=\"field-required\" aria-hidden=\"true\">*</span>\n            }\n        </label>\n    }\n    <div class=\"field-container\">\n        @for (itemField of field.fieldGroup; track itemField.key; let ix = $index) {\n            @if (ix === currentTab()) {\n                <formly-field [field]=\"itemField\"></formly-field>\n            }\n        }\n\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\n"] }]
         }], ctorParameters: () => [{ type: i2.EventsService }, { type: undefined, decorators: [{
@@ -2281,19 +2301,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
                 }] }] });
 
 class DynamicFormUploadComponent extends DynamicFieldType {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormUploadComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", 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 { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormUploadComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.22", 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.19", ngImport: i0, type: DynamicFormUploadComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormUploadComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-upload", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, 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" }]
         }] });
 
 class DynamicFormWysiwygComponent extends DynamicFieldType {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormWysiwygComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DynamicFormWysiwygComponent, isStandalone: false, selector: "dynamic-form-wysiwyg", usesInheritance: true, ngImport: i0, template: "<wysiwyg [formControl]=\"formControl\"\n         [formlyAttributes]=\"field\">\n</wysiwyg>\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.WysiwygComponent, selector: "wysiwyg", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormWysiwygComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.22", type: DynamicFormWysiwygComponent, isStandalone: false, selector: "dynamic-form-wysiwyg", usesInheritance: true, ngImport: i0, template: "<wysiwyg [formControl]=\"formControl\"\n         [formlyAttributes]=\"field\">\n</wysiwyg>\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.WysiwygComponent, selector: "wysiwyg", inputs: ["value", "disabled"], 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.19", ngImport: i0, type: DynamicFormWysiwygComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormWysiwygComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-wysiwyg", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<wysiwyg [formControl]=\"formControl\"\n         [formlyAttributes]=\"field\">\n</wysiwyg>\n" }]
         }] });
@@ -2302,28 +2322,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
  * This is just a test wrapper component
  */
 class DynamicFormAlertComponent extends FieldWrapper {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormAlertComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", 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 { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormAlertComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.22", 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.19", ngImport: i0, type: DynamicFormAlertComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormAlertComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-alert", encapsulation: ViewEncapsulation.None, 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"] }]
         }] });
 
 class DynamicFormFieldComponent extends FieldWrapper {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormFieldComponent, isStandalone: false, selector: "dynamic-form-field", usesInheritance: true, ngImport: i0, template: "<ng-template #innerLabelTemplate let-label=\"label\">\n    <label class=\"field-label\" [for]=\"id\">\n        <span [innerHTML]=\"label | safe: 'html'\"></span>\n        @if (props.markRequired) {\n            <span class=\"field-required\" aria-hidden=\"true\">*</span>\n        }\n        @if (props.description) {\n            <p class=\"field-description\" [innerHTML]=\"props.description | translate | safe: 'html'\"></p>\n        }\n    </label>\n</ng-template>\n<ng-template #labelTemplate>\n    @let label = !props.label || props.hideLabel ? null : props.label | translate;\n    @if (label) {\n        <ng-container [ngxTemplateOutlet]=\"(field | dynamicFormTemplate : 'label') || innerLabelTemplate\"\n                      [context]=\"field\"\n                      [additionalContext]=\"{label: label}\"></ng-container>\n    }\n</ng-template>\n<ng-template #inputTemplate>\n    <ng-container #fieldComponent></ng-container>\n</ng-template>\n<ng-template #controlTemplate>\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'prefix'\"\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\n    @if (props.labelAlign === \"before\") {\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\n    }\n    <div class=\"field-container\">\n        <ng-container [ngTemplateOutlet]=\"(field | dynamicFormTemplate : 'input') || inputTemplate\"\n                      [ngTemplateOutletContext]=\"field\"></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    @if (props.labelAlign === \"after\") {\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\n    }\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'suffix'\"\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\n</ng-template>\n<ng-container [ngTemplateOutlet]=\"(field | dynamicFormTemplate : 'control') || controlTemplate\"\n              [ngTemplateOutletContext]=\"field\"></ng-container>\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.NgxTemplateOutletDirective, selector: "[ngxTemplateOutlet]", inputs: ["context", "additionalContext", "ngxTemplateOutlet"] }, { kind: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DynamicFormTemplatePipe, name: "dynamicFormTemplate" }], encapsulation: i0.ViewEncapsulation.None });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.22", type: DynamicFormFieldComponent, isStandalone: false, selector: "dynamic-form-field", usesInheritance: true, ngImport: i0, template: "<ng-template #innerLabelTemplate let-label=\"label\">\n    <label class=\"field-label\" [for]=\"id\">\n        <span [innerHTML]=\"label | safe: 'html'\"></span>\n        @if (props.markRequired) {\n            <span class=\"field-required\" aria-hidden=\"true\">*</span>\n        }\n        @if (props.description) {\n            <p class=\"field-description\" [innerHTML]=\"props.description | translate | safe: 'html'\"></p>\n        }\n    </label>\n</ng-template>\n<ng-template #labelTemplate>\n    @let label = !props.label || props.hideLabel ? null : props.label | translate;\n    @if (label) {\n        <ng-container [ngxTemplateOutlet]=\"(field | dynamicFormTemplate : 'label') || innerLabelTemplate\"\n                      [context]=\"field\"\n                      [additionalContext]=\"{label: label}\"></ng-container>\n    }\n</ng-template>\n<ng-template #inputTemplate>\n    <ng-container #fieldComponent></ng-container>\n</ng-template>\n<ng-template #controlTemplate>\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'prefix'\"\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\n    @if (props.labelAlign === \"before\") {\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\n    }\n    <div class=\"field-container\">\n        <ng-container [ngTemplateOutlet]=\"(field | dynamicFormTemplate : 'input') || inputTemplate\"\n                      [ngTemplateOutletContext]=\"field\"></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    @if (props.labelAlign === \"after\") {\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\n    }\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'suffix'\"\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\n</ng-template>\n<ng-container [ngTemplateOutlet]=\"(field | dynamicFormTemplate : 'control') || controlTemplate\"\n              [ngTemplateOutletContext]=\"field\"></ng-container>\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.NgxTemplateOutletDirective, selector: "[ngxTemplateOutlet]", inputs: ["context", "additionalContext", "ngxTemplateOutlet"] }, { kind: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DynamicFormTemplatePipe, name: "dynamicFormTemplate" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-field", encapsulation: ViewEncapsulation.None, template: "<ng-template #innerLabelTemplate let-label=\"label\">\n    <label class=\"field-label\" [for]=\"id\">\n        <span [innerHTML]=\"label | safe: 'html'\"></span>\n        @if (props.markRequired) {\n            <span class=\"field-required\" aria-hidden=\"true\">*</span>\n        }\n        @if (props.description) {\n            <p class=\"field-description\" [innerHTML]=\"props.description | translate | safe: 'html'\"></p>\n        }\n    </label>\n</ng-template>\n<ng-template #labelTemplate>\n    @let label = !props.label || props.hideLabel ? null : props.label | translate;\n    @if (label) {\n        <ng-container [ngxTemplateOutlet]=\"(field | dynamicFormTemplate : 'label') || innerLabelTemplate\"\n                      [context]=\"field\"\n                      [additionalContext]=\"{label: label}\"></ng-container>\n    }\n</ng-template>\n<ng-template #inputTemplate>\n    <ng-container #fieldComponent></ng-container>\n</ng-template>\n<ng-template #controlTemplate>\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'prefix'\"\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\n    @if (props.labelAlign === \"before\") {\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\n    }\n    <div class=\"field-container\">\n        <ng-container [ngTemplateOutlet]=\"(field | dynamicFormTemplate : 'input') || inputTemplate\"\n                      [ngTemplateOutletContext]=\"field\"></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    @if (props.labelAlign === \"after\") {\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\n    }\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'suffix'\"\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\n</ng-template>\n<ng-container [ngTemplateOutlet]=\"(field | dynamicFormTemplate : 'control') || controlTemplate\"\n              [ngTemplateOutletContext]=\"field\"></ng-container>\n" }]
         }] });
 
 class DynamicFormFieldsetComponent extends FieldWrapper {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormFieldsetComponent, isStandalone: false, selector: "dynamic-form-fieldset", usesInheritance: true, ngImport: i0, template: "@let label = !props.label || props.hideLabel || field.parent.props.useTabs ? null : props.label | translate;\r\n@if (field.display) {\r\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'prefix'\"\r\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\r\n    <legend class=\"field-legend\" *ngIf=\"label\">\r\n        <span [innerHTML]=\"label | safe: 'html'\"></span>\r\n    </legend>\r\n    <div class=\"field-container\">\r\n        @for (itemField of field.fieldGroup; track itemField) {\r\n            @if (itemField.display) {\r\n                <formly-field [field]=\"itemField\"></formly-field>\r\n            }\r\n        }\r\n    </div>\r\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'suffix'\"\r\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\r\n}\r\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: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DynamicFormTemplatePipe, name: "dynamicFormTemplate" }], encapsulation: i0.ViewEncapsulation.None });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.22", type: DynamicFormFieldsetComponent, isStandalone: false, selector: "dynamic-form-fieldset", usesInheritance: true, ngImport: i0, template: "@let label = !props.label || props.hideLabel || field.parent.props.useTabs ? null : props.label | translate;\r\n@if (field.display) {\r\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'prefix'\"\r\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\r\n    <legend class=\"field-legend\" *ngIf=\"label\">\r\n        <span [innerHTML]=\"label | safe: 'html'\"></span>\r\n    </legend>\r\n    <div class=\"field-container\">\r\n        @for (itemField of field.fieldGroup; track itemField) {\r\n            @if (itemField.display) {\r\n                <formly-field [field]=\"itemField\"></formly-field>\r\n            }\r\n        }\r\n    </div>\r\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'suffix'\"\r\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\r\n}\r\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: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DynamicFormTemplatePipe, name: "dynamicFormTemplate" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldsetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormFieldsetComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-fieldset", encapsulation: ViewEncapsulation.None, template: "@let label = !props.label || props.hideLabel || field.parent.props.useTabs ? null : props.label | translate;\r\n@if (field.display) {\r\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'prefix'\"\r\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\r\n    <legend class=\"field-legend\" *ngIf=\"label\">\r\n        <span [innerHTML]=\"label | safe: 'html'\"></span>\r\n    </legend>\r\n    <div class=\"field-container\">\r\n        @for (itemField of field.fieldGroup; track itemField) {\r\n            @if (itemField.display) {\r\n                <formly-field [field]=\"itemField\"></formly-field>\r\n            }\r\n        }\r\n    </div>\r\n    <ng-container [ngTemplateOutlet]=\"field | dynamicFormTemplate : 'suffix'\"\r\n                  [ngTemplateOutletContext]=\"field\"></ng-container>\r\n}\r\n" }]
         }] });
@@ -2332,10 +2352,10 @@ class DynamicFormGroupComponent extends FieldWrapper {
     get parent() {
         return this.field?.parent;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormGroupComponent, isStandalone: false, selector: "dynamic-form-group", usesInheritance: true, ngImport: i0, template: "<ng-template #innerLabelTemplate let-label=\"label\">\r\n    <label class=\"field-label\" [for]=\"id\">\r\n        <span [innerHTML]=\"label | safe: 'html'\"></span>\r\n        @if (props.markRequired) {\r\n            <span class=\"field-required\" aria-hidden=\"true\">*</span>\r\n        }\r\n        @if (props.description) {\r\n            <p class=\"field-description\" [innerHTML]=\"props.description | translate | safe: 'html'\"></p>\r\n        }\r\n    </label>\r\n</ng-template>\r\n<ng-template #labelTemplate>\r\n    @let label = !props.label || props.hideLabel || parent?.props?.useTabs ? null : props.label | translate;\r\n    @if (label) {\r\n        <ng-container [ngxTemplateOutlet]=\"(field | dynamicFormTemplate : 'label') || innerLabelTemplate\"\r\n                      [context]=\"field\"\r\n                      [additionalContext]=\"{label: label}\"></ng-container>\r\n    }\r\n</ng-template>\r\n@if (field.display) {\r\n    @if (props.labelAlign === \"before\") {\r\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\r\n    }\r\n    <tabs class=\"field-container\" [testId]=\"(field.testId || 'form') + '-tab'\">\r\n        @for (itemField of field.fieldGroup; track itemField) {\r\n            @if (itemField.display) {\r\n                @if (props.useTabs && itemField.fieldGroup) {\r\n                    <div class=\"form-fieldset-item\"\r\n                         [tabsItem]=\"itemField.id\"\r\n                         [classes]=\"['form-fieldset-tab', itemField.valid === false ? 'invalid' : 'valid']\"\r\n                         [label]=\"itemField.props.label\">\r\n                        <formly-field [field]=\"itemField\"></formly-field>\r\n                    </div>\r\n                } @else {\r\n                    <formly-field [field]=\"itemField\"></formly-field>\r\n                }\r\n            }\r\n        }\r\n        @if (showError && field.key !== null) {\r\n            <div *ngIf=\"showError\" class=\"field-errors invalid-feedback\">\r\n                <formly-validation-message\r\n                    [field]=\"field\"\r\n                    id=\"{{ id }}-formly-validation-error\"\r\n                    role=\"alert\"\r\n                ></formly-validation-message>\r\n            </div>\r\n        }\r\n    </tabs>\r\n    @if (props.labelAlign === \"after\") {\r\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\r\n    }\r\n}\r\n", styles: [".dynamic-form-group>.field-container{overflow:hidden}.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: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgxTemplateOutletDirective, selector: "[ngxTemplateOutlet]", inputs: ["context", "additionalContext", "ngxTemplateOutlet"] }, { kind: "directive", type: i2.TabsItemDirective, selector: "[tabsItem]", inputs: ["tabsItem", "label", "tooltip", "icon", "disabled", "path", "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: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DynamicFormTemplatePipe, name: "dynamicFormTemplate" }], encapsulation: i0.ViewEncapsulation.None });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.22", type: DynamicFormGroupComponent, isStandalone: false, selector: "dynamic-form-group", usesInheritance: true, ngImport: i0, template: "<ng-template #innerLabelTemplate let-label=\"label\">\r\n    <label class=\"field-label\" [for]=\"id\">\r\n        <span [innerHTML]=\"label | safe: 'html'\"></span>\r\n        @if (props.markRequired) {\r\n            <span class=\"field-required\" aria-hidden=\"true\">*</span>\r\n        }\r\n        @if (props.description) {\r\n            <p class=\"field-description\" [innerHTML]=\"props.description | translate | safe: 'html'\"></p>\r\n        }\r\n    </label>\r\n</ng-template>\r\n<ng-template #labelTemplate>\r\n    @let label = !props.label || props.hideLabel || parent?.props?.useTabs ? null : props.label | translate;\r\n    @if (label) {\r\n        <ng-container [ngxTemplateOutlet]=\"(field | dynamicFormTemplate : 'label') || innerLabelTemplate\"\r\n                      [context]=\"field\"\r\n                      [additionalContext]=\"{label: label}\"></ng-container>\r\n    }\r\n</ng-template>\r\n@if (field.display) {\r\n    @if (props.labelAlign === \"before\") {\r\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\r\n    }\r\n    <tabs class=\"field-container\" [testId]=\"(field.testId || 'form') + '-tab'\">\r\n        @for (itemField of field.fieldGroup; track itemField) {\r\n            @if (itemField.display) {\r\n                @if (props.useTabs && itemField.fieldGroup) {\r\n                    <div class=\"form-fieldset-item\"\r\n                         [tabsItem]=\"itemField.id\"\r\n                         [classes]=\"['form-fieldset-tab', itemField.valid === false ? 'invalid' : 'valid']\"\r\n                         [label]=\"itemField.props.label\">\r\n                        <formly-field [field]=\"itemField\"></formly-field>\r\n                    </div>\r\n                } @else {\r\n                    <formly-field [field]=\"itemField\"></formly-field>\r\n                }\r\n            }\r\n        }\r\n        @if (showError && field.key !== null) {\r\n            <div *ngIf=\"showError\" class=\"field-errors invalid-feedback\">\r\n                <formly-validation-message\r\n                    [field]=\"field\"\r\n                    id=\"{{ id }}-formly-validation-error\"\r\n                    role=\"alert\"\r\n                ></formly-validation-message>\r\n            </div>\r\n        }\r\n    </tabs>\r\n    @if (props.labelAlign === \"after\") {\r\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\r\n    }\r\n}\r\n", styles: [".dynamic-form-group>.field-container{overflow:hidden}.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: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgxTemplateOutletDirective, selector: "[ngxTemplateOutlet]", inputs: ["context", "additionalContext", "ngxTemplateOutlet"] }, { kind: "directive", type: i2.TabsItemDirective, selector: "[tabsItem]", inputs: ["tabsItem", "label", "tooltip", "icon", "disabled", "path", "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: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DynamicFormTemplatePipe, name: "dynamicFormTemplate" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: DynamicFormGroupComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: "dynamic-form-group", encapsulation: ViewEncapsulation.None, template: "<ng-template #innerLabelTemplate let-label=\"label\">\r\n    <label class=\"field-label\" [for]=\"id\">\r\n        <span [innerHTML]=\"label | safe: 'html'\"></span>\r\n        @if (props.markRequired) {\r\n            <span class=\"field-required\" aria-hidden=\"true\">*</span>\r\n        }\r\n        @if (props.description) {\r\n            <p class=\"field-description\" [innerHTML]=\"props.description | translate | safe: 'html'\"></p>\r\n        }\r\n    </label>\r\n</ng-template>\r\n<ng-template #labelTemplate>\r\n    @let label = !props.label || props.hideLabel || parent?.props?.useTabs ? null : props.label | translate;\r\n    @if (label) {\r\n        <ng-container [ngxTemplateOutlet]=\"(field | dynamicFormTemplate : 'label') || innerLabelTemplate\"\r\n                      [context]=\"field\"\r\n                      [additionalContext]=\"{label: label}\"></ng-container>\r\n    }\r\n</ng-template>\r\n@if (field.display) {\r\n    @if (props.labelAlign === \"before\") {\r\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\r\n    }\r\n    <tabs class=\"field-container\" [testId]=\"(field.testId || 'form') + '-tab'\">\r\n        @for (itemField of field.fieldGroup; track itemField) {\r\n            @if (itemField.display) {\r\n                @if (props.useTabs && itemField.fieldGroup) {\r\n                    <div class=\"form-fieldset-item\"\r\n                         [tabsItem]=\"itemField.id\"\r\n                         [classes]=\"['form-fieldset-tab', itemField.valid === false ? 'invalid' : 'valid']\"\r\n                         [label]=\"itemField.props.label\">\r\n                        <formly-field [field]=\"itemField\"></formly-field>\r\n                    </div>\r\n                } @else {\r\n                    <formly-field [field]=\"itemField\"></formly-field>\r\n                }\r\n            }\r\n        }\r\n        @if (showError && field.key !== null) {\r\n            <div *ngIf=\"showError\" class=\"field-errors invalid-feedback\">\r\n                <formly-validation-message\r\n                    [field]=\"field\"\r\n                    id=\"{{ id }}-formly-validation-error\"\r\n                    role=\"alert\"\r\n                ></formly-validation-message>\r\n            </div>\r\n        }\r\n    </tabs>\r\n    @if (props.labelAlign === \"after\") {\r\n        <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\r\n    }\r\n}\r\n", styles: [".dynamic-form-group>.field-container{overflow:hidden}.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"] }]
         }] });
@@ -2346,6 +2366,7 @@ const components = [
     DynamicFormComponent,
     DynamicFormArrayComponent,
     DynamicFormChipsComponent,
+    DynamicFormEditorComponent,
     DynamicFormPasswordComponent,
     DynamicFormStaticComponent,
     DynamicFormTranslationComponent,
@@ -2374,6 +2395,7 @@ class NgxDynamicFormModule {
                 types: [
                     { name: "array", component: DynamicFormArrayComponent },
                     { name: "chips", component: DynamicFormChipsComponent },
+                    { name: "editor", component: DynamicFormEditorComponent },
                     { name: "password", component: DynamicFormPasswordComponent },
                     { name: "static", component: DynamicFormStaticComponent },
                     { name: "translation", component: DynamicFormTranslationComponent },
@@ -2413,18 +2435,18 @@ class NgxDynamicFormModule {
     static provideForms(config) {
         return makeEnvironmentProviders(NgxDynamicFormModule.getProviders(config));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, declarations: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormPasswordComponent, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective, DynamicFormTemplateDirective, DynamicFormTemplatePipe], imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: NgxDynamicFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.22", ngImport: i0, type: NgxDynamicFormModule, declarations: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormEditorComponent, DynamicFormPasswordComponent, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective, DynamicFormTemplateDirective, DynamicFormTemplatePipe], imports: [CommonModule,
             FormsModule,
             ReactiveFormsModule,
             NgxUtilsModule,
             FormlyModule,
-            FormlySelectModule], exports: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormPasswordComponent, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective, DynamicFormTemplateDirective, DynamicFormTemplatePipe, FormsModule,
+            FormlySelectModule], exports: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormEditorComponent, DynamicFormPasswordComponent, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective, DynamicFormTemplateDirective, DynamicFormTemplatePipe, FormsModule,
             ReactiveFormsModule,
             NgxUtilsModule,
             FormlyModule,
-            FormlySelectModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, providers: [
+            FormlySelectModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: NgxDynamicFormModule, providers: [
             ...pipes
         ], imports: [CommonModule,
             FormsModule,
@@ -2435,9 +2457,9 @@ class NgxDynamicFormModule {
             ReactiveFormsModule,
             NgxUtilsModule,
             FormlyModule,
-            FormlySelectModule] });
+            FormlySelectModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.22", ngImport: i0, type: NgxDynamicFormModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -2473,5 +2495,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AsyncSubmitDirective, DEFAULT_NUMERIC_STEP, DynamicFieldType, DynamicFormAlertComponent, DynamicFormArrayComponent, DynamicFormBuilderService, DynamicFormChipsComponent, DynamicFormComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, DynamicFormPasswordComponent, DynamicFormSchemaService, DynamicFormService, DynamicFormStaticComponent, DynamicFormTemplateDirective, DynamicFormTemplatePipe, DynamicFormTemplateService, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, EDITOR_FORMATS, FORM_ROOT_ID, FormArray, FormFieldSet, FormGroup, FormInput, FormSelect, FormSerializable, FormStatic, FormUpload, MAX_INPUT_NUM, MIN_INPUT_NUM, NgxDynamicFormModule, RichTranslationModel, TranslationModel, addFieldValidators, arrayLengthValidation, clearFieldArray, controlStatus, controlValues, convertToDate, convertToDateFormat, convertToNumber, customizeFormField, emailValidation, enumValidation, getFieldByPath, getFieldsByKey, getFieldsByPredicate, getSelectOptions, insertToFieldArray, isFieldHidden, isFieldVisible, jsonValidation, maxLengthValidation, maxValueValidation, minLengthValidation, minValueValidation, phoneValidation, removeFieldValidators, removeFromFieldArray, replaceFieldArray, replaceSpecialChars, requiredValidation, setFieldDefault, setFieldDisabled, setFieldHidden, setFieldHooks, setFieldMinDate, setFieldProp, setFieldProps, setFieldSerialize, setFieldValue, translationValidation };
+export { AsyncSubmitDirective, DEFAULT_NUMERIC_STEP, DynamicFieldType, DynamicFormAlertComponent, DynamicFormArrayComponent, DynamicFormBuilderService, DynamicFormChipsComponent, DynamicFormComponent, DynamicFormEditorComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, DynamicFormPasswordComponent, DynamicFormSchemaService, DynamicFormService, DynamicFormStaticComponent, DynamicFormTemplateDirective, DynamicFormTemplatePipe, DynamicFormTemplateService, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, EDITOR_TYPES, FORM_ROOT_ID, FormArray, FormFieldSet, FormGroup, FormInput, FormSelect, FormSerializable, FormStatic, FormUpload, MAX_INPUT_NUM, MIN_INPUT_NUM, NgxDynamicFormModule, RichTranslationModel, TranslationModel, addFieldValidators, arrayLengthValidation, clearFieldArray, controlStatus, controlValues, convertToDate, convertToDateFormat, convertToNumber, customizeFormField, emailValidation, enumValidation, getFieldByPath, getFieldsByKey, getFieldsByPredicate, getSelectOptions, insertToFieldArray, isFieldHidden, isFieldVisible, jsonValidation, maxLengthValidation, maxValueValidation, minLengthValidation, minValueValidation, phoneValidation, removeFieldValidators, removeFromFieldArray, replaceFieldArray, replaceSpecialChars, requiredValidation, setFieldDefault, setFieldDisabled, setFieldHidden, setFieldHooks, setFieldMinDate, setFieldProp, setFieldProps, setFieldSerialize, setFieldValue, translationValidation };
 //# sourceMappingURL=stemy-ngx-dynamic-form.mjs.map