@mediusinc/mng-commons 5.0.0-rc.0 → 5.0.0-rc.2

package/fesm2022/mediusinc-mng-commons-tableview.mjs

@@ -1,10 +1,10 @@
 import * as i2 from '@angular/common';
 import { AsyncPipe, NgTemplateOutlet, JsonPipe, NgStyle, DatePipe } from '@angular/common';
 import * as i0 from '@angular/core';
-import { InjectionToken, Injectable, inject, Injector, EventEmitter, Component, ChangeDetectionStrategy, Optional, HostBinding, Input, Output, ViewChild, ContentChildren, DestroyRef, signal, effect, HostListener, ViewChildren, LOCALE_ID, Inject } from '@angular/core';
+import { InjectionToken, Injectable, inject, Injector, EventEmitter, Component, ChangeDetectionStrategy, Optional, HostBinding, Input, Output, ViewChild, DestroyRef, input, output, viewChild, signal, effect, HostListener, contentChildren, computed, ViewChildren, LOCALE_ID } from '@angular/core';
 import * as i1 from '@angular/router';
 import { NavigationEnd, Router, ActivatedRoute, NavigationStart, NavigationCancel, NavigationError, NavigationSkipped, RouterOutlet } from '@angular/router';
-import * as i2$1 from '@ngx-translate/core';
+import * as i1$1 from '@ngx-translate/core';
 import { TranslateService, TranslateModule } from '@ngx-translate/core';
 import * as i4 from 'primeng/button';
 import { ButtonModule } from 'primeng/button';
@@ -16,27 +16,27 @@ import * as i9 from 'primeng/splitbutton';
 import { SplitButtonModule } from 'primeng/splitbutton';
 import * as i8 from 'primeng/tooltip';
 import { TooltipModule } from 'primeng/tooltip';
-import { ReplaySubject, BehaviorSubject, distinctUntilChanged, Subject, take, of, switchMap, mergeMap as mergeMap$1, from, timeout, combineLatest, Observable, debounceTime, isObservable, throwError } from 'rxjs';
-import * as i1$1 from '@mediusinc/mng-commons/core';
-import { I18nUtils as I18nUtils$1, ErrorUtil, toastMessage, LoggerService, CommonsService, ParametrizePipe, StringUtil, toObservable, CommonsInternalError, StyleSizeEnum, CommonsHttpError, Permissions, boolean$Attribute, ComponentDirective, ObjectUtil, TemplateDirective, DialogKeydownHandlerDirective, Styles, StyleLevelEnum, FilterMatchMode, RouteBuilder, CommonsFeatureTypeEnum } from '@mediusinc/mng-commons/core';
-import { ActionActivationTriggerEnum, ActionTypeEnum, DataProviderExecutor, ActionDeleteDescriptorInst, ActionEditorEditDescriptorInst, ActionEditorAddDescriptorInst, ActionEditorDescriptorInst, CommonsActionError, ActionLinkDescriptorInst, TableviewEditorTypeEnum, TableviewDescriptor, FieldInputDescriptor, FieldInputTypeEnum, FieldActionDescriptor, FieldLookupEnumDescriptor, FieldLookupTypeEnum, FieldLookupDescriptor, FieldManyToManyEditorDescriptor, FieldManyEditorDescriptor, FormEventTypeEnum, FormFieldEventComponentSubtype, ActionEditorSubmitTypeEnum, ActionEditorSubmitDescriptorInst, ActionPositionEnum, runFnFromDataProviderOrFallback, runGetAllFromDataProvider, runFetchFromDataProvider, runCreateFromDataProvider, runUpdateFromDataProvider, runDeleteFromDataProvider, FormFieldEventTypeEnum, FieldGroupTypeEnum, FormFieldEventDialogSubtype, FieldManyEditorActionEnum, ActionEditorDescriptor, ActionEditorSubmitDescriptor, ActionDescriptor, FieldManyToManyEditorActionEnum, TableviewActionDefaultCategories, ActionEditorDetailsDescriptorInst, DATA_LANGUAGE_DROPDOWN_COMPONENT_IT } from '@mediusinc/mng-commons/tableview/api';
+import { ReplaySubject, BehaviorSubject, distinctUntilChanged, Subject, take, of, switchMap, mergeMap as mergeMap$1, from, timeout, combineLatest, debounceTime, isObservable, throwError, filter as filter$1 } from 'rxjs';
+import * as i1$2 from '@mediusinc/mng-commons/core';
+import { getI18n, getI18nAsync, toastMessage, getI18nForError, LoggerService, CommonsService, ParametrizePipe, escapeHtmlAny, toObservable, CommonsInternalError, StyleSizeEnum, CommonsHttpError, Permissions, boolean$Attribute, ComponentDirective, objectDeepCopy, DialogKeydownHandlerDirective, Styles, TemplateDirective, findTemplateByName, fromSubscribeError, getErrorLogLevel, StyleLevelEnum, getObjectPropertyByPath, FilterMatchMode, COMMONS_MODULE_CONFIG_IT, dateToIsoString, RouteBuilder, createLazyRoute, CommonsFeatureTypeEnum } from '@mediusinc/mng-commons/core';
+import { ActionActivationTriggerEnum, ActionTypeEnum, DataProviderExecutor, ActionDeleteDescriptorInst, ActionEditorEditDescriptorInst, ActionEditorAddDescriptorInst, ActionEditorDescriptorInst, CommonsActionError, ActionLinkDescriptorInst, TableviewEditorTypeEnum, TableviewDescriptor, FieldInputDescriptor, FieldInputTypeEnum, FieldActionDescriptor, FieldLookupEnumDescriptor, FieldLookupTypeEnum, FieldLookupDescriptor, FieldManyToManyEditorDescriptor, FieldManyEditorDescriptor, FormEventTypeEnum, FormFieldEventComponentSubtype, ActionEditorSubmitTypeEnum, ActionEditorSubmitDescriptorInst, ActionPositionEnum, runFnFromDataProviderOrFallback, runGetAllFromDataProvider, runFetchFromDataProvider, runCreateFromDataProvider, runUpdateFromDataProvider, runDeleteFromDataProvider, FormFieldEventTypeEnum, FieldGroupTypeEnum, FormFieldEventDialogSubtype, FieldManyEditorActionEnum, ActionEditorDescriptor, ActionEditorSubmitDescriptor, ActionDescriptor, FieldManyToManyEditorActionEnum, TableviewActionDefaultCategories, DATA_LANGUAGE_DROPDOWN_COMPONENT_IT } from '@mediusinc/mng-commons/tableview/api';
+import { mergeMap, map, filter, startWith, catchError, first, take as take$1 } from 'rxjs/operators';
+import { getI18nModelParams, getI18nModelParamsAsync, type } from '@mediusinc/mng-commons/model';
 import { HttpErrorResponse } from '@angular/common/http';
-import * as i2$4 from 'primeng/api';
+import * as i2$3 from 'primeng/api';
 import { MessageService, ConfirmationService, SharedModule } from 'primeng/api';
 import { DialogService, DynamicDialogConfig } from 'primeng/dynamicdialog';
-import { mergeMap, map, filter, startWith, catchError, first, take as take$1 } from 'rxjs/operators';
-import { I18nUtils as I18nUtils$2, type } from '@mediusinc/mng-commons/model';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i1$3 from 'primeng/progressspinner';
 import { ProgressSpinnerModule } from 'primeng/progressspinner';
-import * as i2$3 from 'primeng/toolbar';
+import * as i2$2 from 'primeng/toolbar';
 import { ToolbarModule } from 'primeng/toolbar';
 import { ZIndexUtils } from 'primeng/utils';
-import * as i1$2 from '@angular/forms';
-import { FormGroup, FormArray, ReactiveFormsModule, FormsModule, Validators, FormControl } from '@angular/forms';
-import * as i2$2 from '@ngx-formly/core';
-import { FormlyModule, FieldType, FieldWrapper, FORMLY_CONFIG } from '@ngx-formly/core';
-import * as i3 from 'primeng/messages';
+import * as i3 from '@angular/forms';
+import { UntypedFormGroup, FormGroup, FormArray, ReactiveFormsModule, FormsModule, FormBuilder, Validators, FormControl } from '@angular/forms';
+import * as i2$1 from '@ngx-formly/core';
+import { FormlyConfig, FormlyModule, FieldType, FieldWrapper, FORMLY_CONFIG } from '@ngx-formly/core';
+import * as i3$1 from 'primeng/messages';
 import { MessagesModule } from 'primeng/messages';
 import { DropdownComponent, AutocompleteComponent, InputTrimDirective } from '@mediusinc/mng-commons/form';
 import { LookupDataProvider, ActionButtonDescriptor, ButtonStyleBuilder } from '@mediusinc/mng-commons/form/api';
@@ -46,29 +46,108 @@ import * as i5 from 'primeng/message';
 import { MessageModule } from 'primeng/message';
 import * as i1$4 from 'primeng/fieldset';
 import { FieldsetModule } from 'primeng/fieldset';
-import * as i8$1 from 'primeng/calendar';
-import { CalendarModule } from 'primeng/calendar';
-import * as i11 from 'primeng/fileupload';
+import * as i9$1 from 'primeng/fileupload';
 import { FileUploadModule } from 'primeng/fileupload';
 import { TimesIcon } from 'primeng/icons/times';
-import * as i12 from 'primeng/image';
+import * as i11 from 'primeng/image';
 import { ImageModule } from 'primeng/image';
-import * as i10$1 from 'primeng/inputmask';
+import * as i8$1 from 'primeng/inputmask';
 import { InputMaskModule } from 'primeng/inputmask';
-import * as i3$1 from 'primeng/inputnumber';
+import * as i1$5 from 'primeng/inputnumber';
 import { InputNumberModule } from 'primeng/inputnumber';
 import * as i6 from 'primeng/inputswitch';
 import { InputSwitchModule } from 'primeng/inputswitch';
-import * as i14 from 'primeng/inputtext';
+import * as i13 from 'primeng/inputtext';
 import { InputTextModule } from 'primeng/inputtext';
-import * as i13 from 'primeng/inputtextarea';
+import * as i12 from 'primeng/inputtextarea';
 import { InputTextareaModule } from 'primeng/inputtextarea';
 import * as i7$1 from 'primeng/radiobutton';
 import { RadioButtonModule } from 'primeng/radiobutton';
 import * as i7$2 from 'primeng/dialog';
 import { DialogModule } from 'primeng/dialog';
-import * as i1$5 from 'primeng/tabview';
+import * as i1$6 from 'primeng/tabview';
 import { TabViewModule } from 'primeng/tabview';
+import * as i3$2 from 'primeng/calendar';
+import { CalendarModule } from 'primeng/calendar';
+
+function getI18nForAction(translate, action, actionPathKeys, customKey, item, fallbackKey, params, missingTranslationStrategy = 'returnFirstKey') {
+    const keys = getKeysByPriority(action, actionPathKeys, customKey, fallbackKey);
+    const i18nParams = getI18nActionParams(translate, action, item, params);
+    const i18nValue = getI18n(translate, i18nParams, ...keys);
+    return getTranslationDependingOnStrategy(missingTranslationStrategy, { i18nValue, firstKey: keys[0], fallbackKey });
+}
+/**
+ * Returns async translation for given keys with given params.
+ * @param translate TranslateService
+ * @param action action descriptor
+ * @param actionPathKeys action path keys
+ * @param customKey custom key
+ * @param item item
+ * @param fallbackKey fallback key, used as fallback key
+ * @param params additional params for translation
+ * @param missingTranslationStrategy strategy when no translation is found
+ */
+function getI18nForActionAsync(translate, action, actionPathKeys, customKey, item, fallbackKey, params, missingTranslationStrategy = 'returnFirstKey') {
+    return getI18nActionParamsAsync(translate, action, item, params).pipe(mergeMap(i18nParams => {
+        const keys = getKeysByPriority(action, actionPathKeys, customKey, fallbackKey);
+        return getI18nAsync(translate, i18nParams, ...keys).pipe(map(i18nValue => getTranslationDependingOnStrategy(missingTranslationStrategy, { i18nValue, firstKey: keys[0], fallbackKey })));
+    }));
+}
+/**
+ * Returns translation depending on missingTranslationStrategy
+ * @param missingTranslationStrategy strategy when no translation is found
+ * @param values object with values, i18nValue is translation, firstKey is first key in array of keys, fallbackKey is fallback key
+ */
+function getTranslationDependingOnStrategy(missingTranslationStrategy, { i18nValue, firstKey, fallbackKey }) {
+    if (i18nValue !== null) {
+        return i18nValue;
+    }
+    else {
+        switch (missingTranslationStrategy) {
+            case 'returnNull':
+                return null;
+            case 'returnFallbackKey':
+                return fallbackKey ?? null;
+            case 'returnFirstKey':
+                return firstKey ?? null;
+        }
+    }
+}
+function getI18nActionTitleAsync(translate, action, item) {
+    return getI18nForActionAsync(translate, action, 'title', undefined, item);
+}
+function getI18nActionEditorTitleAsync(translate, action, item) {
+    return getI18nForActionAsync(translate, action, ['editor.title', 'title'], action.editorTitle ?? undefined, item, undefined, action.editorTitleParams ?? undefined);
+}
+function getI18nActionParams(translate, action, item, params = {}) {
+    const i18nParams = getI18nModelParams(translate, action.model ?? undefined, item, params);
+    return populateI18nActionParams(i18nParams);
+}
+function getI18nActionParamsAsync(translate, action, item, params = {}) {
+    return getI18nModelParamsAsync(translate, action.model ?? undefined, item, params).pipe(map(i18nParams => populateI18nActionParams(i18nParams)));
+}
+function populateI18nActionParams(params = {}) {
+    params = { ...params };
+    return params;
+}
+function getKeysByPriority(action, actionPathKeys, customKey, fallbackKey) {
+    const keys = [];
+    if (customKey) {
+        keys.push(customKey);
+    }
+    if (!Array.isArray(actionPathKeys)) {
+        actionPathKeys = [actionPathKeys];
+    }
+    actionPathKeys.forEach(k => {
+        const modelActionKey = `${action.i18nModelActionBaseKey}.${k}`;
+        const actionKey = `${action.actionName}.${k}`;
+        keys.push(modelActionKey, actionKey);
+    });
+    if (fallbackKey) {
+        keys.push(fallbackKey);
+    }
+    return keys;
+}
 
 /**
  * States of action. Enums ending with `*Final` are supposed to be final.
@@ -104,140 +183,17 @@ var ActionInstanceStateEnum;
 
 const COMMONS_TABLEVIEW_FEATURE_CONFIG_IT = new InjectionToken('COMMONS_TABLEVIEW_FEATURE_CONFIG');
 
-var I18nUtils;
-(function (I18nUtils) {
-    class Action {
-        /**
-         * Returns translation for action with given keys and params
-         * @param translate TranslateService
-         * @param action action descriptor
-         * @param actionPathKeys action path keys
-         * @param customKey custom key
-         * @param item
-         * @param fallbackKey fallback key
-         * @param params additional params for translation
-         * @param missingTranslationStrategy strategy when no translation is found
-         */
-        static get(translate, action, actionPathKeys, customKey, item, fallbackKey, params, missingTranslationStrategy = 'returnFirstKey') {
-            const keys = I18nUtils.Action.getKeysByPriority(action, actionPathKeys, customKey, fallbackKey);
-            const i18nParams = I18nUtils.Action.getParams(translate, action, item, params);
-            const i18nValue = I18nUtils$1.Common.get(translate, i18nParams, ...keys);
-            return this.getTranslationDependingOnStrategy(missingTranslationStrategy, { i18nValue, firstKey: keys[0], fallbackKey });
-        }
-        /**
-         * Returns async translation for given keys with given params.
-         * @param translate TranslateService
-         * @param action action descriptor
-         * @param actionPathKeys action path keys
-         * @param customKey custom key
-         * @param item item
-         * @param fallbackKey fallback key, used as fallback key
-         * @param params additional params for translation
-         * @param missingTranslationStrategy strategy when no translation is found
-         */
-        static getAsync(translate, action, actionPathKeys, customKey, item, fallbackKey, params, missingTranslationStrategy = 'returnFirstKey') {
-            return I18nUtils.Action.getParamsAsync(translate, action, item, params).pipe(mergeMap(i18nParams => {
-                const keys = I18nUtils.Action.getKeysByPriority(action, actionPathKeys, customKey, fallbackKey);
-                return I18nUtils$1.Common.getAsync(translate, i18nParams, ...keys).pipe(map(i18nValue => this.getTranslationDependingOnStrategy(missingTranslationStrategy, { i18nValue, firstKey: keys[0], fallbackKey })));
-            }));
-        }
-        /**
-         * Returns translation depending on missingTranslationStrategy
-         * @param missingTranslationStrategy strategy when no translation is found
-         * @param values object with values, i18nValue is translation, firstKey is first key in array of keys, fallbackKey is fallback key
-         */
-        static getTranslationDependingOnStrategy(missingTranslationStrategy, { i18nValue, firstKey, fallbackKey }) {
-            if (i18nValue !== null) {
-                return i18nValue;
-            }
-            else {
-                switch (missingTranslationStrategy) {
-                    case 'returnNull':
-                        return null;
-                    case 'returnFallbackKey':
-                        return fallbackKey ?? null;
-                    case 'returnFirstKey':
-                        return firstKey ?? null;
-                }
-            }
-        }
-        static getTitleAsync(translate, action, item) {
-            return I18nUtils.Action.getAsync(translate, action, 'title', undefined, item);
-        }
-        static getEditorTitleAsync(translate, action, item) {
-            return I18nUtils.Action.getAsync(translate, action, ['editor.title', 'title'], action.editorTitle ?? undefined, item, undefined, action.editorTitleParams ?? undefined);
-        }
-        static getParams(translate, action, item, params = {}) {
-            const i18nParams = I18nUtils$2.Model.getParams(translate, action.model ?? undefined, item, params);
-            return I18nUtils.Action.populateParams(i18nParams);
-        }
-        static getParamsAsync(translate, action, item, params = {}) {
-            return I18nUtils$2.Model.getParamsAsync(translate, action.model ?? undefined, item, params).pipe(map(i18nParams => I18nUtils.Action.populateParams(i18nParams)));
-        }
-        static populateParams(params = {}) {
-            params = { ...params };
-            return params;
-        }
-        static getKeysByPriority(action, actionPathKeys, customKey, fallbackKey) {
-            const keys = [];
-            if (customKey) {
-                keys.push(customKey);
-            }
-            if (!Array.isArray(actionPathKeys)) {
-                actionPathKeys = [actionPathKeys];
-            }
-            actionPathKeys.forEach(k => {
-                const modelActionKey = `${action.i18nModelActionBaseKey}.${k}`;
-                const actionKey = `${action.actionName}.${k}`;
-                keys.push(modelActionKey, actionKey);
-            });
-            if (fallbackKey) {
-                keys.push(fallbackKey);
-            }
-            return keys;
-        }
-    }
-    I18nUtils.Action = Action;
-    class Error {
-        static get(translate, error, params = {}) {
-            const i18nParams = I18nUtils.Error.getParams(error, params);
-            if (error.messageCode) {
-                const keys = [`errors.${error.messageCode}`, `messages.${error.messageCode}`];
-                const i18n = I18nUtils$1.Common.get(translate, i18nParams, ...keys);
-                if (i18n) {
-                    return i18n;
-                }
-            }
-            return I18nUtils$1.Common.get(translate, i18nParams, error.message);
-        }
-        static getParams(error, params = {}) {
-            const paramsRes = { ...params };
-            paramsRes.errorStatus = '';
-            paramsRes.errorMessage = '';
-            if (ErrorUtil.isHttpErrorResponse(error)) {
-                const httpError = ErrorUtil.getHttpErrorResponse(error);
-                paramsRes.errorStatus = httpError?.status;
-                paramsRes.errorMessage = httpError?.message;
-                paramsRes.errorStatusDescription = httpError?.statusText;
-            }
-            paramsRes.error = error;
-            return paramsRes;
-        }
-    }
-    I18nUtils.Error = Error;
-})(I18nUtils || (I18nUtils = {}));
-
 function actionNotificationSuccess(translate, action, functionName, messageService, customTitleKey, customMessageKey, item) {
-    const actionSuccessTitle = I18nUtils.Action.get(translate, action, 'success.title', customTitleKey, item, 'general.success', functionName) ?? undefined;
-    const actionSuccessMessage = I18nUtils.Action.get(translate, action, 'success.message', customMessageKey, item, 'general.successMessage', functionName) ?? undefined;
+    const actionSuccessTitle = getI18nForAction(translate, action, 'success.title', customTitleKey, item, 'general.success', functionName) ?? undefined;
+    const actionSuccessMessage = getI18nForAction(translate, action, 'success.message', customMessageKey, item, 'general.successMessage', functionName) ?? undefined;
     return toastMessage(messageService, actionSuccessTitle, actionSuccessMessage);
 }
 function actionNotificationError(translate, action, error, functionName, messageService, item, severity = 'error') {
     const params = {
-        errorMessage: I18nUtils.Error.get(translate, error) ?? error.message
+        errorMessage: getI18nForError(translate, error) ?? error.message
     };
-    const actionErrorTitle = I18nUtils.Action.get(translate, action, [`error.${functionName}.title`, 'error.title'], action.runNotificationErrorTitle, item, 'general.error', params) ?? undefined;
-    const actionErrorMessage = I18nUtils.Action.get(translate, action, [`error.${functionName}.message`, 'error.message'], action.runNotificationErrorMessage, item, 'general.errorMessage', params) ??
+    const actionErrorTitle = getI18nForAction(translate, action, [`error.${functionName}.title`, 'error.title'], action.runNotificationErrorTitle, item, 'general.error', params) ?? undefined;
+    const actionErrorMessage = getI18nForAction(translate, action, [`error.${functionName}.message`, 'error.message'], action.runNotificationErrorMessage, item, 'general.errorMessage', params) ??
         undefined;
     return toastMessage(messageService, actionErrorTitle, actionErrorMessage, severity, 'pi-exclamation-triangle');
 }
@@ -520,10 +476,10 @@ class NavigationService {
             this.router.navigateByUrl('/');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: NavigationService, deps: [{ token: i1.Router }, { token: i2.Location }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: NavigationService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: NavigationService, deps: [{ token: i1.Router }, { token: i2.Location }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: NavigationService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: NavigationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: NavigationService, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i1.Router }, { type: i2.Location }] });
 
@@ -575,10 +531,10 @@ class ViewContainer {
     set routeTriggeredActionInstance(instance) {
         this._routeTriggeredActionInstance = instance;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ViewContainer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ViewContainer }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ViewContainer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ViewContainer }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ViewContainer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ViewContainer, decorators: [{
             type: Injectable
         }] });
 
@@ -592,12 +548,12 @@ class ActionExecutorService {
         this.dataProviderExecutor = inject(DataProviderExecutor);
         this.navigationService = inject(NavigationService);
         this.errorMapper = inject(ActionErrorMapperService);
-        this.parametrize = inject(ParametrizePipe);
         this.config = inject(COMMONS_TABLEVIEW_FEATURE_CONFIG_IT, { optional: true });
         this.defaultEditorDialogComponent = inject(ACTION_EDITOR_COMPONENT_IT);
         this.messageService = inject(MessageService);
         this.confirmationService = inject(ConfirmationService);
         this.viewContainer = inject(ViewContainer, { optional: true });
+        this.parametrize = new ParametrizePipe();
         this.instancesBufferMax = 100;
         this.logger = inject(LoggerService).create('ActionExecutorService');
     }
@@ -642,15 +598,16 @@ class ActionExecutorService {
             };
             if (confirmationDescriptor.title !== null) {
                 confirmParams.header =
-                    I18nUtils.Action.get(this.translate, ctx.instance.action, 'confirm.title', confirmationDescriptor.title, item, 'general.confirmation') ?? undefined;
+                    getI18nForAction(this.translate, ctx.instance.action, 'confirm.title', confirmationDescriptor.title, item, 'general.confirmation') ?? undefined;
             }
             if (confirmationDescriptor.message !== null) {
                 confirmParams.message =
-                    I18nUtils.Action.get(this.translate, ctx.instance.action, 'confirm.message', confirmationDescriptor.message, StringUtil.escapeHtmlAny(item), 'general.confirmation') ?? undefined;
+                    getI18nForAction(this.translate, ctx.instance.action, 'confirm.message', confirmationDescriptor.message, escapeHtmlAny(item), 'general.confirmation') ??
+                        undefined;
             }
             if (confirmationDescriptor.acceptButton.label !== null) {
                 confirmParams.acceptLabel =
-                    I18nUtils.Action.get(this.translate, ctx.instance.action, 'confirm.accept', confirmationDescriptor.acceptButton.label, item, 'general.yes') ?? undefined;
+                    getI18nForAction(this.translate, ctx.instance.action, 'confirm.accept', confirmationDescriptor.acceptButton.label, item, 'general.yes') ?? undefined;
             }
             if (confirmationDescriptor.acceptButton.icon !== null) {
                 confirmParams.acceptIcon = confirmationDescriptor.acceptButton.icon;
@@ -660,7 +617,7 @@ class ActionExecutorService {
             }
             if (confirmationDescriptor.rejectButton?.label !== null) {
                 confirmParams.rejectLabel =
-                    I18nUtils.Action.get(this.translate, ctx.instance.action, 'confirm.reject', confirmationDescriptor.rejectButton?.label, item, 'general.no') ?? undefined;
+                    getI18nForAction(this.translate, ctx.instance.action, 'confirm.reject', confirmationDescriptor.rejectButton?.label, item, 'general.no') ?? undefined;
             }
             if (confirmationDescriptor.rejectButton == null || (confirmationDescriptor.rejectButton.label === null && confirmationDescriptor.rejectButton.icon === null)) {
                 confirmParams.rejectVisible = false;
@@ -1156,7 +1113,7 @@ class ActionExecutorService {
             // must skip initialization from view container, because it would only get old instance.
             // we need new instance before we can set new one on the view container.
             const newInstance = this.getOrCreateInstance(undefined, instance.action, undefined, newInstanceStatus, true);
-            newInstance.previousInstance = instance;
+            newInstance.reactivationPreviousInstance = instance;
             // copy some additional settings
             newInstance.activationDialogRef = instance.activationDialogRef;
             newInstance.triggerParameters = instance.triggerParameters;
@@ -1336,10 +1293,10 @@ class RootActionExecutorService extends ActionExecutorService {
     get instances() {
         return this._instances;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: RootActionExecutorService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: RootActionExecutorService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: RootActionExecutorService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: RootActionExecutorService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: RootActionExecutorService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: RootActionExecutorService, decorators: [{
             type: Injectable
         }] });
 
@@ -1351,10 +1308,10 @@ class ComponentActionExecutorService extends ActionExecutorService {
     get instances() {
         return this.rootActionExecutorService.instances;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ComponentActionExecutorService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ComponentActionExecutorService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ComponentActionExecutorService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ComponentActionExecutorService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ComponentActionExecutorService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ComponentActionExecutorService, decorators: [{
             type: Injectable
         }] });
 
@@ -1526,10 +1483,10 @@ class ActionComponent {
         for (const subaction of this.action.subactions) {
             const menuItem = {};
             menuItem.icon = subaction.button.icon ?? undefined;
-            this.subactionSubscriptions.push(I18nUtils.Action.getAsync(this.translate, subaction, 'title', subaction.button.label ?? undefined, this.item).subscribe({
+            this.subactionSubscriptions.push(getI18nForActionAsync(this.translate, subaction, 'title', subaction.button.label ?? undefined, this.item).subscribe({
                 next: res => (menuItem.label = res)
             }));
-            this.subactionSubscriptions.push(I18nUtils.Action.getAsync(this.translate, subaction, 'tooltip', this.action.button.tooltip, this.item).subscribe({
+            this.subactionSubscriptions.push(getI18nForActionAsync(this.translate, subaction, 'tooltip', this.action.button.tooltip, this.item).subscribe({
                 next: res => (menuItem.tooltip = res)
             }));
             const parameters = {
@@ -1601,25 +1558,25 @@ class ActionComponent {
         }
         if (!this.hasNoTitle) {
             this.labelSubscription?.unsubscribe();
-            this.labelSubscription = I18nUtils.Action.getAsync(this.translate, this.action, 'title', this.action.button.label ?? undefined, this.item).subscribe({
+            this.labelSubscription = getI18nForActionAsync(this.translate, this.action, 'title', this.action.button.label ?? undefined, this.item).subscribe({
                 next: i18n => this.labelSubject.next(i18n)
             });
         }
         this.tooltipSubscription?.unsubscribe();
         if (this.action.button.tooltip) {
-            this.tooltipSubscription = I18nUtils.Action.getAsync(this.translate, this.action, 'tooltip', this.action.button.tooltip, this.item, undefined, undefined).subscribe({
+            this.tooltipSubscription = getI18nForActionAsync(this.translate, this.action, 'tooltip', this.action.button.tooltip, this.item, undefined, undefined).subscribe({
                 next: i18n => this.tooltipSubject.next(i18n)
             });
         }
         this.subactions = this.processSubactions();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2$1.TranslateService }, { token: i1$1.PermissionService }, { token: ActionExecutorService }, { token: ViewContainer, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: ActionComponent, isStandalone: true, selector: "mng-action", inputs: { action: "action", item: "item", itemId: "itemId", actionData: "actionData", dataListParams: "dataListParams", dataProvider: "dataProvider", hostComponent: "hostComponent", routeInit: ["route", "routeInit"], inputDisabled: ["disabled", "inputDisabled", boolean$Attribute], inputLoading: ["loading", "inputLoading", boolean$Attribute], selectedItems: "selectedItems" }, outputs: { finishEventEmitter: "finish" }, host: { properties: { "class": "this.hostClass", "class.m-0": "this.isHostHidden" } }, providers: [provideActionExecutor()], viewQueries: [{ propertyName: "subactionsMenu", first: true, predicate: ["subactionsMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (($isVisible | async) && ($isPermitted | async)) {\n    @if (actionLink && actionLink.url !== '') {\n        <a\n            pButton\n            pRipple\n            [label]=\"($label | async) ?? ''\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | mngParametrize: itemId : item : actionData)\"\n            [target]=\"actionLink.target\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    } @else if (actionLink) {\n        <a\n            pButton\n            pRipple\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | mngParametrize: itemId : item : actionData)\"\n            [relativeTo]=\"route\"\n            [queryParams]=\"actionLink.queryParams | mngParametrize: itemId : item : actionData\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    } @else if (action.component || action.componentFromDi) {\n        <ng-container\n            [mngComponent]=\"action.component\"\n            [injectionToken]=\"action.componentFromDi\"\n            [inputs]=\"{\n                action: action,\n                item: item,\n                itemId: itemId,\n                actionData: actionData,\n                enabled: $isEnabled,\n                loading: $loading\n            }\"\n            (instanceCreated)=\"onCustomActionCmpInst($event)\">\n        </ng-container>\n    } @else if (action.subactions.length > 0 && !action.subactionsAsMenu) {\n        <p-splitButton\n            [icon]=\"action.button.icon ?? undefined\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (onClick)=\"triggerAction(action)\"\n            [class]=\"buttonClass\"\n            [model]=\"subactions\">\n        </p-splitButton>\n    } @else {\n        <button\n            pButton\n            pRipple\n            type=\"button\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            loadingIcon=\"pi pi-spin pi-spinner\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction(action, undefined, $event)\"\n            [class]=\"buttonClass\"></button>\n        <p-menu #subactionsMenu [model]=\"subactions\" [popup]=\"true\" appendTo=\"body\" styleClass=\"mng-action-menu\"></p-menu>\n    }\n}\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i8.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "pipe", type: ParametrizePipe, name: "mngParametrize" }, { kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "nodeInjector"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: SplitButtonModule }, { kind: "component", type: i9.SplitButton, selector: "p-splitButton", inputs: ["model", "icon", "iconPos", "label", "style", "styleClass", "menuStyle", "menuStyleClass", "disabled", "tabindex", "appendTo", "dir", "expandAriaLabel", "showTransitionOptions", "hideTransitionOptions", "buttonProps", "menuButtonProps"], outputs: ["onClick", "onDropdownClick"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i10.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionComponent, deps: [{ token: i1.ActivatedRoute }, { token: i1$1.TranslateService }, { token: i1$2.PermissionService }, { token: ActionExecutorService }, { token: ViewContainer, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ActionComponent, isStandalone: true, selector: "mng-action", inputs: { action: "action", item: "item", itemId: "itemId", actionData: "actionData", dataListParams: "dataListParams", dataProvider: "dataProvider", hostComponent: "hostComponent", routeInit: ["route", "routeInit"], inputDisabled: ["disabled", "inputDisabled", boolean$Attribute], inputLoading: ["loading", "inputLoading", boolean$Attribute], selectedItems: "selectedItems" }, outputs: { finishEventEmitter: "finish" }, host: { properties: { "class": "this.hostClass", "class.m-0": "this.isHostHidden" } }, providers: [provideActionExecutor()], viewQueries: [{ propertyName: "subactionsMenu", first: true, predicate: ["subactionsMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (($isVisible | async) && ($isPermitted | async)) {\n    @if (actionLink && actionLink.url !== '') {\n        <a\n            pButton\n            pRipple\n            [label]=\"($label | async) ?? ''\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | mngParametrize: itemId : item : actionData)\"\n            [target]=\"actionLink.target\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    } @else if (actionLink) {\n        <a\n            pButton\n            pRipple\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | mngParametrize: itemId : item : actionData)\"\n            [relativeTo]=\"route\"\n            [queryParams]=\"actionLink.queryParams | mngParametrize: itemId : item : actionData\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    } @else if (action.component || action.componentFromDi) {\n        <ng-container\n            [mngComponent]=\"action.component\"\n            [injectionToken]=\"action.componentFromDi\"\n            [inputs]=\"{\n                action: action,\n                item: item,\n                itemId: itemId,\n                actionData: actionData,\n                enabled: $isEnabled,\n                loading: $loading\n            }\"\n            (instanceCreated)=\"onCustomActionCmpInst($event)\">\n        </ng-container>\n    } @else if (action.subactions.length > 0 && !action.subactionsAsMenu) {\n        <p-splitButton\n            [icon]=\"action.button.icon ?? undefined\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (onClick)=\"triggerAction(action)\"\n            [class]=\"buttonClass\"\n            [model]=\"subactions\">\n        </p-splitButton>\n    } @else {\n        <button\n            pButton\n            pRipple\n            type=\"button\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            loadingIcon=\"pi pi-spin pi-spinner\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction(action, undefined, $event)\"\n            [class]=\"buttonClass\"></button>\n        <p-menu #subactionsMenu [model]=\"subactions\" [popup]=\"true\" appendTo=\"body\" styleClass=\"mng-action-menu\"></p-menu>\n    }\n}\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i8.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "pipe", type: ParametrizePipe, name: "mngParametrize" }, { kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "nodeInjector"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: SplitButtonModule }, { kind: "component", type: i9.SplitButton, selector: "p-splitButton", inputs: ["model", "icon", "iconPos", "label", "style", "styleClass", "menuStyle", "menuStyleClass", "disabled", "tabindex", "appendTo", "dir", "expandAriaLabel", "showTransitionOptions", "hideTransitionOptions", "buttonProps", "menuButtonProps"], outputs: ["onClick", "onDropdownClick"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i10.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-action', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AsyncPipe, ButtonModule, RippleModule, TooltipModule, ParametrizePipe, ComponentDirective, SplitButtonModule, MenuModule], providers: [provideActionExecutor()], template: "@if (($isVisible | async) && ($isPermitted | async)) {\n    @if (actionLink && actionLink.url !== '') {\n        <a\n            pButton\n            pRipple\n            [label]=\"($label | async) ?? ''\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | mngParametrize: itemId : item : actionData)\"\n            [target]=\"actionLink.target\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    } @else if (actionLink) {\n        <a\n            pButton\n            pRipple\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | mngParametrize: itemId : item : actionData)\"\n            [relativeTo]=\"route\"\n            [queryParams]=\"actionLink.queryParams | mngParametrize: itemId : item : actionData\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    } @else if (action.component || action.componentFromDi) {\n        <ng-container\n            [mngComponent]=\"action.component\"\n            [injectionToken]=\"action.componentFromDi\"\n            [inputs]=\"{\n                action: action,\n                item: item,\n                itemId: itemId,\n                actionData: actionData,\n                enabled: $isEnabled,\n                loading: $loading\n            }\"\n            (instanceCreated)=\"onCustomActionCmpInst($event)\">\n        </ng-container>\n    } @else if (action.subactions.length > 0 && !action.subactionsAsMenu) {\n        <p-splitButton\n            [icon]=\"action.button.icon ?? undefined\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (onClick)=\"triggerAction(action)\"\n            [class]=\"buttonClass\"\n            [model]=\"subactions\">\n        </p-splitButton>\n    } @else {\n        <button\n            pButton\n            pRipple\n            type=\"button\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            loadingIcon=\"pi pi-spin pi-spinner\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction(action, undefined, $event)\"\n            [class]=\"buttonClass\"></button>\n        <p-menu #subactionsMenu [model]=\"subactions\" [popup]=\"true\" appendTo=\"body\" styleClass=\"mng-action-menu\"></p-menu>\n    }\n}\n", styles: [":host{display:inline-block}\n"] }]
-        }], ctorParameters: () => [{ type: i1.ActivatedRoute }, { type: i2$1.TranslateService }, { type: i1$1.PermissionService }, { type: ActionExecutorService }, { type: ViewContainer, decorators: [{
+        }], ctorParameters: () => [{ type: i1.ActivatedRoute }, { type: i1$1.TranslateService }, { type: i1$2.PermissionService }, { type: ActionExecutorService }, { type: ViewContainer, decorators: [{
                     type: Optional
                 }] }], propDecorators: { hostClass: [{
                 type: HostBinding,
@@ -1661,454 +1618,503 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
                 args: ['subactionsMenu']
             }] } });
 
-function getFormEditorInfoMessage(translate, title, message, params) {
-    const actionErrorTitle = translate.instant(title) ?? undefined;
-    const actionErrorMessage = translate.instant(message, params) ?? undefined;
-    return { severity: 'info', summary: actionErrorTitle, detail: actionErrorMessage };
-}
-function getFormEditorWarningMessage(translate, title, message) {
-    const actionErrorTitle = translate.instant(title) ?? undefined;
-    const actionErrorMessage = translate.instant(message) ?? undefined;
-    return { severity: 'warn', summary: actionErrorTitle, detail: actionErrorMessage };
+function createFormlyConfigFromDescriptor(descriptor, formlyConfig, formEditorComponent) {
+    const fields = [];
+    if (descriptor.isLocalized) {
+        descriptor = createFormlyLocalizationsTab(descriptor);
+    }
+    if (!descriptor.isLocalized && descriptor.tabs.length === 1 && descriptor.tabs[0].default) {
+        // dont use tabs
+        fields.push(...createFormlyGroupType(descriptor.tabs[0].fields, formlyConfig, formEditorComponent));
+    }
+    else {
+        fields.push(...createFormlyTabType(descriptor.tabs, formlyConfig, formEditorComponent));
+    }
+    return fields;
 }
-
-class EditorFormlyUtil {
-    static createFormlyConfigFromDescriptor(descriptor, formEditorComponent) {
-        const fields = [];
-        if (descriptor.isLocalized) {
-            descriptor = EditorFormlyUtil.createLocalizationsTab(descriptor);
-        }
-        if (!descriptor.isLocalized && descriptor.tabs.length === 1 && descriptor.tabs[0].default) {
-            // dont use tabs
-            fields.push(...EditorFormlyUtil.createFormlyGroupType(descriptor.tabs[0].fields, formEditorComponent));
-        }
-        else {
-            fields.push(...EditorFormlyUtil.createFormlyTabType(descriptor.tabs, formEditorComponent));
+function createFormlyLocalizationsTab(descriptor) {
+    if (descriptor.isLocalized && descriptor.tableviewEditorType !== TableviewEditorTypeEnum.Details) {
+        if (!descriptor.localizationModel) {
+            throw new CommonsInternalError('Localization model must be defined.');
+        }
+        const localizationsTableViewDescriptor = TableviewDescriptor.fromModel(descriptor.localizationModel);
+        if (!descriptor.localizationLocaleProperty) {
+            throw new CommonsInternalError('Localization locale property must be defined.');
+        }
+        localizationsTableViewDescriptor.addColumn(descriptor.localizationLocaleProperty);
+        localizationsTableViewDescriptor.editEditor.addField(descriptor.localizationLocaleProperty).withDisabled(true);
+        localizationsTableViewDescriptor.detailsEditor.addField(descriptor.localizationLocaleProperty).withDisabled(true);
+        localizationsTableViewDescriptor.addEditor
+            .addFieldLookupWithProvider(descriptor.localizationLocaleProperty, CommonsService, type())
+            .withLookup((qp, service) => service.appDataLanguages)
+            .withDisabled(false)
+            .withRequired();
+        descriptor.fields.forEach(field => {
+            if (field.isLocalized) {
+                localizationsTableViewDescriptor.addColumn(field.property);
+                localizationsTableViewDescriptor.addField(field.property);
+            }
+        });
+        const descriptorWithLocalizations = descriptor.copy();
+        descriptorWithLocalizations.createTabGroup('localizations');
+        if (!descriptor.localizationLocalizationProperty) {
+            throw new CommonsInternalError('Localization localization property must be defined');
         }
-        return fields;
+        descriptorWithLocalizations.addFieldManyEditorUnsafe(descriptor.localizationLocalizationProperty, localizationsTableViewDescriptor);
+        return descriptorWithLocalizations;
     }
-    static createLocalizationsTab(descriptor) {
-        if (descriptor.isLocalized && descriptor.tableviewEditorType !== TableviewEditorTypeEnum.Details) {
-            if (!descriptor.localizationModel) {
-                throw new CommonsInternalError('Localization model must be defined.');
-            }
-            const localizationsTableViewDescriptor = TableviewDescriptor.fromModel(descriptor.localizationModel);
-            if (!descriptor.localizationLocaleProperty) {
-                throw new CommonsInternalError('Localization locale property must be defined.');
-            }
-            localizationsTableViewDescriptor.addColumn(descriptor.localizationLocaleProperty);
-            localizationsTableViewDescriptor.editEditor.addField(descriptor.localizationLocaleProperty).withDisabled(true);
-            localizationsTableViewDescriptor.detailsEditor.addField(descriptor.localizationLocaleProperty).withDisabled(true);
-            localizationsTableViewDescriptor.addEditor
-                .addFieldLookupWithProvider(descriptor.localizationLocaleProperty, CommonsService, type())
-                .withLookup((qp, service) => service.appDataLanguages)
-                .withDisabled(false)
-                .withRequired();
-            descriptor.fields.forEach(field => {
-                if (field.isLocalized) {
-                    localizationsTableViewDescriptor.addColumn(field.property);
-                    localizationsTableViewDescriptor.addField(field.property);
-                }
-            });
-            const descriptorWithLocalizations = descriptor.copy();
-            descriptorWithLocalizations.createTabGroup('localizations');
-            if (!descriptor.localizationLocalizationProperty) {
-                throw new CommonsInternalError('Localization localization property must be defined');
-            }
-            descriptorWithLocalizations.addFieldManyEditor(descriptor.localizationLocalizationProperty, localizationsTableViewDescriptor);
-            return descriptorWithLocalizations;
+    return descriptor;
+}
+function createFormlyTabType(tabGroups, formlyConfig, formEditorComponent) {
+    const tabsField = {
+        type: 'tabs',
+        fieldGroup: [],
+        props: {
+            formEditorComponent
         }
-        return descriptor;
+    };
+    for (const tab of tabGroups) {
+        const tabField = {
+            id: tab.name,
+            props: {
+                formEditorComponent
+            },
+            expressions: {},
+            fieldGroup: []
+        };
+        if (tab.title) {
+            tabField.props.label = tab.title;
+        }
+        tabField.fieldGroup.push(...createFormlyGroupType(tab.fields, formlyConfig, formEditorComponent));
+        tabsField.fieldGroup.push(tabField);
     }
-    static createFormlyTabType(tabGroups, formEditorComponent) {
-        const tabsField = {
-            type: 'tabs',
+    return [tabsField];
+}
+function createFormlyGroupType(groups, formlyConfig, formEditorComponent) {
+    if (groups.length === 1 && groups[0].default) {
+        // dont use fieldset, just create fields
+        return createFormlyFields(groups[0], formlyConfig, formEditorComponent);
+    }
+    else {
+        const groupsField = {
+            type: 'fieldset',
             fieldGroup: [],
             props: {
                 formEditorComponent
-            }
+            },
+            expressions: {}
         };
-        for (const tab of tabGroups) {
-            const tabField = {
-                id: tab.name,
+        for (const group of groups) {
+            const groupField = {
+                id: group.name,
                 props: {
-                    formEditorComponent
+                    descriptor: group
                 },
                 expressions: {},
                 fieldGroup: []
             };
-            if (tab.title) {
-                tabField.props.label = tab.title;
+            if (group.title) {
+                groupField.props.label = group.title;
             }
-            tabField.fieldGroup.push(...EditorFormlyUtil.createFormlyGroupType(tab.fields, formEditorComponent));
-            tabsField.fieldGroup.push(tabField);
+            groupField.fieldGroup.push(...createFormlyFields(group, formlyConfig, formEditorComponent));
+            groupsField.fieldGroup.push(groupField);
         }
-        return [tabsField];
+        return [groupsField];
     }
-    static createFormlyGroupType(groups, formEditorComponent) {
-        if (groups.length === 1 && groups[0].default) {
-            // dont use fieldset, just create fields
-            return EditorFormlyUtil.createFormlyFields(groups[0], formEditorComponent);
-        }
-        else {
-            const groupsField = {
-                type: 'fieldset',
-                fieldGroup: [],
-                props: {
-                    formEditorComponent
-                },
-                expressions: {}
-            };
-            for (const group of groups) {
-                const groupField = {
-                    id: group.name,
-                    props: {
-                        descriptor: group
-                    },
-                    expressions: {},
-                    fieldGroup: []
-                };
-                if (group.title) {
-                    groupField.props.label = group.title;
+}
+function createFormlyFields(descriptor, formlyConfig, formEditorComponent) {
+    const fields = [];
+    for (const descriptorField of descriptor.fields) {
+        fields.push(createFormlyField(descriptorField, formlyConfig, formEditorComponent));
+    }
+    // wrap in group to be able to use flex grid
+    const wrapperGroup = {
+        fieldGroupClassName: 'p-fluid formgrid grid',
+        fieldGroup: fields,
+        props: {}
+    };
+    addValidationsToFormlyField(wrapperGroup, descriptor.validations, formlyConfig);
+    return [wrapperGroup];
+}
+function createFormlyField(descriptor, formlyConfig, formEditorComponent) {
+    const field = {
+        key: descriptor.property,
+        modelOptions: {
+            updateOn: descriptor.updateOn
+        },
+        hooks: {
+            onInit: () => (descriptor.onInit ? descriptor.onInit(field) : undefined),
+            onChanges: () => (descriptor.onChanges ? descriptor.onChanges(field) : undefined),
+            afterContentInit: () => (descriptor.afterContentInit ? descriptor.afterContentInit(field) : undefined),
+            afterViewInit: () => (descriptor.afterViewInit ? descriptor.afterViewInit(field) : undefined),
+            onDestroy: () => (descriptor.onDestroy ? descriptor.onDestroy(field) : undefined)
+        },
+        props: {
+            descriptor,
+            formEditorComponent,
+            onValueChange: descriptor.onValueChange
+        },
+        expressions: {}
+    };
+    let className = descriptor.className;
+    if (!className) {
+        // assign default field width through entire row
+        className = 'col-12';
+    }
+    field.className = className;
+    if (descriptor instanceof FieldInputDescriptor) {
+        switch (descriptor.fieldType) {
+            case FieldInputTypeEnum.Hidden:
+                break;
+            case FieldInputTypeEnum.Label:
+                field.type = 'label';
+                delete field.key;
+                break;
+            case FieldInputTypeEnum.Textarea:
+                field.type = 'textarea';
+                field.props.maxLength = descriptor.maxLength;
+                field.props.minLength = descriptor.minLength;
+                field.props.pattern = descriptor.pattern;
+                break;
+            case FieldInputTypeEnum.Number:
+                field.type = 'number';
+                field.props.min = descriptor.numberMin;
+                field.props.max = descriptor.numberMax;
+                break;
+            case FieldInputTypeEnum.Currency:
+                field.type = 'currency';
+                field.props.min = descriptor.numberMin;
+                field.props.max = descriptor.numberMax;
+                break;
+            case FieldInputTypeEnum.Switch:
+                field.type = 'switch';
+                field.defaultValue = false;
+                break;
+            case FieldInputTypeEnum.Radio:
+                field.type = 'radio';
+                break;
+            case FieldInputTypeEnum.Datepicker:
+                field.type = 'datepicker';
+                break;
+            case FieldInputTypeEnum.Mask:
+                field.type = 'mask';
+                break;
+            case FieldInputTypeEnum.File:
+            case FieldInputTypeEnum.ImageFile:
+                field.type = 'file';
+                break;
+            case FieldInputTypeEnum.ImageUrl:
+                field.type = 'imageUrl';
+                break;
+            case FieldInputTypeEnum.Custom:
+                if (descriptor.customComponentType) {
+                    field.type = 'custom';
+                    field.props['customComponentType'] = descriptor.customComponentType;
+                    if (Array.isArray(descriptor.customComponentWrappers)) {
+                        field.wrappers = descriptor.customComponentWrappers;
+                    }
+                    else {
+                        // default wrapper
+                        field.wrappers = ['field'];
+                    }
                 }
-                groupField.fieldGroup.push(...EditorFormlyUtil.createFormlyFields(group, formEditorComponent));
-                groupsField.fieldGroup.push(groupField);
-            }
-            return [groupsField];
+                break;
+            default:
+                field.type = 'input';
+                field.props.minLength = descriptor.minLength;
+                field.props.maxLength = descriptor.maxLength;
+                field.props.pattern = descriptor.pattern;
+                break;
         }
     }
-    static createFormlyFields(descriptor, formEditorComponent) {
-        const fields = [];
-        for (const descriptorField of descriptor.fields) {
-            fields.push(EditorFormlyUtil.createFormlyField(descriptorField, formEditorComponent));
-        }
-        // wrap in group to be able to use flex grid
-        const wrapperGroup = {
-            fieldGroupClassName: 'p-fluid formgrid grid',
-            fieldGroup: fields
-        };
-        EditorFormlyUtil.addValidationsToFormlyField(wrapperGroup, descriptor.validations);
-        return [wrapperGroup];
-    }
-    static createFormlyField(descriptor, formEditorComponent) {
-        const field = {
-            key: descriptor.property,
-            modelOptions: {
-                updateOn: descriptor.updateOn
-            },
-            hooks: {
-                onInit: () => (descriptor.onInit ? descriptor.onInit(field) : undefined),
-                onChanges: () => (descriptor.onChanges ? descriptor.onChanges(field) : undefined),
-                afterContentInit: () => (descriptor.afterContentInit ? descriptor.afterContentInit(field) : undefined),
-                afterViewInit: () => (descriptor.afterViewInit ? descriptor.afterViewInit(field) : undefined),
-                onDestroy: () => (descriptor.onDestroy ? descriptor.onDestroy(field) : undefined)
-            },
-            props: {
-                descriptor,
-                formEditorComponent,
-                onValueChange: descriptor.onValueChange
-            },
-            expressions: {}
-        };
-        let className = descriptor.className;
-        if (!className) {
-            // assign default field width through entire row
-            className = 'col-12';
-        }
-        field.className = className;
-        if (descriptor instanceof FieldInputDescriptor) {
-            switch (descriptor.fieldType) {
-                case FieldInputTypeEnum.Hidden:
-                    break;
-                case FieldInputTypeEnum.Label:
-                    field.type = 'label';
-                    delete field.key;
-                    break;
-                case FieldInputTypeEnum.Textarea:
-                    field.type = 'textarea';
-                    field.props.maxLength = descriptor.maxLength;
-                    field.props.minLength = descriptor.minLength;
-                    field.props.pattern = descriptor.pattern;
-                    break;
-                case FieldInputTypeEnum.Number:
-                    field.type = 'number';
-                    field.props.min = descriptor.numberMin;
-                    field.props.max = descriptor.numberMax;
-                    break;
-                case FieldInputTypeEnum.Currency:
-                    field.type = 'currency';
-                    field.props.min = descriptor.numberMin;
-                    field.props.max = descriptor.numberMax;
-                    break;
-                case FieldInputTypeEnum.Switch:
-                    field.type = 'switch';
-                    field.defaultValue = false;
-                    break;
-                case FieldInputTypeEnum.Radio:
-                    field.type = 'radio';
-                    break;
-                case FieldInputTypeEnum.Datepicker:
-                    field.type = 'datepicker';
-                    break;
-                case FieldInputTypeEnum.Mask:
-                    field.type = 'mask';
-                    break;
-                case FieldInputTypeEnum.File:
-                case FieldInputTypeEnum.ImageFile:
-                    field.type = 'file';
-                    break;
-                case FieldInputTypeEnum.ImageUrl:
-                    field.type = 'imageUrl';
-                    break;
-                case FieldInputTypeEnum.Custom:
-                    if (descriptor.customComponentType) {
-                        field.type = 'custom';
-                        field.props['customComponentType'] = descriptor.customComponentType;
-                        if (Array.isArray(descriptor.customComponentWrappers)) {
-                            field.wrappers = descriptor.customComponentWrappers;
-                        }
-                        else {
-                            // default wrapper
-                            field.wrappers = ['field'];
-                        }
-                    }
-                    break;
-                default:
-                    field.type = 'input';
-                    field.props.minLength = descriptor.minLength;
-                    field.props.maxLength = descriptor.maxLength;
-                    field.props.pattern = descriptor.pattern;
-                    break;
-            }
+    else if (descriptor instanceof FieldActionDescriptor) {
+        field.type = 'action';
+        field.wrappers = descriptor.wrappers;
+        delete field.key;
+    }
+    else if (descriptor instanceof FieldLookupEnumDescriptor) {
+        switch (descriptor.lookupType) {
+            case FieldLookupTypeEnum.Custom:
+                field.type = descriptor.customComponentName;
+                break;
+            default:
+                field.type = 'enum';
+                break;
         }
-        else if (descriptor instanceof FieldActionDescriptor) {
-            field.type = 'action';
-            field.wrappers = descriptor.wrappers;
-            delete field.key;
+    }
+    else if (descriptor instanceof FieldLookupDescriptor) {
+        switch (descriptor.lookupType) {
+            case FieldLookupTypeEnum.Autocomplete:
+                field.type = 'autocomplete';
+                break;
+            case FieldLookupTypeEnum.Dialog:
+                field.type = 'dialog';
+                break;
+            case FieldLookupTypeEnum.Custom:
+                field.type = descriptor.customComponentName;
+                break;
+            case FieldLookupTypeEnum.Dropdown:
+            default:
+                field.type = 'dropdown';
+                break;
         }
-        else if (descriptor instanceof FieldLookupEnumDescriptor) {
-            switch (descriptor.lookupType) {
-                case FieldLookupTypeEnum.Custom:
-                    field.type = descriptor.customComponentName;
-                    break;
-                default:
-                    field.type = 'enum';
-                    break;
-            }
+    }
+    else if (descriptor instanceof FieldManyToManyEditorDescriptor) {
+        field.type = 'table-dialog-multiselect';
+    }
+    else if (descriptor instanceof FieldManyEditorDescriptor) {
+        field.type = 'table-dialog-form';
+    }
+    if (descriptor.label) {
+        field.props.label = descriptor.label;
+    }
+    if (descriptor.requiredExpression) {
+        field.expressions['props.required'] = descriptor.requiredExpression;
+    }
+    if (descriptor.required) {
+        field.props.required = true;
+        if (descriptor.requiredHideLabelMarker) {
+            field.props['hideRequiredMarker'] = true;
         }
-        else if (descriptor instanceof FieldLookupDescriptor) {
-            switch (descriptor.lookupType) {
-                case FieldLookupTypeEnum.Autocomplete:
-                    field.type = 'autocomplete';
-                    break;
-                case FieldLookupTypeEnum.Dialog:
-                    field.type = 'dialog';
-                    break;
-                case FieldLookupTypeEnum.Custom:
-                    field.type = descriptor.customComponentName;
-                    break;
-                case FieldLookupTypeEnum.Dropdown:
-                default:
-                    field.type = 'dropdown';
-                    break;
+    }
+    if (descriptor.hiddenExpression) {
+        field.expressions['hide'] = descriptor.hiddenExpression;
+    }
+    if (descriptor.disabledExpression) {
+        field.expressions['props.disabled'] = descriptor.disabledExpression;
+    }
+    else if (descriptor.disabled) {
+        field.props.disabled = true;
+    }
+    else {
+        field.expressions['props.disabled'] = 'formState.disabled';
+    }
+    if (typeof descriptor.defaultValue !== 'undefined') {
+        field.defaultValue = descriptor.defaultValue;
+    }
+    addValidationsToFormlyField(field, descriptor.validations, formlyConfig);
+    addAsyncValidationsToFormlyField(field, descriptor.asyncValidations, formlyConfig);
+    return field;
+}
+function addValidationsToFormlyField(config, validations, formlyConfig) {
+    if (!config.validators) {
+        config.validators = {};
+    }
+    for (const validation of validations) {
+        createFormlyValidation(config.validators, validation, formlyConfig);
+    }
+}
+function addAsyncValidationsToFormlyField(config, asyncValidations, formlyConfig) {
+    if (!config.asyncValidators) {
+        config.asyncValidators = {};
+    }
+    for (const validation of asyncValidations) {
+        createFormlyValidation(config.asyncValidators, validation, formlyConfig);
+    }
+}
+function createFormlyValidation(config, validation, formlyConfig) {
+    if (typeof validation.validator === 'function') {
+        if (validation.options?.errorPath && validation.message != null) {
+            // if this is used, the validator and message must be registered globally
+            if (!formlyConfig.getValidatorMessage(validation.name)) {
+                formlyConfig.addValidatorMessage(validation.name, validation.message);
+            }
+            if (!formlyConfig.validators[validation.name]) {
+                formlyConfig.setValidator({
+                    name: validation.name,
+                    validation: (control, field, options) => validation.validator(control, field, options) ? null : { [validation.name]: true }
+                });
             }
-        }
-        else if (descriptor instanceof FieldManyToManyEditorDescriptor) {
-            field.type = 'table-dialog-multiselect';
-        }
-        else if (descriptor instanceof FieldManyEditorDescriptor) {
-            field.type = 'table-dialog-form';
-        }
-        if (descriptor.label) {
-            field.props.label = descriptor.label;
-        }
-        if (descriptor.requiredExpression) {
-            field.expressions['props.required'] = descriptor.requiredExpression;
-        }
-        if (descriptor.required) {
-            field.props.required = true;
-            if (descriptor.requiredHideLabelMarker) {
-                field.props['hideRequiredMarker'] = true;
+            if (!Array.isArray(config.validation)) {
+                config.validation = [];
             }
-        }
-        if (descriptor.hiddenExpression) {
-            field.expressions['hide'] = descriptor.hiddenExpression;
-        }
-        if (descriptor.disabledExpression) {
-            field.expressions['props.disabled'] = descriptor.disabledExpression;
-        }
-        else if (descriptor.disabled) {
-            field.props.disabled = true;
+            config.validation.push({
+                name: validation.name,
+                options: { errorPath: validation.options.errorPath }
+            });
         }
         else {
-            field.expressions['props.disabled'] = 'formState.disabled';
-        }
-        if (typeof descriptor.defaultValue !== 'undefined') {
-            field.defaultValue = descriptor.defaultValue;
-        }
-        EditorFormlyUtil.addValidationsToFormlyField(field, descriptor.validations);
-        EditorFormlyUtil.addAsyncValidationsToFormlyField(field, descriptor.asyncValidations);
-        return field;
-    }
-    static addValidationsToFormlyField(config, validations) {
-        if (!config.validators) {
-            config.validators = {};
-        }
-        for (const validation of validations) {
-            if (typeof validation.validator === 'function') {
-                config.validators[validation.name] = {
-                    expression: (control, field, options) => {
-                        const validatorRes = validation.validator(control, field, options);
-                        // formly validator only excepts true/false for validation
-                        // map possible angular validator result to true/false
-                        return typeof validatorRes === 'boolean' ? validatorRes : validatorRes === null;
-                    }
-                };
-                if (typeof validation.message === 'function') {
-                    config.validators[validation.name].message = validation.message;
-                }
-            }
-            else {
-                if (!Array.isArray(config.validators.validation)) {
-                    config.validators.validation = [];
-                }
-                config.validators.validation.push(validation.name);
+            config[validation.name] = {
+                expression: validation.validator
+            };
+            if (validation.message != null) {
+                config[validation.name].message = validation.message;
             }
         }
     }
-    static addAsyncValidationsToFormlyField(config, asyncValidations) {
-        if (!config.asyncValidators) {
-            config.asyncValidators = {};
+    else {
+        if (!Array.isArray(config.validation)) {
+            config.validation = [];
         }
-        for (const validation of asyncValidations) {
-            if (typeof validation.validator === 'function') {
-                config.asyncValidators[validation.name] = {
-                    expression: (control, field, options) => {
-                        const validator = validation.validator;
-                        const validatorObs = validator(control, field, options);
-                        // formly validator only excepts true/false for validation
-                        // map possible angular validator result to true/false
-                        return validatorObs.pipe(map(value => (typeof value === 'boolean' ? value : value === null)));
-                    }
-                };
-                if (typeof validation.message === 'function') {
-                    config.asyncValidators[validation.name].message = validation.message;
-                }
-            }
-            else {
-                if (!Array.isArray(config.asyncValidators.validation)) {
-                    config.asyncValidators.validation = [];
-                }
-                config.asyncValidators.validation.push(validation.name);
-            }
+        if (validation.options?.errorPath) {
+            config.validation.push({
+                name: validation.name,
+                options: { errorPath: validation.options.errorPath }
+            });
+        }
+        else {
+            config.validation.push(validation.name);
         }
     }
 }
 
+function getFormEditorInfoMessage(translate, title, message, params) {
+    const actionErrorTitle = translate.instant(title) ?? undefined;
+    const actionErrorMessage = translate.instant(message, params) ?? undefined;
+    return { severity: 'info', summary: actionErrorTitle, detail: actionErrorMessage };
+}
+function getFormEditorWarningMessage(translate, title, message) {
+    const actionErrorTitle = translate.instant(title) ?? undefined;
+    const actionErrorMessage = translate.instant(message) ?? undefined;
+    return { severity: 'warn', summary: actionErrorTitle, detail: actionErrorMessage };
+}
+
 class FormEditorComponent {
+    get form() {
+        return this._form;
+    }
+    get formUnsafe() {
+        return this._form;
+    }
+    get formlyOptions() {
+        return this._formlyOptions;
+    }
+    get formlyFields() {
+        return this._formlyFields;
+    }
+    /**
+     * Only used for form initialization. Further changes should be done using {resetFormModel}.
+     */
+    get formlyInitialItem() {
+        return this._formlyInitialItem;
+    }
     constructor() {
+        this.formlyConfig = inject(FormlyConfig);
         this.translateService = inject(TranslateService);
         this.commons = inject(CommonsService);
         this.logger = inject(LoggerService).create('FormEditorComponent');
-        this.viewContainer = inject(ViewContainer, { optional: true });
-        this.submitLoading = false;
-        // extra features input
-        this.isFormDisabled = false;
+        this.destroyRef = inject(DestroyRef);
+        this.descriptor = input.required();
+        this.submitLoading = input(false);
+        this.item = input(undefined);
+        this.isFormDisabled = input(false);
         // event outputs
-        this.formSubmitEventEmitter = new EventEmitter();
-        this.form = new FormGroup({});
-        this.formOptions = {
+        this.formSubmit = output();
+        // content and view queries
+        this.submitButtonElementRef = viewChild('submitButton');
+        // formly specifics
+        this._form = new UntypedFormGroup({});
+        this._formlyOptions = {
             formState: {
                 add: false,
                 edit: false,
                 disabled: false
             }
         };
-        this.formModel = {};
-        this.formMessages = [];
-        this.subscriptions = [];
+        this._formlyFields = []; // initialized in ngOnInit, should not be changed after
+        this._formlyInitialItem = {}; // initialized in ngOnInit, should not be changed after
+        this.formMessages = signal([]);
+        effect(() => {
+            const item = this.item();
+            if (item !== this.initialItemInput) {
+                // new item is different from the one the form was initialized with. Must trigger reset of form model.
+                this.resetFormModel(item);
+            }
+        }, 
+        // resetModel uses signal like concept
+        { allowSignalWrites: true });
+        effect(() => {
+            this._formlyOptions.formState.disabled = this.isFormDisabled() || this._formlyOptions.formState.descriptor?.disabled === true || this._formlyOptions.formState.details;
+        });
     }
     ngOnInit() {
-        this.setInitialFormState();
-        this.resetFormModel(this.item);
-        this.submitLoading$ = this.submitLoading instanceof Observable ? this.submitLoading : of(this.submitLoading);
-        if (this.descriptor) {
-            // init fields for formly
-            this.formFields = EditorFormlyUtil.createFormlyConfigFromDescriptor(this.descriptor, this);
-            this.updateFormState();
-            // let the user know, that adding new value in table view with localizations is only supported in the default language
-            if (this.descriptor.isLocalized &&
-                (this.descriptor.tableviewEditorType === TableviewEditorTypeEnum.Add || this.descriptor.tableviewEditorType === TableviewEditorTypeEnum.Edit)) {
-                this.formMessages.push(getFormEditorInfoMessage(this.translateService, 'mngEditor.localizations.addInDefaultLanguageTitle', 'mngEditor.localizations.addInDefaultLanguageDescription', { defaultLanguage: this.commons.defaultDataLanguage }));
-            }
+        // init form state
+        if (this.descriptor().tableviewEditorType === TableviewEditorTypeEnum.Add) {
+            this._formlyOptions.formState.add = true;
+        }
+        else if (this.descriptor().tableviewEditorType === TableviewEditorTypeEnum.Edit) {
+            this._formlyOptions.formState.edit = true;
+        }
+        else if (this.descriptor().tableviewEditorType === TableviewEditorTypeEnum.Details) {
+            this._formlyOptions.formState.details = true;
+        }
+        this._formlyOptions.formState.descriptor = this.descriptor();
+        // init fields for formly
+        this._formlyFields = createFormlyConfigFromDescriptor(this.descriptor(), this.formlyConfig, this);
+        // int form model (only initial, no further changes to formModel should be allowed!)
+        this.initialItemInput = this.item();
+        this._formlyInitialItem = this.getFormModelFromItem(this.item());
+        // handle localizations edit/add message
+        if (this.descriptor().isLocalized &&
+            (this.descriptor().tableviewEditorType === TableviewEditorTypeEnum.Add || this.descriptor().tableviewEditorType === TableviewEditorTypeEnum.Edit)) {
+            this.formMessages.set([
+                ...this.formMessages(),
+                getFormEditorInfoMessage(this.translateService, 'mngEditor.localizations.addInDefaultLanguageTitle', 'mngEditor.localizations.addInDefaultLanguageDescription', {
+                    defaultLanguage: this.commons.defaultDataLanguage
+                })
+            ]);
         }
         // emit lifecycle event
-        this.descriptor?.nextEvent(FormEventTypeEnum.ComponentLifecycle, FormEditorComponent, this, {
+        this.descriptor().nextEvent(FormEventTypeEnum.ComponentLifecycle, FormEditorComponent, this, {
             eventSubtype: FormFieldEventComponentSubtype.ON_INIT
         });
-        this.subscriptions.push(this.form.valueChanges.pipe(debounceTime(250), distinctUntilChanged()).subscribe(v => {
-            this.descriptor?.nextEvent(FormEventTypeEnum.ValueChange, FormEditorComponent, this, {
+        this._form.valueChanges.pipe(takeUntilDestroyed(this.destroyRef), debounceTime(250), distinctUntilChanged()).subscribe(v => {
+            this.descriptor().nextEvent(FormEventTypeEnum.ValueChange, FormEditorComponent, this, {
                 value: v,
                 formValue: () => this.getFormValue()
             });
-        }));
-    }
-    ngOnChanges(changes) {
-        if (changes['isFormDisabled'] && !changes['isFormDisabled'].firstChange) {
-            this.updateFormState();
-        }
-        if (changes['item'] && !changes['item'].firstChange) {
-            this.resetFormModel(this.item);
-        }
+        });
+        // mark form as pristine, should be done in next event hook to allow formly to initialize first
+        setTimeout(() => {
+            this._form.markAsPristine();
+        });
     }
     ngOnDestroy() {
-        this.subscriptions.forEach(s => s.unsubscribe());
         // emit lifecycle event
-        this.descriptor?.nextEvent(FormEventTypeEnum.ComponentLifecycle, FormEditorComponent, this, {
+        this.descriptor().nextEvent(FormEventTypeEnum.ComponentLifecycle, FormEditorComponent, this, {
             eventSubtype: FormFieldEventComponentSubtype.ON_DESTROY
         });
-        // complete emitting events
-        this.descriptor?.completeEvents();
     }
     submit() {
-        this.submitButtonElementRef?.nativeElement.click();
+        this.submitButtonElementRef()?.nativeElement.click();
     }
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     onSubmit(event) {
-        this.formOptions.formState.submittedOn = Date.now();
-        this.formMessages = [];
+        this._formlyOptions.formState.submittedOn = Date.now();
+        this.formMessages.set([]);
         const formSubmitItem = this.getFormValue();
-        if (this.form.valid) {
-            this.formSubmitEventEmitter.next({
+        if (this._form.valid) {
+            this.formSubmit.emit({
                 success: true,
                 formItem: formSubmitItem
             });
-            this.descriptor?.nextEvent(FormEventTypeEnum.Submit, FormEditorComponent, this, {
+            this.descriptor().nextEvent(FormEventTypeEnum.Submit, FormEditorComponent, this, {
                 submitValid: true,
                 submitValue: formSubmitItem
             });
         }
         else {
             // find and mark invalid tabs
-            if (this.formFields[0].type === 'tabs' && this.formFields[0].fieldGroup) {
-                for (const tab of this.formFields[0].fieldGroup) {
+            const formFields = this._formlyFields;
+            if (formFields[0].type === 'tabs' && formFields[0].fieldGroup) {
+                for (const tab of formFields[0].fieldGroup) {
                     const isInvalid = this.isAnyFieldInvalid(tab.fieldGroup);
-                    this.formOptions.formState['tab_' + (tab.id ? tab.id : tab.props.props.label) + '_invalid'] = isInvalid;
+                    this._formlyOptions.formState['tab_' + (tab.id ? tab.id : tab.props.props.label) + '_invalid'] = isInvalid;
                 }
             }
             const event = { success: false, formItem: formSubmitItem };
             event.success = false;
-            this.formMessages.push(getFormEditorWarningMessage(this.translateService, 'mngEditor.invalidFormToastTitle', 'mngEditor.invalidFormToastMessage'));
-            this.formSubmitEventEmitter.next(event);
-            this.descriptor?.nextEvent(FormEventTypeEnum.Submit, FormEditorComponent, this, {
+            this.formMessages().push(getFormEditorWarningMessage(this.translateService, 'mngEditor.invalidFormToastTitle', 'mngEditor.invalidFormToastMessage'));
+            this.formSubmit.emit(event);
+            this.descriptor().nextEvent(FormEventTypeEnum.Submit, FormEditorComponent, this, {
                 submitValid: false,
                 submitValue: formSubmitItem
             });
         }
     }
     getFormValue() {
-        const formValue = ObjectUtil.deepCopy(this.form.getRawValue(), { mapGettersToProperties: true });
-        this.descriptor?.fields.forEach(field => {
+        const formValue = objectDeepCopy(this._form.getRawValue(), { mapGettersToProperties: true });
+        this.descriptor().fields.forEach(field => {
             if (field && field.setter) {
                 const splitPath = field.property.split('.');
                 let fieldValue = formValue;
@@ -2125,43 +2131,26 @@ class FormEditorComponent {
         });
         return formValue;
     }
-    resetFormModel(item, markAsPristine = true) {
-        if (typeof item !== 'undefined') {
-            this.originalItemPrototype = Object.getPrototypeOf(item);
-        }
-        const formModel = ObjectUtil.deepCopy(item, { mapGettersToProperties: true }) ?? {};
-        this.descriptor?.fields.forEach(field => {
-            if (field.getter && item) {
-                const splitPath = field.property.split('.');
-                let currentObject = formModel;
-                for (let i = 0; i < splitPath.length; i++) {
-                    const currentSubPath = splitPath[i];
-                    if (i === splitPath.length - 1) {
-                        currentObject[currentSubPath] = field.getter(item?.[field.property], item);
-                    }
-                    else {
-                        if (typeof currentObject[currentSubPath] !== 'object') {
-                            currentObject[currentSubPath] = {};
-                        }
-                        currentObject = currentObject[currentSubPath];
-                    }
-                }
-            }
-        });
-        if (typeof this.formOptions.resetModel === 'function') {
-            // could not be initiated yet
-            this.formOptions.resetModel(this.formModel);
-        }
-        this.formModel = formModel;
-        if (markAsPristine) {
-            this.form.markAsPristine();
+    resetFormModel(item, opts) {
+        this._formlyOptions.resetModel?.(this.getFormModelFromItem(item));
+        if (opts?.markAsPristine !== false) {
+            // mark form as pristine, should be done in next event hook to allow formly to initialize first
+            setTimeout(() => {
+                this._form.markAsPristine();
+            });
         }
     }
-    getFormField(key) {
-        return this.findFormField(this.form, key.split('.'));
+    getField(key) {
+        return this.getFieldUnsafe(key);
+    }
+    getFieldUnsafe(key) {
+        return this.findFormField(this._form, key.split('.'));
+    }
+    setFieldValue(key, value) {
+        return this.setFieldValueUnsafe(key, value);
     }
-    setFormFieldValue(key, value) {
-        const control = this.getFormField(key);
+    setFieldValueUnsafe(key, value) {
+        const control = this.getFieldUnsafe(key);
         if (control) {
             control.setValue(value);
             return true;
@@ -2171,8 +2160,11 @@ class FormEditorComponent {
             return false;
         }
     }
-    patchFormFieldValue(key, value) {
-        const control = this.getFormField(key);
+    patchFieldValue(key, value) {
+        return this.patchFieldValueUnsafe(key, value);
+    }
+    patchFieldValueUnsafe(key, value) {
+        const control = this.getFieldUnsafe(key);
         if (control) {
             control.patchValue(value);
             return true;
@@ -2182,8 +2174,11 @@ class FormEditorComponent {
             return false;
         }
     }
-    resetFormFieldValue(key, value) {
-        const control = this.getFormField(key);
+    resetFieldValue(key, value) {
+        return this.resetFieldValueUnsafe(key, value);
+    }
+    resetFieldValueUnsafe(key, value) {
+        const control = this.getFieldUnsafe(key);
         if (control) {
             control.reset(value);
             return true;
@@ -2193,6 +2188,29 @@ class FormEditorComponent {
             return false;
         }
     }
+    getFormModelFromItem(item) {
+        const formModel = objectDeepCopy(item, { mapGettersToProperties: true }) ?? {};
+        const descriptor = this.descriptor();
+        descriptor.fields.forEach(field => {
+            if (field.getter && item) {
+                const splitPath = field.property.split('.');
+                let currentObject = formModel;
+                for (let i = 0; i < splitPath.length; i++) {
+                    const currentSubPath = splitPath[i];
+                    if (i === splitPath.length - 1) {
+                        currentObject[currentSubPath] = field.getter(item?.[field.property], item);
+                    }
+                    else {
+                        if (typeof currentObject[currentSubPath] !== 'object') {
+                            currentObject[currentSubPath] = {};
+                        }
+                        currentObject = currentObject[currentSubPath];
+                    }
+                }
+            }
+        });
+        return formModel;
+    }
     findFormField(control, keyPath) {
         if (keyPath.length === 0) {
             return control;
@@ -2230,47 +2248,13 @@ class FormEditorComponent {
         }
         return false;
     }
-    updateFormState() {
-        const isDisabled = this.isFormDisabled || this.descriptor?.disabled === true || this.descriptor?.tableviewEditorType === TableviewEditorTypeEnum.Details;
-        this.formOptions.formState.disabled = isDisabled;
-    }
-    /**
-     * @private Sets form state based on editor descriptor type.
-     * Possible options are: disabled, add or edit.
-     */
-    setInitialFormState() {
-        if (this.descriptor?.tableviewEditorType === TableviewEditorTypeEnum.Add) {
-            this.formOptions.formState.add = true;
-        }
-        else if (this.descriptor?.tableviewEditorType === TableviewEditorTypeEnum.Edit) {
-            this.formOptions.formState.edit = true;
-        }
-        this.updateFormState();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: FormEditorComponent, isStandalone: true, selector: "mng-form-editor", inputs: { descriptor: "descriptor", submitLoading: "submitLoading", item: "item", isFormDisabled: "isFormDisabled" }, outputs: { formSubmitEventEmitter: "formSubmit" }, queries: [{ propertyName: "templates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "submitButtonElementRef", first: true, predicate: ["submitButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"form\" (ngSubmit)=\"onSubmit($event)\">\n    <formly-form [form]=\"form\" [fields]=\"formFields\" [options]=\"formOptions\" [model]=\"formModel\"></formly-form>\n    <button\n        #submitButton\n        pButton\n        type=\"submit\"\n        class=\"hidden\"\n        [disabled]=\"form.disabled\"\n        [loading]=\"(submitLoading$ | async) ?? false\"\n        loadingIcon=\"pi pi-spin pi-spinner\"></button>\n</form>\n<p-messages [value]=\"formMessages\" [enableService]=\"false\"></p-messages>\n", dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$2.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: i3.Messages, selector: "p-messages", inputs: ["value", "closable", "style", "styleClass", "enableService", "key", "escape", "severity", "showTransitionOptions", "hideTransitionOptions"], outputs: ["valueChange", "onClose"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.4", type: FormEditorComponent, isStandalone: true, selector: "mng-form-editor", inputs: { descriptor: { classPropertyName: "descriptor", publicName: "descriptor", isSignal: true, isRequired: true, transformFunction: null }, submitLoading: { classPropertyName: "submitLoading", publicName: "submitLoading", isSignal: true, isRequired: false, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, isFormDisabled: { classPropertyName: "isFormDisabled", publicName: "isFormDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { formSubmit: "formSubmit" }, viewQueries: [{ propertyName: "submitButtonElementRef", first: true, predicate: ["submitButton"], descendants: true, isSignal: true }], ngImport: i0, template: "<form [formGroup]=\"form\" (ngSubmit)=\"onSubmit($event)\">\n    <formly-form [form]=\"form\" [fields]=\"formlyFields\" [options]=\"formlyOptions\" [model]=\"formlyInitialItem\"></formly-form>\n    <button #submitButton pButton type=\"submit\" class=\"hidden\" [disabled]=\"form.disabled\" [loading]=\"submitLoading()\" loadingIcon=\"pi pi-spin pi-spinner\"></button>\n</form>\n<p-messages [value]=\"formMessages()\" [enableService]=\"false\"></p-messages>\n", dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$1.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: i3$1.Messages, selector: "p-messages", inputs: ["value", "closable", "style", "styleClass", "enableService", "key", "escape", "severity", "showTransitionOptions", "hideTransitionOptions"], outputs: ["valueChange", "onClose"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormEditorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormEditorComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-form-editor', imports: [FormlyModule, ReactiveFormsModule, MessagesModule, AsyncPipe, ButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<form [formGroup]=\"form\" (ngSubmit)=\"onSubmit($event)\">\n    <formly-form [form]=\"form\" [fields]=\"formFields\" [options]=\"formOptions\" [model]=\"formModel\"></formly-form>\n    <button\n        #submitButton\n        pButton\n        type=\"submit\"\n        class=\"hidden\"\n        [disabled]=\"form.disabled\"\n        [loading]=\"(submitLoading$ | async) ?? false\"\n        loadingIcon=\"pi pi-spin pi-spinner\"></button>\n</form>\n<p-messages [value]=\"formMessages\" [enableService]=\"false\"></p-messages>\n" }]
-        }], propDecorators: { descriptor: [{
-                type: Input
-            }], submitLoading: [{
-                type: Input
-            }], item: [{
-                type: Input
-            }], isFormDisabled: [{
-                type: Input
-            }], formSubmitEventEmitter: [{
-                type: Output,
-                args: ['formSubmit']
-            }], templates: [{
-                type: ContentChildren,
-                args: [TemplateDirective]
-            }], submitButtonElementRef: [{
-                type: ViewChild,
-                args: ['submitButton']
-            }] } });
+            args: [{ standalone: true, selector: 'mng-form-editor', imports: [FormlyModule, ReactiveFormsModule, MessagesModule, AsyncPipe, ButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<form [formGroup]=\"form\" (ngSubmit)=\"onSubmit($event)\">\n    <formly-form [form]=\"form\" [fields]=\"formlyFields\" [options]=\"formlyOptions\" [model]=\"formlyInitialItem\"></formly-form>\n    <button #submitButton pButton type=\"submit\" class=\"hidden\" [disabled]=\"form.disabled\" [loading]=\"submitLoading()\" loadingIcon=\"pi pi-spin pi-spinner\"></button>\n</form>\n<p-messages [value]=\"formMessages()\" [enableService]=\"false\"></p-messages>\n" }]
+        }], ctorParameters: () => [] });
 
 class ActionEditorInjectorContextComponent {
     constructor() {
@@ -2339,7 +2323,7 @@ class ActionEditorInjectorContextComponent {
                 }
                 else if (e.fields) {
                     for (const key in e.fields) {
-                        this.formEditorCmp?.resetFormFieldValue(key, e.fields[key]);
+                        this.formEditorCmp?.resetFieldValue(key, e.fields[key]);
                     }
                 }
             }
@@ -2362,7 +2346,6 @@ class ActionEditorInjectorContextComponent {
             throw new CommonsInternalError(`Action is not instantiated in action editor for action ${this.data.descriptor.actionName}.`);
         }
         if (event.success) {
-            this.instanceSubmitFormItem = event.formItem;
             // prepare parameters
             const actionParameters = {
                 itemId: this.itemId(),
@@ -2381,7 +2364,6 @@ class ActionEditorInjectorContextComponent {
                         this.updateItemId(res[this.data.descriptor.model.idProperty]);
                     }
                     this.actionRunEventEmitter.next(res);
-                    this.instanceSubmitResult = res;
                 }
             });
             this.actionExecutor.run(context);
@@ -2472,7 +2454,7 @@ class ActionEditorInjectorContextComponent {
             this.title.set(undefined);
             return;
         }
-        I18nUtils.Action.getEditorTitleAsync(this.translate, this.data.descriptor, this.item()).subscribe(t => {
+        getI18nActionEditorTitleAsync(this.translate, this.data.descriptor, this.item()).subscribe(t => {
             this.title.set(t ?? undefined);
         });
     }
@@ -2557,6 +2539,9 @@ class ActionEditorInjectorContextComponent {
                         break;
                     case ActionInstanceStateEnum.FinishSuccessReactivateFinal:
                         this.setEditorEnabled(false);
+                        // make copy of item and update title to be on the latest
+                        this.item.set(objectDeepCopy(this.item()));
+                        this.updateTitle();
                         // should also unsetInstance, but let this for reactivationInstance$ listener to not interfere
                         break;
                 }
@@ -2584,6 +2569,17 @@ class ActionEditorInjectorContextComponent {
             parseInt(this.dialogService.dialogComponentRefMap.get(this.instance?.activationDialogRef)?.instance.container?.style.zIndex ?? '') === ZIndexUtils.getCurrent())
             this.closeWithUnsavedChangesConfirmation();
     }
+    closeWithUnsavedChangesConfirmation(callFromGuard = false) {
+        if (this.formEditorCmp?.form.pristine === false && this.data.descriptor.unsavedChangesConfirmation) {
+            return this.showUnsavedChangesConfirmationDialog(callFromGuard);
+        }
+        else {
+            if (!callFromGuard) {
+                this.cancel();
+            }
+        }
+        return of(true);
+    }
     showUnsavedChangesConfirmationDialog(callFromGuard) {
         const subject = new Subject();
         this.confirmationService.confirm({
@@ -2606,21 +2602,10 @@ class ActionEditorInjectorContextComponent {
         });
         return subject.asObservable();
     }
-    closeWithUnsavedChangesConfirmation(callFromGuard = false) {
-        if (this.formEditorCmp?.form.pristine === false && this.data.descriptor.unsavedChangesConfirmation) {
-            return this.showUnsavedChangesConfirmationDialog(callFromGuard);
-        }
-        else {
-            if (!callFromGuard) {
-                this.cancel();
-            }
-        }
-        return of(true);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionEditorInjectorContextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: ActionEditorInjectorContextComponent, isStandalone: true, selector: "mng-action-editor-injector-context", inputs: { data: "data" }, outputs: { actionRunEventEmitter: "actionSubmit", actionCancelEventEmitter: "actionCancel" }, host: { listeners: { "window:beforeunload": "beforeWindowUnload()", "window:keydown.Escape": "onEscapePressed()" } }, providers: [provideActionExecutor()], viewQueries: [{ propertyName: "submitButtonElementRef", first: true, predicate: ["submitButton"], descendants: true }, { propertyName: "formEditorCmp", first: true, predicate: FormEditorComponent, descendants: true }], ngImport: i0, template: "@if (!data.isDialog && title()) {\n    <h5>{{ title() }}</h5>\n}\n@if (data.isDialog && data.descriptor.activationTrigger === ActionActivationTriggerEnum.OnRoute) {\n    <span class=\"p-dialog-header dialog-close-button-wrapper\">\n        <button\n            class=\"p-dialog-header-icon p-dialog-header-maximize p-link\"\n            type=\"button\"\n            (click)=\"closeWithUnsavedChangesConfirmation()\"\n            (keydown.enter)=\"closeWithUnsavedChangesConfirmation()\">\n            <span class=\"p-dialog-header-close-icon pi pi-times\"></span>\n        </button>\n    </span>\n}\n<div class=\"h-full flex flex-column\">\n    @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n        <div class=\"flex-grow-1 mng-action-editor-toolbar-container\">\n            <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n                <ng-template pTemplate=\"left\">\n                    @for (action of toolbarLeftActions(); track action) {\n                        <mng-action\n                            [action]=\"action\"\n                            [disabled]=\"submitLoading()\"\n                            [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                            [hostComponent]=\"this\"\n                            [item]=\"item()\"\n                            [itemId]=\"itemId()\"></mng-action>\n                    }\n                </ng-template>\n                <ng-template pTemplate=\"right\">\n                    @for (action of toolbarRightActions(); track action) {\n                        <mng-action\n                            [action]=\"action\"\n                            [disabled]=\"submitLoading()\"\n                            [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                            [hostComponent]=\"this\"\n                            [item]=\"item()\"\n                            [itemId]=\"itemId()\"></mng-action>\n                    }\n                </ng-template>\n            </p-toolbar>\n        </div>\n    }\n\n    <div class=\"flex-grow-1 mng-action-editor-form-container\">\n        @if (loading()) {\n            <div class=\"text-center\">\n                <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n            </div>\n        }\n        @if (data.descriptor.editorDescriptor && !loading()) {\n            <mng-form-editor [descriptor]=\"data.descriptor.editorDescriptor\" [item]=\"item()\" [isFormDisabled]=\"isFormDisabled()\" (formSubmit)=\"onSubmit($event)\"> </mng-form-editor>\n        }\n    </div>\n\n    <div class=\"flex flex-row justify-content-between mng-action-editor-footer-container\">\n        <div>\n            @for (action of footerLeftActions(); track action) {\n                <mng-action\n                    [action]=\"action\"\n                    [disabled]=\"submitLoading()\"\n                    [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                    [hostComponent]=\"this\"\n                    [item]=\"item()\"\n                    [itemId]=\"itemId()\"></mng-action>\n            }\n        </div>\n        <div>\n            @for (action of footerRightActions(); track action) {\n                <mng-action\n                    [action]=\"action\"\n                    [disabled]=\"submitLoading()\"\n                    [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                    [hostComponent]=\"this\"\n                    [item]=\"item()\"\n                    [itemId]=\"itemId()\"></mng-action>\n            }\n        </div>\n    </div>\n</div>\n", styles: [".dialog-close-button-wrapper{position:absolute;top:1.286rem;right:1.714rem;background:transparent;padding:0}\n"], dependencies: [{ kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i1$3.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: FormEditorComponent, selector: "mng-form-editor", inputs: ["descriptor", "submitLoading", "item", "isFormDisabled"], outputs: ["formSubmit"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i2$3.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionEditorInjectorContextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ActionEditorInjectorContextComponent, isStandalone: true, selector: "mng-action-editor-injector-context", inputs: { data: "data" }, outputs: { actionRunEventEmitter: "actionSubmit", actionCancelEventEmitter: "actionCancel" }, host: { listeners: { "window:beforeunload": "beforeWindowUnload()", "window:keydown.Escape": "onEscapePressed()" } }, providers: [provideActionExecutor()], viewQueries: [{ propertyName: "submitButtonElementRef", first: true, predicate: ["submitButton"], descendants: true }, { propertyName: "formEditorCmp", first: true, predicate: FormEditorComponent, descendants: true }], ngImport: i0, template: "@if (!data.isDialog && title()) {\n    <h5>{{ title() }}</h5>\n}\n@if (data.isDialog && data.descriptor.activationTrigger === ActionActivationTriggerEnum.OnRoute) {\n    <span class=\"p-dialog-header dialog-close-button-wrapper\">\n        <button\n            class=\"p-dialog-header-icon p-dialog-header-maximize p-link\"\n            type=\"button\"\n            (click)=\"closeWithUnsavedChangesConfirmation()\"\n            (keydown.enter)=\"closeWithUnsavedChangesConfirmation()\">\n            <span class=\"p-dialog-header-close-icon pi pi-times\"></span>\n        </button>\n    </span>\n}\n<div class=\"h-full flex flex-column\">\n    @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n        <div class=\"flex-grow-1 mng-action-editor-toolbar-container\">\n            <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n                <ng-template pTemplate=\"left\">\n                    @for (action of toolbarLeftActions(); track action) {\n                        <mng-action\n                            [action]=\"action\"\n                            [disabled]=\"submitLoading()\"\n                            [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                            [hostComponent]=\"this\"\n                            [item]=\"item()\"\n                            [itemId]=\"itemId()\"></mng-action>\n                    }\n                </ng-template>\n                <ng-template pTemplate=\"right\">\n                    @for (action of toolbarRightActions(); track action) {\n                        <mng-action\n                            [action]=\"action\"\n                            [disabled]=\"submitLoading()\"\n                            [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                            [hostComponent]=\"this\"\n                            [item]=\"item()\"\n                            [itemId]=\"itemId()\"></mng-action>\n                    }\n                </ng-template>\n            </p-toolbar>\n        </div>\n    }\n\n    <div class=\"flex-grow-1 mng-action-editor-form-container\">\n        @if (loading()) {\n            <div class=\"text-center\">\n                <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n            </div>\n        }\n        @if (data.descriptor.editorDescriptor && !loading()) {\n            <mng-form-editor [descriptor]=\"data.descriptor.editorDescriptor\" [item]=\"item()\" [isFormDisabled]=\"isFormDisabled()\" (formSubmit)=\"onSubmit($event)\"> </mng-form-editor>\n        }\n    </div>\n\n    <div class=\"flex flex-row justify-content-between mng-action-editor-footer-container\">\n        <div>\n            @for (action of footerLeftActions(); track action) {\n                <mng-action\n                    [action]=\"action\"\n                    [disabled]=\"submitLoading()\"\n                    [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                    [hostComponent]=\"this\"\n                    [item]=\"item()\"\n                    [itemId]=\"itemId()\"></mng-action>\n            }\n        </div>\n        <div>\n            @for (action of footerRightActions(); track action) {\n                <mng-action\n                    [action]=\"action\"\n                    [disabled]=\"submitLoading()\"\n                    [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                    [hostComponent]=\"this\"\n                    [item]=\"item()\"\n                    [itemId]=\"itemId()\"></mng-action>\n            }\n        </div>\n    </div>\n</div>\n", styles: [".dialog-close-button-wrapper{position:absolute;top:1.286rem;right:1.714rem;background:transparent;padding:0}\n"], dependencies: [{ kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i1$3.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: FormEditorComponent, selector: "mng-form-editor", inputs: ["descriptor", "submitLoading", "item", "isFormDisabled"], outputs: ["formSubmit"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i2$2.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionEditorInjectorContextComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionEditorInjectorContextComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-action-editor-injector-context', imports: [ActionComponent, ProgressSpinnerModule, FormEditorComponent, ComponentDirective, ToolbarModule], changeDetection: ChangeDetectionStrategy.OnPush, providers: [provideActionExecutor()], template: "@if (!data.isDialog && title()) {\n    <h5>{{ title() }}</h5>\n}\n@if (data.isDialog && data.descriptor.activationTrigger === ActionActivationTriggerEnum.OnRoute) {\n    <span class=\"p-dialog-header dialog-close-button-wrapper\">\n        <button\n            class=\"p-dialog-header-icon p-dialog-header-maximize p-link\"\n            type=\"button\"\n            (click)=\"closeWithUnsavedChangesConfirmation()\"\n            (keydown.enter)=\"closeWithUnsavedChangesConfirmation()\">\n            <span class=\"p-dialog-header-close-icon pi pi-times\"></span>\n        </button>\n    </span>\n}\n<div class=\"h-full flex flex-column\">\n    @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n        <div class=\"flex-grow-1 mng-action-editor-toolbar-container\">\n            <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n                <ng-template pTemplate=\"left\">\n                    @for (action of toolbarLeftActions(); track action) {\n                        <mng-action\n                            [action]=\"action\"\n                            [disabled]=\"submitLoading()\"\n                            [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                            [hostComponent]=\"this\"\n                            [item]=\"item()\"\n                            [itemId]=\"itemId()\"></mng-action>\n                    }\n                </ng-template>\n                <ng-template pTemplate=\"right\">\n                    @for (action of toolbarRightActions(); track action) {\n                        <mng-action\n                            [action]=\"action\"\n                            [disabled]=\"submitLoading()\"\n                            [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                            [hostComponent]=\"this\"\n                            [item]=\"item()\"\n                            [itemId]=\"itemId()\"></mng-action>\n                    }\n                </ng-template>\n            </p-toolbar>\n        </div>\n    }\n\n    <div class=\"flex-grow-1 mng-action-editor-form-container\">\n        @if (loading()) {\n            <div class=\"text-center\">\n                <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n            </div>\n        }\n        @if (data.descriptor.editorDescriptor && !loading()) {\n            <mng-form-editor [descriptor]=\"data.descriptor.editorDescriptor\" [item]=\"item()\" [isFormDisabled]=\"isFormDisabled()\" (formSubmit)=\"onSubmit($event)\"> </mng-form-editor>\n        }\n    </div>\n\n    <div class=\"flex flex-row justify-content-between mng-action-editor-footer-container\">\n        <div>\n            @for (action of footerLeftActions(); track action) {\n                <mng-action\n                    [action]=\"action\"\n                    [disabled]=\"submitLoading()\"\n                    [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                    [hostComponent]=\"this\"\n                    [item]=\"item()\"\n                    [itemId]=\"itemId()\"></mng-action>\n            }\n        </div>\n        <div>\n            @for (action of footerRightActions(); track action) {\n                <mng-action\n                    [action]=\"action\"\n                    [disabled]=\"submitLoading()\"\n                    [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n                    [hostComponent]=\"this\"\n                    [item]=\"item()\"\n                    [itemId]=\"itemId()\"></mng-action>\n            }\n        </div>\n    </div>\n</div>\n", styles: [".dialog-close-button-wrapper{position:absolute;top:1.286rem;right:1.714rem;background:transparent;padding:0}\n"] }]
         }], ctorParameters: () => [], propDecorators: { data: [{
@@ -2708,10 +2693,10 @@ class ActionEditorComponent {
     triggerSubmit() {
         this.actionEditorWInjContextCmp?.triggerSubmit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: ActionEditorComponent, isStandalone: true, selector: "mng-action-editor", inputs: { action: "action", itemIdInput: ["itemId", "itemIdInput"], itemInput: ["item", "itemInput"], actionData: "actionData", dataProvider: "dataProvider" }, outputs: { actionRunEventEmitter: "actionSubmit", actionCancelEventEmitter: "actionCancel" }, usesOnChanges: true, hostDirectives: [{ directive: i1$1.DialogKeydownHandlerDirective }], ngImport: i0, template: "<div\n    [mngComponent]=\"injContextCmpType\"\n    [inputs]=\"{\n        data: actionEditorWInjContextInputData\n    }\"\n    [nodeInjector]=\"injector\"\n    (instanceCreated)=\"onActionEditorWInjContextCmp($event)\"></div>\n", dependencies: [{ kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "nodeInjector"], outputs: ["instanceCreated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: ActionEditorComponent, isStandalone: true, selector: "mng-action-editor", inputs: { action: "action", itemIdInput: ["itemId", "itemIdInput"], itemInput: ["item", "itemInput"], actionData: "actionData", dataProvider: "dataProvider" }, outputs: { actionRunEventEmitter: "actionSubmit", actionCancelEventEmitter: "actionCancel" }, usesOnChanges: true, hostDirectives: [{ directive: i1$2.DialogKeydownHandlerDirective }], ngImport: i0, template: "<div\n    [mngComponent]=\"injContextCmpType\"\n    [inputs]=\"{\n        data: actionEditorWInjContextInputData\n    }\"\n    [nodeInjector]=\"injector\"\n    (instanceCreated)=\"onActionEditorWInjContextCmp($event)\"></div>\n", dependencies: [{ kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "nodeInjector"], outputs: ["instanceCreated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionEditorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionEditorComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-action-editor', imports: [ComponentDirective], hostDirectives: [DialogKeydownHandlerDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    [mngComponent]=\"injContextCmpType\"\n    [inputs]=\"{\n        data: actionEditorWInjContextInputData\n    }\"\n    [nodeInjector]=\"injector\"\n    (instanceCreated)=\"onActionEditorWInjContextCmp($event)\"></div>\n" }]
         }], propDecorators: { action: [{
@@ -2746,13 +2731,13 @@ class DataLanguageDropdownComponent {
         this.commons.appDataLanguage = dataLang;
         this.viewContainer?.reloadTable({});
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: DataLanguageDropdownComponent, deps: [{ token: i1$1.CommonsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: DataLanguageDropdownComponent, isStandalone: true, selector: "mng-data-language-dropdown", inputs: { action: "action", actionData: "actionData", item: "item", itemId: "itemId", enabled: "enabled", loading: "loading" }, outputs: { triggerActionEventEmitter: "triggerActionEventEmitter" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: DropdownComponent, descendants: true }], ngImport: i0, template: "<mng-dropdown [dataProvider]=\"selectionItemsDataProvider\" [ngModel]=\"commons.appDataLanguage\" [showClear]=\"false\" (valueChange)=\"updateDataLanguage($event)\"></mng-dropdown>\n", dependencies: [{ kind: "component", type: DropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "options", "optionsTrackProperty", "optionsLabelProperty", "optionsLabelTranslate", "optionsValueProperty", "optionsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: DataLanguageDropdownComponent, deps: [{ token: i1$2.CommonsService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: DataLanguageDropdownComponent, isStandalone: true, selector: "mng-data-language-dropdown", inputs: { action: "action", actionData: "actionData", item: "item", itemId: "itemId", enabled: "enabled", loading: "loading" }, outputs: { triggerActionEventEmitter: "triggerActionEventEmitter" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: DropdownComponent, descendants: true }], ngImport: i0, template: "<mng-dropdown [dataProvider]=\"selectionItemsDataProvider\" [ngModel]=\"commons.appDataLanguage\" [showClear]=\"false\" (valueChange)=\"updateDataLanguage($event)\"></mng-dropdown>\n", dependencies: [{ kind: "component", type: DropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "options", "optionsTrackProperty", "optionsLabelProperty", "optionsLabelTranslate", "optionsValueProperty", "optionsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: DataLanguageDropdownComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: DataLanguageDropdownComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-data-language-dropdown', imports: [DropdownComponent, FormsModule], template: "<mng-dropdown [dataProvider]=\"selectionItemsDataProvider\" [ngModel]=\"commons.appDataLanguage\" [showClear]=\"false\" (valueChange)=\"updateDataLanguage($event)\"></mng-dropdown>\n" }]
-        }], ctorParameters: () => [{ type: i1$1.CommonsService }], propDecorators: { action: [{
+        }], ctorParameters: () => [{ type: i1$2.CommonsService }], propDecorators: { action: [{
                 type: Input,
                 args: [{ required: true }]
             }], actionData: [{
@@ -2885,6 +2870,7 @@ class ActionRouteComponent {
                         this.viewContainer?.reloadTable(); // reload only if no error in action and
                         this.untriggerAction();
                         break;
+                    case ActionInstanceStateEnum.FinishErrorFinal:
                     case ActionInstanceStateEnum.FinishDismissedFinal:
                         this.untriggerAction();
                         break;
@@ -2906,16 +2892,21 @@ class ActionRouteComponent {
         this.instanceStateSubscription?.unsubscribe();
         this.instanceReactivationSubscription?.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionRouteComponent, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: ActionExecutorService }, { token: ViewContainer, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: ActionRouteComponent, isStandalone: true, selector: "mng-action-route", providers: [provideActionExecutor()], ngImport: i0, template: "", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionRouteComponent, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: ActionExecutorService }, { token: ViewContainer, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: ActionRouteComponent, isStandalone: true, selector: "mng-action-route", providers: [provideActionExecutor()], ngImport: i0, template: "", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionRouteComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionRouteComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-action-route', changeDetection: ChangeDetectionStrategy.OnPush, providers: [provideActionExecutor()], template: "" }]
         }], ctorParameters: () => [{ type: i1.Router }, { type: i1.ActivatedRoute }, { type: ActionExecutorService }, { type: ViewContainer, decorators: [{
                     type: Optional
                 }] }] });
 
+var actionRoute_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    default: ActionRouteComponent
+});
+
 function calculateTableColumnActionWidth(table, actions) {
     const buttonsWidth = actions.reduce((acc, action) => acc + getActionButtonRoundedWidth(action) + 2 * Styles.ACTION_BUTTON_MARGIN_X, 0);
     const tablePadding = getTableCellPaddingX(table);
@@ -2962,9 +2953,12 @@ class ActionTableComponent {
         this.selectionChangeEventEmitter = new EventEmitter();
         this.captionCmpInstEventEmitter = new EventEmitter();
         this.columnActionCmpInstEventEmitter = new EventEmitter();
+        // content and view queries
+        this.templates = contentChildren(TemplateDirective);
         // templates
-        this.captionTemplate = signal(undefined);
-        this.footerTemplate = signal(undefined);
+        this.captionTemplate = computed(() => findTemplateByName([...this.templates()], 'caption'));
+        this.footerTemplate = computed(() => findTemplateByName([...this.templates()], 'footer'));
+        this.rowExpandTemplate = computed(() => findTemplateByName([...this.templates()], 'rowExpandContent'));
         // actions
         this.rowClickActions = signal([]);
         this.rowInlineActions = signal([]);
@@ -2991,18 +2985,6 @@ class ActionTableComponent {
             this.columnActionMinWidth = calculateTableColumnActionWidth(this.descriptor, this.rowInlineActions());
         }
     }
-    ngAfterContentInit() {
-        this.templates.forEach(template => {
-            switch (template.getType()) {
-                case 'caption':
-                    this.captionTemplate.set(template.template);
-                    break;
-                case 'footer':
-                    this.footerTemplate.set(template.template);
-                    break;
-            }
-        });
-    }
     reload(emitEvent = false, resetParams = false) {
         this.table.reload(emitEvent, resetParams);
     }
@@ -3031,12 +3013,12 @@ class ActionTableComponent {
             this.reload();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: ActionTableComponent, isStandalone: true, selector: "mng-action-table", inputs: { descriptor: "descriptor", items: "items", result: ["result", "result", (value) => (isObservable(value) ? value : of(value))], loading: ["loading", "loading", boolean$Attribute], dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", globalFilterFields: "globalFilterFields", actions: "actions", captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth" }, outputs: { loadEventEmitter: "tableLoad", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, providers: [provideActionExecutor()], queries: [{ propertyName: "templates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "table", first: true, predicate: TableComponent, descendants: true }, { propertyName: "components", predicate: ComponentDirective, descendants: true }], ngImport: i0, template: "<mng-table\n    [descriptor]=\"descriptor\"\n    [items]=\"items\"\n    [result]=\"result\"\n    [loading]=\"loading\"\n    [dataProvider]=\"dataProvider\"\n    [useQueryParams]=\"useQueryParams\"\n    [selectionMode]=\"selectionMode\"\n    [selectionEnabled]=\"selectionEnabled\"\n    [globalFilterFields]=\"globalFilterFields\"\n    [captionComponent]=\"captionComponent\"\n    [columnCustomLastComponent]=\"columnActionComponent\"\n    [columnLastMinWidth]=\"columnActionMinWidth\"\n    (tableLoad)=\"loadEventEmitter.next($event)\"\n    (cellClick)=\"onCellClick($event)\"\n    (selectionChange)=\"onSelectionChange($event)\"\n    (captionComponentInstance)=\"captionCmpInstEventEmitter.next($event)\"\n    (columnCustomLastComponentInstance)=\"columnActionCmpInstEventEmitter.next($event)\">\n    @if (!columnActionComponent && rowInlineActions().length > 0) {\n        <ng-template mngTemplate=\"columnCustomLast\" let-item=\"rowItem\" let-idx=\"rowIndex\">\n            @for (action of rowInlineActions(); track action.actionNameLong) {\n                <mng-action\n                    [action]=\"action\"\n                    [item]=\"item\"\n                    [hostComponent]=\"this\"\n                    [itemId]=\"descriptor.model.idProperty ? item[descriptor.model.idProperty!] : null\"\n                    [actionData]=\"{itemIndex: idx}\"\n                    (finish)=\"onActionFinish($event)\">\n                </mng-action>\n            }\n        </ng-template>\n    }\n    @if (captionTemplate() && !captionComponent) {\n        <ng-template mngTemplate=\"caption\">\n            <ng-container *ngTemplateOutlet=\"captionTemplate()!\"></ng-container>\n        </ng-template>\n    }\n    @if (footerTemplate()) {\n        <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n            <ng-container *ngTemplateOutlet=\"footerTemplate()!; context: {data, totalCount}\"></ng-container>\n        </ng-template>\n    }\n</mng-table>\n", dependencies: [{ kind: "component", type: TableComponent, selector: "mng-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "columnLastMinWidth", "captionComponent", "columnCustomLastComponent", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnCustomLastComponentInstance"] }, { kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ActionTableComponent, isStandalone: true, selector: "mng-action-table", inputs: { descriptor: "descriptor", items: "items", result: ["result", "result", (value) => (isObservable(value) ? value : of(value))], loading: ["loading", "loading", boolean$Attribute], dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", globalFilterFields: "globalFilterFields", actions: "actions", captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth" }, outputs: { loadEventEmitter: "tableLoad", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, providers: [provideActionExecutor()], queries: [{ propertyName: "templates", predicate: TemplateDirective, isSignal: true }], viewQueries: [{ propertyName: "table", first: true, predicate: TableComponent, descendants: true }, { propertyName: "components", predicate: ComponentDirective, descendants: true }], ngImport: i0, template: "<mng-table\n    [descriptor]=\"descriptor\"\n    [items]=\"items\"\n    [result]=\"result\"\n    [loading]=\"loading\"\n    [dataProvider]=\"dataProvider\"\n    [useQueryParams]=\"useQueryParams\"\n    [selectionMode]=\"selectionMode\"\n    [selectionEnabled]=\"selectionEnabled\"\n    [globalFilterFields]=\"globalFilterFields\"\n    [captionComponent]=\"captionComponent\"\n    [columnCustomLastComponent]=\"columnActionComponent\"\n    [columnLastMinWidth]=\"columnActionMinWidth\"\n    (tableLoad)=\"loadEventEmitter.next($event)\"\n    (cellClick)=\"onCellClick($event)\"\n    (selectionChange)=\"onSelectionChange($event)\"\n    (captionComponentInstance)=\"captionCmpInstEventEmitter.next($event)\"\n    (columnCustomLastComponentInstance)=\"columnActionCmpInstEventEmitter.next($event)\">\n    @if (!columnActionComponent && rowInlineActions().length > 0) {\n        <ng-template mngTemplate=\"columnCustomLast\" let-item=\"rowItem\" let-idx=\"rowIndex\">\n            @for (action of rowInlineActions(); track action.actionNameLong) {\n                <mng-action\n                    [action]=\"action\"\n                    [item]=\"item\"\n                    [hostComponent]=\"this\"\n                    [itemId]=\"descriptor.model.idProperty ? item[descriptor.model.idProperty!] : null\"\n                    [actionData]=\"{itemIndex: idx}\"\n                    (finish)=\"onActionFinish($event)\">\n                </mng-action>\n            }\n        </ng-template>\n    }\n    @if (captionTemplate() && !captionComponent) {\n        <ng-template mngTemplate=\"caption\">\n            <ng-container *ngTemplateOutlet=\"captionTemplate()\"></ng-container>\n        </ng-template>\n    }\n    @if (rowExpandTemplate()) {\n        <ng-template mngTemplate=\"rowExpandContent\" let-item=\"rowItem\">\n            <ng-container *ngTemplateOutlet=\"rowExpandTemplate(); context: {rowItem: item}\"></ng-container>\n        </ng-template>\n    }\n    @if (footerTemplate()) {\n        <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n            <ng-container *ngTemplateOutlet=\"footerTemplate(); context: {data, totalCount}\"></ng-container>\n        </ng-template>\n    }\n</mng-table>\n", dependencies: [{ kind: "component", type: TableComponent, selector: "mng-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "columnLastMinWidth", "captionComponent", "columnCustomLastComponent", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnCustomLastComponentInstance"] }, { kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ActionTableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ActionTableComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-action-table', imports: [TableComponent, ActionComponent, TemplateDirective, NgTemplateOutlet], providers: [provideActionExecutor()], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-table\n    [descriptor]=\"descriptor\"\n    [items]=\"items\"\n    [result]=\"result\"\n    [loading]=\"loading\"\n    [dataProvider]=\"dataProvider\"\n    [useQueryParams]=\"useQueryParams\"\n    [selectionMode]=\"selectionMode\"\n    [selectionEnabled]=\"selectionEnabled\"\n    [globalFilterFields]=\"globalFilterFields\"\n    [captionComponent]=\"captionComponent\"\n    [columnCustomLastComponent]=\"columnActionComponent\"\n    [columnLastMinWidth]=\"columnActionMinWidth\"\n    (tableLoad)=\"loadEventEmitter.next($event)\"\n    (cellClick)=\"onCellClick($event)\"\n    (selectionChange)=\"onSelectionChange($event)\"\n    (captionComponentInstance)=\"captionCmpInstEventEmitter.next($event)\"\n    (columnCustomLastComponentInstance)=\"columnActionCmpInstEventEmitter.next($event)\">\n    @if (!columnActionComponent && rowInlineActions().length > 0) {\n        <ng-template mngTemplate=\"columnCustomLast\" let-item=\"rowItem\" let-idx=\"rowIndex\">\n            @for (action of rowInlineActions(); track action.actionNameLong) {\n                <mng-action\n                    [action]=\"action\"\n                    [item]=\"item\"\n                    [hostComponent]=\"this\"\n                    [itemId]=\"descriptor.model.idProperty ? item[descriptor.model.idProperty!] : null\"\n                    [actionData]=\"{itemIndex: idx}\"\n                    (finish)=\"onActionFinish($event)\">\n                </mng-action>\n            }\n        </ng-template>\n    }\n    @if (captionTemplate() && !captionComponent) {\n        <ng-template mngTemplate=\"caption\">\n            <ng-container *ngTemplateOutlet=\"captionTemplate()!\"></ng-container>\n        </ng-template>\n    }\n    @if (footerTemplate()) {\n        <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n            <ng-container *ngTemplateOutlet=\"footerTemplate()!; context: {data, totalCount}\"></ng-container>\n        </ng-template>\n    }\n</mng-table>\n" }]
+            args: [{ standalone: true, selector: 'mng-action-table', imports: [TableComponent, ActionComponent, TemplateDirective, NgTemplateOutlet], providers: [provideActionExecutor()], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-table\n    [descriptor]=\"descriptor\"\n    [items]=\"items\"\n    [result]=\"result\"\n    [loading]=\"loading\"\n    [dataProvider]=\"dataProvider\"\n    [useQueryParams]=\"useQueryParams\"\n    [selectionMode]=\"selectionMode\"\n    [selectionEnabled]=\"selectionEnabled\"\n    [globalFilterFields]=\"globalFilterFields\"\n    [captionComponent]=\"captionComponent\"\n    [columnCustomLastComponent]=\"columnActionComponent\"\n    [columnLastMinWidth]=\"columnActionMinWidth\"\n    (tableLoad)=\"loadEventEmitter.next($event)\"\n    (cellClick)=\"onCellClick($event)\"\n    (selectionChange)=\"onSelectionChange($event)\"\n    (captionComponentInstance)=\"captionCmpInstEventEmitter.next($event)\"\n    (columnCustomLastComponentInstance)=\"columnActionCmpInstEventEmitter.next($event)\">\n    @if (!columnActionComponent && rowInlineActions().length > 0) {\n        <ng-template mngTemplate=\"columnCustomLast\" let-item=\"rowItem\" let-idx=\"rowIndex\">\n            @for (action of rowInlineActions(); track action.actionNameLong) {\n                <mng-action\n                    [action]=\"action\"\n                    [item]=\"item\"\n                    [hostComponent]=\"this\"\n                    [itemId]=\"descriptor.model.idProperty ? item[descriptor.model.idProperty!] : null\"\n                    [actionData]=\"{itemIndex: idx}\"\n                    (finish)=\"onActionFinish($event)\">\n                </mng-action>\n            }\n        </ng-template>\n    }\n    @if (captionTemplate() && !captionComponent) {\n        <ng-template mngTemplate=\"caption\">\n            <ng-container *ngTemplateOutlet=\"captionTemplate()\"></ng-container>\n        </ng-template>\n    }\n    @if (rowExpandTemplate()) {\n        <ng-template mngTemplate=\"rowExpandContent\" let-item=\"rowItem\">\n            <ng-container *ngTemplateOutlet=\"rowExpandTemplate(); context: {rowItem: item}\"></ng-container>\n        </ng-template>\n    }\n    @if (footerTemplate()) {\n        <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n            <ng-container *ngTemplateOutlet=\"footerTemplate(); context: {data, totalCount}\"></ng-container>\n        </ng-template>\n    }\n</mng-table>\n" }]
         }], ctorParameters: () => [], propDecorators: { descriptor: [{
                 type: Input,
                 args: [{ required: true }]
@@ -3078,9 +3060,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
             }], columnActionCmpInstEventEmitter: [{
                 type: Output,
                 args: ['columnActionComponentInstance']
-            }], templates: [{
-                type: ContentChildren,
-                args: [TemplateDirective]
             }], components: [{
                 type: ViewChildren,
                 args: [ComponentDirective]
@@ -3124,10 +3103,10 @@ class DefaultDataProviderExecutor extends DataProviderExecutor {
     runDelete(ctx, fallback) {
         return fallback ? runFnFromDataProviderOrFallback(ctx, runDeleteFromDataProvider, fallback) : runDeleteFromDataProvider(ctx);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: DefaultDataProviderExecutor, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: DefaultDataProviderExecutor }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: DefaultDataProviderExecutor, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: DefaultDataProviderExecutor }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: DefaultDataProviderExecutor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: DefaultDataProviderExecutor, decorators: [{
             type: Injectable
         }] });
 
@@ -3169,10 +3148,10 @@ class FormlyFieldActionComponent extends FieldType {
             this.actionMessage = res.message;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldActionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FormlyFieldActionComponent, isStandalone: true, selector: "mng-formly-field-action", usesInheritance: true, ngImport: i0, template: "<div class=\"flex\">\n    <button\n        type=\"button\"\n        pButton\n        pRipple\n        [icon]=\"$any(descriptor.button.icon)\"\n        [label]=\"$any(descriptor.button.label === null ? null : descriptor.button.label ?? props!.label) | translate\"\n        [pTooltip]=\"$any(descriptor.button.tooltip) | translate\"\n        [disabled]=\"formControl.disabled\"\n        (click)=\"onClick()\"\n        [class]=\"buttonClass + (actionMessage ? ' mr-2' : '')\"></button>\n    @if (actionMessage) {\n        <p-message [text]=\"actionMessage.content\" [severity]=\"actionMessage.severity ?? 'success'\"></p-message>\n    }\n</div>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i8.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i5.UIMessage, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldActionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FormlyFieldActionComponent, isStandalone: true, selector: "mng-formly-field-action", usesInheritance: true, ngImport: i0, template: "<div class=\"flex\">\n    <button\n        type=\"button\"\n        pButton\n        pRipple\n        [icon]=\"$any(descriptor.button.icon)\"\n        [label]=\"$any(descriptor.button.label === null ? null : descriptor.button.label ?? props!.label) | translate\"\n        [pTooltip]=\"$any(descriptor.button.tooltip) | translate\"\n        [disabled]=\"formControl.disabled\"\n        (click)=\"onClick()\"\n        [class]=\"buttonClass + (actionMessage ? ' mr-2' : '')\"></button>\n    @if (actionMessage) {\n        <p-message [text]=\"actionMessage.content\" [severity]=\"actionMessage.severity ?? 'success'\"></p-message>\n    }\n</div>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i8.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i5.UIMessage, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldActionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldActionComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-action', imports: [ButtonModule, RippleModule, TranslateModule, TooltipModule, JsonPipe, MessageModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex\">\n    <button\n        type=\"button\"\n        pButton\n        pRipple\n        [icon]=\"$any(descriptor.button.icon)\"\n        [label]=\"$any(descriptor.button.label === null ? null : descriptor.button.label ?? props!.label) | translate\"\n        [pTooltip]=\"$any(descriptor.button.tooltip) | translate\"\n        [disabled]=\"formControl.disabled\"\n        (click)=\"onClick()\"\n        [class]=\"buttonClass + (actionMessage ? ' mr-2' : '')\"></button>\n    @if (actionMessage) {\n        <p-message [text]=\"actionMessage.content\" [severity]=\"actionMessage.severity ?? 'success'\"></p-message>\n    }\n</div>\n" }]
         }] });
@@ -3194,9 +3173,7 @@ class FormlyFieldAutocompleteComponent extends FieldType {
             this.descriptor.nextEvent(FormFieldEventTypeEnum.ValueChange, FormlyFieldAutocompleteComponent, this, {
                 value: v
             });
-            if (this.props['onValueChange']) {
-                this.props['onValueChange'](this.field, v);
-            }
+            this.props.onValueChange?.(this.field, v);
         });
         this.subscriptions.push(subscription);
     }
@@ -3213,10 +3190,10 @@ class FormlyFieldAutocompleteComponent extends FieldType {
             eventSubtype: FormFieldEventComponentSubtype.ON_DESTROY
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldAutocompleteComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: FormlyFieldAutocompleteComponent, isStandalone: true, selector: "mng-formly-field-autocomplete", usesInheritance: true, ngImport: i0, template: "<mng-autocomplete\n    [id]=\"$any(key)\"\n    [formControl]=\"aFormControl\"\n    [formlyAttributes]=\"field\"\n    [dataProvider]=\"descriptor.dataProvider\"\n    [optionsTrackProperty]=\"descriptor.optionsTrackProperty\"\n    [optionsLabelProperty]=\"descriptor.optionsLabelProperty\"\n    [optionsValueProperty]=\"descriptor.optionsValueProperty\"\n    [className]=\"descriptor.inputClassName\"\n    [showClear]=\"!props.required\"\n    [selectFirst]=\"descriptor.autocompleteSelectFirst ?? false\"\n    [autoClear]=\"descriptor.autocompleteAutoClear ?? false\"\n    [openOnFocus]=\"descriptor.autocompleteAutoClear ?? true\"\n    [inlineSearch]=\"descriptor.autocompleteInlineSearch ?? false\">\n</mng-autocomplete>\n", dependencies: [{ kind: "component", type: AutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "optionsTrackProperty", "optionsValueProperty", "optionsLabelProperty", "optionsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName", "showClear", "autoClear", "selectFirst", "searchTrim"], outputs: ["valueChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldAutocompleteComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: FormlyFieldAutocompleteComponent, isStandalone: true, selector: "mng-formly-field-autocomplete", usesInheritance: true, ngImport: i0, template: "<mng-autocomplete\n    [id]=\"$any(key)\"\n    [formControl]=\"aFormControl\"\n    [formlyAttributes]=\"field\"\n    [dataProvider]=\"descriptor.dataProvider\"\n    [optionsTrackProperty]=\"descriptor.optionsTrackProperty\"\n    [optionsLabelProperty]=\"descriptor.optionsLabelProperty\"\n    [optionsValueProperty]=\"descriptor.optionsValueProperty\"\n    [className]=\"descriptor.inputClassName\"\n    [showClear]=\"!props.required\"\n    [selectFirst]=\"descriptor.autocompleteSelectFirst ?? false\"\n    [autoClear]=\"descriptor.autocompleteAutoClear ?? false\"\n    [openOnFocus]=\"descriptor.autocompleteAutoClear ?? true\"\n    [inlineSearch]=\"descriptor.autocompleteInlineSearch ?? false\">\n</mng-autocomplete>\n", dependencies: [{ kind: "component", type: AutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "optionsTrackProperty", "optionsValueProperty", "optionsLabelProperty", "optionsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName", "showClear", "autoClear", "selectFirst", "searchTrim"], outputs: ["valueChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldAutocompleteComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldAutocompleteComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-autocomplete', imports: [AutocompleteComponent, ReactiveFormsModule, FormlyModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-autocomplete\n    [id]=\"$any(key)\"\n    [formControl]=\"aFormControl\"\n    [formlyAttributes]=\"field\"\n    [dataProvider]=\"descriptor.dataProvider\"\n    [optionsTrackProperty]=\"descriptor.optionsTrackProperty\"\n    [optionsLabelProperty]=\"descriptor.optionsLabelProperty\"\n    [optionsValueProperty]=\"descriptor.optionsValueProperty\"\n    [className]=\"descriptor.inputClassName\"\n    [showClear]=\"!props.required\"\n    [selectFirst]=\"descriptor.autocompleteSelectFirst ?? false\"\n    [autoClear]=\"descriptor.autocompleteAutoClear ?? false\"\n    [openOnFocus]=\"descriptor.autocompleteAutoClear ?? true\"\n    [inlineSearch]=\"descriptor.autocompleteInlineSearch ?? false\">\n</mng-autocomplete>\n" }]
         }] });
@@ -3242,10 +3219,10 @@ class FormlyFieldCustomComponent extends FieldType {
             ...this.descriptor.customComponentInputs
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldCustomComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: FormlyFieldCustomComponent, isStandalone: true, selector: "mng-formly-field-custom", usesInheritance: true, ngImport: i0, template: ` <ng-container [mngComponent]="descriptor.customComponentType!" [inputs]="inputs"></ng-container> `, isInline: true, dependencies: [{ kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "nodeInjector"], outputs: ["instanceCreated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldCustomComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: FormlyFieldCustomComponent, isStandalone: true, selector: "mng-formly-field-custom", usesInheritance: true, ngImport: i0, template: ` <ng-container [mngComponent]="descriptor.customComponentType!" [inputs]="inputs"></ng-container> `, isInline: true, dependencies: [{ kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "nodeInjector"], outputs: ["instanceCreated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldCustomComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldCustomComponent, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -3273,9 +3250,7 @@ class FormlyFieldDropdownComponent extends FieldType {
             this.descriptor.nextEvent(FormFieldEventTypeEnum.ValueChange, FormlyFieldDropdownComponent, this, {
                 value: v
             });
-            if (this.props['onValueChange']) {
-                this.props['onValueChange'](this.field, v);
-            }
+            this.props.onValueChange?.(this.field, v);
         });
         this.subscriptions.push(subscription);
     }
@@ -3287,10 +3262,10 @@ class FormlyFieldDropdownComponent extends FieldType {
             eventSubtype: FormFieldEventComponentSubtype.ON_DESTROY
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: FormlyFieldDropdownComponent, isStandalone: true, selector: "mng-formly-field-dropdown", usesInheritance: true, ngImport: i0, template: "<mng-dropdown\n    [id]=\"$any(key)\"\n    [formControl]=\"dFormControl\"\n    [formlyAttributes]=\"field\"\n    [placeholder]=\"descriptor.placeholder\"\n    [dataProvider]=\"descriptor.dataProvider\"\n    [optionsLabelProperty]=\"descriptor.optionsLabelProperty\"\n    [optionsLabelTranslate]=\"descriptor.optionsLabelTranslate\"\n    [optionsValueProperty]=\"descriptor.optionsValueProperty\"\n    [optionsDisabledProperty]=\"descriptor.optionsDisabledProperty\"\n    [optionsTrackProperty]=\"descriptor.optionsTrackProperty\"\n    [showClear]=\"!props.required\"\n    [className]=\"descriptor.inputClassName\">\n</mng-dropdown>\n", dependencies: [{ kind: "component", type: DropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "options", "optionsTrackProperty", "optionsLabelProperty", "optionsLabelTranslate", "optionsValueProperty", "optionsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: FormlyFieldDropdownComponent, isStandalone: true, selector: "mng-formly-field-dropdown", usesInheritance: true, ngImport: i0, template: "<mng-dropdown\n    [id]=\"$any(key)\"\n    [formControl]=\"dFormControl\"\n    [formlyAttributes]=\"field\"\n    [placeholder]=\"descriptor.placeholder\"\n    [dataProvider]=\"descriptor.dataProvider\"\n    [optionsLabelProperty]=\"descriptor.optionsLabelProperty\"\n    [optionsLabelTranslate]=\"descriptor.optionsLabelTranslate\"\n    [optionsValueProperty]=\"descriptor.optionsValueProperty\"\n    [optionsDisabledProperty]=\"descriptor.optionsDisabledProperty\"\n    [optionsTrackProperty]=\"descriptor.optionsTrackProperty\"\n    [showClear]=\"!props.required\"\n    [className]=\"descriptor.inputClassName\">\n</mng-dropdown>\n", dependencies: [{ kind: "component", type: DropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "options", "optionsTrackProperty", "optionsLabelProperty", "optionsLabelTranslate", "optionsValueProperty", "optionsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldDropdownComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldDropdownComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-dropdown', imports: [DropdownComponent, ReactiveFormsModule, FormlyModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-dropdown\n    [id]=\"$any(key)\"\n    [formControl]=\"dFormControl\"\n    [formlyAttributes]=\"field\"\n    [placeholder]=\"descriptor.placeholder\"\n    [dataProvider]=\"descriptor.dataProvider\"\n    [optionsLabelProperty]=\"descriptor.optionsLabelProperty\"\n    [optionsLabelTranslate]=\"descriptor.optionsLabelTranslate\"\n    [optionsValueProperty]=\"descriptor.optionsValueProperty\"\n    [optionsDisabledProperty]=\"descriptor.optionsDisabledProperty\"\n    [optionsTrackProperty]=\"descriptor.optionsTrackProperty\"\n    [showClear]=\"!props.required\"\n    [className]=\"descriptor.inputClassName\">\n</mng-dropdown>\n" }]
         }] });
@@ -3305,43 +3280,42 @@ class FormlyFieldFieldsetComponent extends FieldType {
         this.descriptor = this.props.descriptor;
         this.props.fieldComponent = this;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FormlyFieldFieldsetComponent, isStandalone: true, selector: "mng-formly-field-fieldset", usesInheritance: true, ngImport: i0, template: "@for (group of field.fieldGroup; track group) {\n    @switch (group?.props?.['descriptor']?.type) {\n        @case (typeFieldset) {\n            <p-fieldset [legend]=\"group.props?.label! | translate\">\n                <formly-field [field]=\"group\"></formly-field>\n            </p-fieldset>\n        }\n        @default {\n            <formly-field [field]=\"group\"></formly-field>\n        }\n    }\n}\n", dependencies: [{ kind: "ngmodule", type: FieldsetModule }, { kind: "component", type: i1$4.Fieldset, selector: "p-fieldset", inputs: ["legend", "toggleable", "collapsed", "style", "styleClass", "transitionOptions"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$2.FormlyField, selector: "formly-field", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FormlyFieldFieldsetComponent, isStandalone: true, selector: "mng-formly-field-fieldset", usesInheritance: true, ngImport: i0, template: "@for (group of field.fieldGroup; track group) {\n    @switch (group?.props?.['descriptor']?.type) {\n        @case (typeFieldset) {\n            <p-fieldset [legend]=\"group.props?.label! | translate\">\n                <formly-field [field]=\"group\"></formly-field>\n            </p-fieldset>\n        }\n        @default {\n            <formly-field [field]=\"group\"></formly-field>\n        }\n    }\n}\n", dependencies: [{ kind: "ngmodule", type: FieldsetModule }, { kind: "component", type: i1$4.Fieldset, selector: "p-fieldset", inputs: ["legend", "toggleable", "collapsed", "style", "styleClass", "transitionOptions"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$1.FormlyField, selector: "formly-field", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldFieldsetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldFieldsetComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-fieldset', imports: [FieldsetModule, FormlyModule, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (group of field.fieldGroup; track group) {\n    @switch (group?.props?.['descriptor']?.type) {\n        @case (typeFieldset) {\n            <p-fieldset [legend]=\"group.props?.label! | translate\">\n                <formly-field [field]=\"group\"></formly-field>\n            </p-fieldset>\n        }\n        @default {\n            <formly-field [field]=\"group\"></formly-field>\n        }\n    }\n}\n" }]
         }] });
 
 class FormlyFieldInputComponent extends FieldType {
-    constructor(applicationLocale, formBuilder, translateService) {
-        super();
-        this.applicationLocale = applicationLocale;
-        this.formBuilder = formBuilder;
-        this.translateService = translateService;
+    constructor() {
+        super(...arguments);
         this.NUMBER_MIN_SAFE = Number.MIN_SAFE_INTEGER;
         this.NUMBER_MAX_SAFE = Number.MAX_SAFE_INTEGER;
         this.DESC_INPUT_TYPE_IMAGE_FILE = FieldInputTypeEnum.ImageFile;
+        this.applicationLocale = inject(LOCALE_ID);
+        this.destroyRef = inject(DestroyRef);
+        this.formBuilder = inject(FormBuilder);
+        this.translateService = inject(TranslateService);
         this.numberFieldMode = 'decimal';
         this.files = [];
-        this.subscriptions = [];
+        this.imageFormArray = this.formBuilder.array([]);
     }
     ngOnInit() {
         this.iFormControl = this.formControl;
         this.descriptor = this.props.descriptor;
         this.props.fieldComponent = this;
         this.formEditorComponent = this.props.formEditorComponent;
-        this.imageFormArray = this.formBuilder.array([]);
         if (this.descriptor.fieldType === FieldInputTypeEnum.Currency) {
             this.numberFieldMode = 'currency';
             if (this.descriptor.currencyFromProperty) {
-                const currencyFromPropSubscription = this.iFormControl
+                this.iFormControl
                     .get(this.descriptor.currencyFromProperty)
-                    .valueChanges.pipe(startWith(this.model[this.descriptor.currencyFromProperty]), distinctUntilChanged())
+                    .valueChanges.pipe(takeUntilDestroyed(this.destroyRef), startWith(this.model[this.descriptor.currencyFromProperty]), distinctUntilChanged())
                     .subscribe(c => {
                     this.currency = c;
                 });
-                this.subscriptions.push(currencyFromPropSubscription);
             }
             else {
                 this.currency = this.descriptor.currency ?? 'EUR';
@@ -3351,21 +3325,12 @@ class FormlyFieldInputComponent extends FieldType {
         this.descriptor.nextEvent(FormFieldEventTypeEnum.ComponentLifecycle, FormlyFieldInputComponent, this, {
             eventSubtype: FormFieldEventComponentSubtype.ON_INIT
         });
-        // init values
-        if (this.props.type === 'datepicker' && typeof this.iFormControl.value === 'string') {
-            const dateObject = new Date(this.iFormControl.value);
-            this.iFormControl.setValue(dateObject);
-            this.iFormControl.markAsPristine();
-        }
-        const subscription = this.formControl.valueChanges.pipe(startWith(this.formControl.value), distinctUntilChanged()).subscribe(v => {
+        this.formControl.valueChanges.pipe(takeUntilDestroyed(this.destroyRef), startWith(this.formControl.value), distinctUntilChanged()).subscribe(v => {
             this.descriptor.nextEvent(FormFieldEventTypeEnum.ValueChange, FormlyFieldInputComponent, this, {
                 value: v
             });
-            if (this.props['onValueChange']) {
-                this.props['onValueChange'](this.field, v);
-            }
+            this.props.onValueChange?.(this.field, v);
         });
-        this.subscriptions.push(subscription);
         if (this.props.type === 'imageUrl') {
             const startValue = this.iFormControl.value;
             if (this.descriptor.fileMultiple) {
@@ -3387,17 +3352,15 @@ class FormlyFieldInputComponent extends FieldType {
                     this.addImageUrl();
                 }
             }
-            const subscription = this.imageFormArray.valueChanges.pipe(distinctUntilChanged()).subscribe(v => {
+            this.imageFormArray.valueChanges.pipe(takeUntilDestroyed(this.destroyRef), distinctUntilChanged()).subscribe(v => {
                 const fcv = v.filter((i) => !!i && typeof i === 'string' && i.length > 0);
                 this.iFormControl.setValue(fcv.length > 0 ? (this.descriptor.fileMultiple ? fcv : fcv[0]) : undefined);
                 this.iFormControl.updateValueAndValidity();
             });
-            this.subscriptions.push(subscription);
         }
     }
     ngOnDestroy() {
         // warning: formly calls on destroy before on init
-        this.subscriptions.forEach(s => s.unsubscribe());
         // emit lifecycle event
         this.descriptor?.nextEvent(FormFieldEventTypeEnum.ComponentLifecycle, FormlyFieldInputComponent, this, {
             eventSubtype: FormFieldEventComponentSubtype.ON_DESTROY
@@ -3435,7 +3398,7 @@ class FormlyFieldInputComponent extends FieldType {
     onImageUrlLoadError() {
         if (this.formEditorComponent) {
             const message = getFormEditorWarningMessage(this.translateService, 'general.error', 'mngEditor.imageLoadError');
-            this.formEditorComponent.formMessages = [...this.formEditorComponent.formMessages, message];
+            this.formEditorComponent.formMessages.set([...this.formEditorComponent.formMessages(), message]);
         }
     }
     updateFileFormControl() {
@@ -3470,10 +3433,10 @@ class FormlyFieldInputComponent extends FieldType {
                 return 'pi-file';
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldInputComponent, deps: [{ token: LOCALE_ID }, { token: i1$2.FormBuilder }, { token: i2$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FormlyFieldInputComponent, isStandalone: true, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "@switch (props.type) {\n    @case ('number') {\n        <p-inputNumber\n            [id]=\"$any(key)\"\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [min]=\"descriptor.numberAutoCorrect ? descriptor.numberMin ?? NUMBER_MIN_SAFE : undefined\"\n            [max]=\"descriptor.numberAutoCorrect ? descriptor.numberMax ?? NUMBER_MAX_SAFE : undefined\"\n            [step]=\"$any(descriptor.numberStep)\"\n            [useGrouping]=\"descriptor.numberUseGrouping\"\n            [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n            [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n            [inputStyleClass]=\"descriptor.inputClassName\"\n            [locale]=\"descriptor.locale ?? applicationLocale\"\n            [mode]=\"numberFieldMode\"\n            [currency]=\"currency\"\n            [currencyDisplay]=\"descriptor.currencyDisplay\">\n        </p-inputNumber>\n    }\n\n    @case ('switch') {\n        <div class=\"field flex flex-column\">\n            <label [for]=\"key\" [class]=\"descriptor.labelClassName\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n            @if (showError) {\n                <small class=\"p-error\">\n                    <formly-validation-message [field]=\"field\"></formly-validation-message>\n                </small>\n            }\n        </div>\n    }\n    @case ('radio') {\n        @for (option of descriptor.radioOptions; track option) {\n            <div [id]=\"$any(key)\" class=\"field-radiobutton\">\n                <p-radioButton\n                    [name]=\"$any(key)\"\n                    [value]=\"option.value\"\n                    [formControl]=\"iFormControl\"\n                    [formlyAttributes]=\"field\"\n                    [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n                <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n            </div>\n        }\n    }\n    @case ('textarea') {\n        <textarea [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [rows]=\"descriptor.rows ?? 3\" pInputTextarea [class]=\"descriptor.inputClassName\">\n        </textarea>\n    }\n    @case ('datepicker') {\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n            [minDate]=\"$any(descriptor.datePickerMin)\"\n            [maxDate]=\"$any(descriptor.datePickerMax)\"\n            [showTime]=\"descriptor.datePickerShowTime ?? false\"\n            [showSeconds]=\"descriptor.datePickerShowSeconds ?? false\"\n            [showIcon]=\"true\"\n            [inputStyleClass]=\"descriptor.inputClassName\"\n            [firstDayOfWeek]=\"1\">\n        </p-calendar>\n    }\n    @case ('mask') {\n        <p-inputMask\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [mask]=\"descriptor.mask\"\n            [placeholder]=\"descriptor.placeholder\"\n            [slotChar]=\"$any(descriptor.slotChar)\"\n            [styleClass]=\"descriptor.inputClassName\">\n        </p-inputMask>\n    }\n    @case ('file') {\n        <p-fileUpload\n            #fileUploadInput\n            [disabled]=\"iFormControl.disabled\"\n            [multiple]=\"descriptor.fileMultiple ?? false\"\n            [accept]=\"descriptor.fileAccept ?? (descriptor.fieldType === DESC_INPUT_TYPE_IMAGE_FILE ? 'image/*' : undefined)\"\n            [maxFileSize]=\"descriptor.fileMaxFileSize ?? 500000\"\n            [showUploadButton]=\"false\"\n            (onSelect)=\"onFileSelect($event)\"\n            (onRemove)=\"onFileRemove($event)\"\n            (onClear)=\"onFileClear($event)\">\n            <ng-template let-file let-idx=\"index\" pTemplate=\"file\">\n                <div class=\"p-fileupload-row\">\n                    <div>\n                        @if (fileUploadInput.isImage(file)) {\n                            @if (isFileImageSvg(file)) {\n                                <span class=\"flex align-items-center justify-content-center\">\n                                    <i class=\"pi pi-image text-2xl\"></i>\n                                </span>\n                            } @else {\n                                <img [src]=\"file.objectURL\" [width]=\"fileUploadInput.previewWidth\" (error)=\"fileUploadInput.imageError($event)\" />\n                            }\n                        } @else {\n                            <span class=\"flex align-items-center justify-content-center\">\n                                <i [class]=\"'pi ' + getFileDocumentTypeIcon(file) + ' text-2xl'\"></i>\n                            </span>\n                        }\n                    </div>\n                    <div class=\"p-fileupload-filename\">{{ file.name }}</div>\n                    <div>{{ fileUploadInput.formatSize(file.size) }}</div>\n                    <div>\n                        <button\n                            type=\"button\"\n                            pButton\n                            (click)=\"fileUploadInput.remove($event, idx)\"\n                            [disabled]=\"fileUploadInput.uploading\"\n                            class=\"p-button-icon-only\"\n                            [class]=\"fileUploadInput.removeStyleClass\">\n                            @if (!fileUploadInput.cancelIconTemplate) {\n                                <TimesIcon />\n                            }\n                        </button>\n                    </div>\n                </div>\n            </ng-template>\n            <ng-template pTemplate=\"content\" let-files>\n                @if (files.length === 0) {\n                    <div class=\"text-gray-300 dropdown-area\">\n                        <span><i class=\"pi pi-file-import mr-2\"></i>{{ 'fileUpload.dragAndDrop' | translate }}</span>\n                    </div>\n                }\n            </ng-template>\n        </p-fileUpload>\n    }\n    @case ('imageUrl') {\n        <div>\n            @if (descriptor.imagePreview) {\n                <div class=\"flex flex-wrap justify-content-start\">\n                    @for (image of imageFormArray.controls; track image; let idx = $index) {\n                        @if (imageFormArray.at(idx).valid && imageFormArray.at(idx).value) {\n                            <p-image [src]=\"imageFormArray.at(idx).value\" [preview]=\"true\" (onImageError)=\"onImageUrlLoadError()\" styleClass=\"mng-image m-2\"></p-image>\n                        } @else {\n                            <span class=\"mng-image m-2 p-image-preview-container no-image\">\n                                <div class=\"p-image-preview-indicator\">\n                                    <i class=\"p-image-preview-icon pi pi-ban\"></i>\n                                </div>\n                            </span>\n                        }\n                    }\n                </div>\n            }\n            @if (!descriptor.imagePreview || descriptor.imageUrlInputVisibleOnDisabled || !iFormControl.disabled) {\n                @for (imageCtrlName of imageFormArray.controls; track imageCtrlName; let idx = $index) {\n                    <div class=\"p-inputgroup mt-1\">\n                        <input\n                            pInputText\n                            [placeholder]=\"'mngEditor.imageUrlPlaceholder' | translate\"\n                            [id]=\"$any(key)\"\n                            type=\"text\"\n                            [formControl]=\"$any(imageFormArray.at(idx))\"\n                            [formlyAttributes]=\"field\" />\n                        @if (descriptor.fileMultiple && !iFormControl.disabled) {\n                            <button type=\"button\" pButton pRipple icon=\"pi pi-minus\" (click)=\"removeImageUrlAt(idx)\"></button>\n                        }\n                    </div>\n                }\n                @if (descriptor.fileMultiple && !iFormControl.disabled) {\n                    <button\n                        type=\"button\"\n                        pButton\n                        pRipple\n                        icon=\"pi pi-plus\"\n                        class=\"p-button-primary w-auto mt-1\"\n                        [label]=\"'mngEditor.imageUrlAdd' | translate\"\n                        (click)=\"addImageUrl()\"></button>\n                }\n            }\n        </div>\n    }\n    @default {\n        <input pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [mngInputTrim]=\"descriptor.trimOption\" />\n    }\n}\n", dependencies: [{ kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i3$1.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "directive", type: i2$4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: i2$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i6.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy"], outputs: ["onChange"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i7$1.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i8$1.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: InputMaskModule }, { kind: "component", type: i10$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i11.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError"] }, { kind: "ngmodule", type: ImageModule }, { kind: "component", type: i12.Image, selector: "p-image", inputs: ["imageClass", "imageStyle", "styleClass", "style", "src", "srcSet", "sizes", "previewImageSrc", "previewImageSrcSet", "previewImageSizes", "alt", "width", "height", "loading", "appendTo", "preview", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide", "onImageError"] }, { kind: "ngmodule", type: InputTextareaModule }, { kind: "directive", type: i13.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i14.InputText, selector: "[pInputText]" }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "component", type: TimesIcon, selector: "TimesIcon" }, { kind: "directive", type: InputTrimDirective, selector: "[mngInputTrim]", inputs: ["mngInputTrim"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FormlyFieldInputComponent, isStandalone: true, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "@switch (props.type) {\n    @case ('number') {\n        <p-inputNumber\n            [id]=\"$any(key)\"\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [min]=\"descriptor.numberAutoCorrect ? descriptor.numberMin ?? NUMBER_MIN_SAFE : undefined\"\n            [max]=\"descriptor.numberAutoCorrect ? descriptor.numberMax ?? NUMBER_MAX_SAFE : undefined\"\n            [step]=\"$any(descriptor.numberStep)\"\n            [useGrouping]=\"descriptor.numberUseGrouping\"\n            [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n            [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n            [inputStyleClass]=\"descriptor.inputClassName\"\n            [locale]=\"descriptor.locale ?? applicationLocale\"\n            [mode]=\"numberFieldMode\"\n            [currency]=\"currency\"\n            [currencyDisplay]=\"descriptor.currencyDisplay\">\n        </p-inputNumber>\n    }\n\n    @case ('switch') {\n        <div class=\"field flex flex-column\">\n            <label [for]=\"key\" [class]=\"descriptor.labelClassName\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n            @if (showError) {\n                <small class=\"p-error\">\n                    <formly-validation-message [field]=\"field\"></formly-validation-message>\n                </small>\n            }\n        </div>\n    }\n    @case ('radio') {\n        @for (option of descriptor.radioOptions; track option) {\n            <div [id]=\"key\" class=\"field-radiobutton\">\n                <p-radioButton\n                    [name]=\"$any(key)\"\n                    [value]=\"option.value\"\n                    [formControl]=\"iFormControl\"\n                    [formlyAttributes]=\"field\"\n                    [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n                <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n            </div>\n        }\n    }\n    @case ('textarea') {\n        <textarea [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [rows]=\"descriptor.rows ?? 3\" pInputTextarea [class]=\"descriptor.inputClassName\">\n        </textarea>\n    }\n    @case ('mask') {\n        <p-inputMask\n            [id]=\"$any(key)\"\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [mask]=\"descriptor.mask\"\n            [placeholder]=\"descriptor.placeholder\"\n            [slotChar]=\"$any(descriptor.slotChar)\"\n            [styleClass]=\"descriptor.inputClassName\">\n        </p-inputMask>\n    }\n    @case ('file') {\n        <p-fileUpload\n            #fileUploadInput\n            [id]=\"$any(key)\"\n            [disabled]=\"iFormControl.disabled\"\n            [multiple]=\"descriptor.fileMultiple ?? false\"\n            [accept]=\"descriptor.fileAccept ?? (descriptor.fieldType === DESC_INPUT_TYPE_IMAGE_FILE ? 'image/*' : undefined)\"\n            [maxFileSize]=\"descriptor.fileMaxFileSize ?? 500000\"\n            [showUploadButton]=\"false\"\n            (onSelect)=\"onFileSelect($event)\"\n            (onRemove)=\"onFileRemove($event)\"\n            (onClear)=\"onFileClear($event)\">\n            <ng-template let-file let-idx=\"index\" pTemplate=\"file\">\n                <div class=\"p-fileupload-row\">\n                    <div>\n                        @if (fileUploadInput.isImage(file)) {\n                            @if (isFileImageSvg(file)) {\n                                <span class=\"flex align-items-center justify-content-center\">\n                                    <i class=\"pi pi-image text-2xl\"></i>\n                                </span>\n                            } @else {\n                                <img [src]=\"file.objectURL\" [width]=\"fileUploadInput.previewWidth\" (error)=\"fileUploadInput.imageError($event)\" />\n                            }\n                        } @else {\n                            <span class=\"flex align-items-center justify-content-center\">\n                                <i [class]=\"'pi ' + getFileDocumentTypeIcon(file) + ' text-2xl'\"></i>\n                            </span>\n                        }\n                    </div>\n                    <div class=\"p-fileupload-filename\">{{ file.name }}</div>\n                    <div>{{ fileUploadInput.formatSize(file.size) }}</div>\n                    <div>\n                        <button\n                            type=\"button\"\n                            pButton\n                            (click)=\"fileUploadInput.remove($event, idx)\"\n                            [disabled]=\"fileUploadInput.uploading\"\n                            class=\"p-button-icon-only\"\n                            [class]=\"fileUploadInput.removeStyleClass\">\n                            @if (!fileUploadInput.cancelIconTemplate) {\n                                <TimesIcon />\n                            }\n                        </button>\n                    </div>\n                </div>\n            </ng-template>\n            <ng-template pTemplate=\"content\" let-files>\n                @if (files.length === 0) {\n                    <div class=\"text-gray-300 dropdown-area\">\n                        <span><i class=\"pi pi-file-import mr-2\"></i>{{ 'fileUpload.dragAndDrop' | translate }}</span>\n                    </div>\n                }\n            </ng-template>\n        </p-fileUpload>\n    }\n    @case ('imageUrl') {\n        <div>\n            @if (descriptor.imagePreview) {\n                <div class=\"flex flex-wrap justify-content-start\">\n                    @for (image of imageFormArray.controls; track image; let idx = $index) {\n                        @if (imageFormArray.at(idx).valid && imageFormArray.at(idx).value) {\n                            <p-image [src]=\"imageFormArray.at(idx).value\" [preview]=\"true\" (onImageError)=\"onImageUrlLoadError()\" styleClass=\"mng-image m-2\"></p-image>\n                        } @else {\n                            <span class=\"mng-image m-2 p-image-preview-container no-image\">\n                                <div class=\"p-image-preview-indicator\">\n                                    <i class=\"p-image-preview-icon pi pi-ban\"></i>\n                                </div>\n                            </span>\n                        }\n                    }\n                </div>\n            }\n            @if (!descriptor.imagePreview || descriptor.imageUrlInputVisibleOnDisabled || !iFormControl.disabled) {\n                @for (imageCtrlName of imageFormArray.controls; track imageCtrlName; let idx = $index) {\n                    <div class=\"p-inputgroup mt-1\">\n                        <input\n                            pInputText\n                            [placeholder]=\"'mngEditor.imageUrlPlaceholder' | translate\"\n                            [id]=\"$any(key)\"\n                            type=\"text\"\n                            [formControl]=\"$any(imageFormArray.at(idx))\"\n                            [formlyAttributes]=\"field\" />\n                        @if (descriptor.fileMultiple && !iFormControl.disabled) {\n                            <button type=\"button\" pButton pRipple icon=\"pi pi-minus\" (click)=\"removeImageUrlAt(idx)\"></button>\n                        }\n                    </div>\n                }\n                @if (descriptor.fileMultiple && !iFormControl.disabled) {\n                    <button\n                        type=\"button\"\n                        pButton\n                        pRipple\n                        icon=\"pi pi-plus\"\n                        class=\"p-button-primary w-auto mt-1\"\n                        [label]=\"'mngEditor.imageUrlAdd' | translate\"\n                        (click)=\"addImageUrl()\"></button>\n                }\n            }\n        </div>\n    }\n    @default {\n        <input pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [mngInputTrim]=\"descriptor.trimOption\" />\n    }\n}\n", dependencies: [{ kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i1$5.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: i2$1.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i6.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy"], outputs: ["onChange"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i7$1.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputMaskModule }, { kind: "component", type: i8$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i9$1.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError"] }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: ImageModule }, { kind: "component", type: i11.Image, selector: "p-image", inputs: ["imageClass", "imageStyle", "styleClass", "style", "src", "srcSet", "sizes", "previewImageSrc", "previewImageSrcSet", "previewImageSizes", "alt", "width", "height", "loading", "appendTo", "preview", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide", "onImageError"] }, { kind: "ngmodule", type: InputTextareaModule }, { kind: "directive", type: i12.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i13.InputText, selector: "[pInputText]" }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "component", type: TimesIcon, selector: "TimesIcon" }, { kind: "directive", type: InputTrimDirective, selector: "[mngInputTrim]", inputs: ["mngInputTrim"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldInputComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-input', imports: [
                         InputNumberModule,
@@ -3482,7 +3445,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
                         TranslateModule,
                         InputSwitchModule,
                         RadioButtonModule,
-                        CalendarModule,
                         InputMaskModule,
                         FileUploadModule,
                         ImageModule,
@@ -3491,11 +3453,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
                         RippleModule,
                         TimesIcon,
                         InputTrimDirective
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@switch (props.type) {\n    @case ('number') {\n        <p-inputNumber\n            [id]=\"$any(key)\"\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [min]=\"descriptor.numberAutoCorrect ? descriptor.numberMin ?? NUMBER_MIN_SAFE : undefined\"\n            [max]=\"descriptor.numberAutoCorrect ? descriptor.numberMax ?? NUMBER_MAX_SAFE : undefined\"\n            [step]=\"$any(descriptor.numberStep)\"\n            [useGrouping]=\"descriptor.numberUseGrouping\"\n            [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n            [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n            [inputStyleClass]=\"descriptor.inputClassName\"\n            [locale]=\"descriptor.locale ?? applicationLocale\"\n            [mode]=\"numberFieldMode\"\n            [currency]=\"currency\"\n            [currencyDisplay]=\"descriptor.currencyDisplay\">\n        </p-inputNumber>\n    }\n\n    @case ('switch') {\n        <div class=\"field flex flex-column\">\n            <label [for]=\"key\" [class]=\"descriptor.labelClassName\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n            @if (showError) {\n                <small class=\"p-error\">\n                    <formly-validation-message [field]=\"field\"></formly-validation-message>\n                </small>\n            }\n        </div>\n    }\n    @case ('radio') {\n        @for (option of descriptor.radioOptions; track option) {\n            <div [id]=\"$any(key)\" class=\"field-radiobutton\">\n                <p-radioButton\n                    [name]=\"$any(key)\"\n                    [value]=\"option.value\"\n                    [formControl]=\"iFormControl\"\n                    [formlyAttributes]=\"field\"\n                    [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n                <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n            </div>\n        }\n    }\n    @case ('textarea') {\n        <textarea [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [rows]=\"descriptor.rows ?? 3\" pInputTextarea [class]=\"descriptor.inputClassName\">\n        </textarea>\n    }\n    @case ('datepicker') {\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n            [minDate]=\"$any(descriptor.datePickerMin)\"\n            [maxDate]=\"$any(descriptor.datePickerMax)\"\n            [showTime]=\"descriptor.datePickerShowTime ?? false\"\n            [showSeconds]=\"descriptor.datePickerShowSeconds ?? false\"\n            [showIcon]=\"true\"\n            [inputStyleClass]=\"descriptor.inputClassName\"\n            [firstDayOfWeek]=\"1\">\n        </p-calendar>\n    }\n    @case ('mask') {\n        <p-inputMask\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [mask]=\"descriptor.mask\"\n            [placeholder]=\"descriptor.placeholder\"\n            [slotChar]=\"$any(descriptor.slotChar)\"\n            [styleClass]=\"descriptor.inputClassName\">\n        </p-inputMask>\n    }\n    @case ('file') {\n        <p-fileUpload\n            #fileUploadInput\n            [disabled]=\"iFormControl.disabled\"\n            [multiple]=\"descriptor.fileMultiple ?? false\"\n            [accept]=\"descriptor.fileAccept ?? (descriptor.fieldType === DESC_INPUT_TYPE_IMAGE_FILE ? 'image/*' : undefined)\"\n            [maxFileSize]=\"descriptor.fileMaxFileSize ?? 500000\"\n            [showUploadButton]=\"false\"\n            (onSelect)=\"onFileSelect($event)\"\n            (onRemove)=\"onFileRemove($event)\"\n            (onClear)=\"onFileClear($event)\">\n            <ng-template let-file let-idx=\"index\" pTemplate=\"file\">\n                <div class=\"p-fileupload-row\">\n                    <div>\n                        @if (fileUploadInput.isImage(file)) {\n                            @if (isFileImageSvg(file)) {\n                                <span class=\"flex align-items-center justify-content-center\">\n                                    <i class=\"pi pi-image text-2xl\"></i>\n                                </span>\n                            } @else {\n                                <img [src]=\"file.objectURL\" [width]=\"fileUploadInput.previewWidth\" (error)=\"fileUploadInput.imageError($event)\" />\n                            }\n                        } @else {\n                            <span class=\"flex align-items-center justify-content-center\">\n                                <i [class]=\"'pi ' + getFileDocumentTypeIcon(file) + ' text-2xl'\"></i>\n                            </span>\n                        }\n                    </div>\n                    <div class=\"p-fileupload-filename\">{{ file.name }}</div>\n                    <div>{{ fileUploadInput.formatSize(file.size) }}</div>\n                    <div>\n                        <button\n                            type=\"button\"\n                            pButton\n                            (click)=\"fileUploadInput.remove($event, idx)\"\n                            [disabled]=\"fileUploadInput.uploading\"\n                            class=\"p-button-icon-only\"\n                            [class]=\"fileUploadInput.removeStyleClass\">\n                            @if (!fileUploadInput.cancelIconTemplate) {\n                                <TimesIcon />\n                            }\n                        </button>\n                    </div>\n                </div>\n            </ng-template>\n            <ng-template pTemplate=\"content\" let-files>\n                @if (files.length === 0) {\n                    <div class=\"text-gray-300 dropdown-area\">\n                        <span><i class=\"pi pi-file-import mr-2\"></i>{{ 'fileUpload.dragAndDrop' | translate }}</span>\n                    </div>\n                }\n            </ng-template>\n        </p-fileUpload>\n    }\n    @case ('imageUrl') {\n        <div>\n            @if (descriptor.imagePreview) {\n                <div class=\"flex flex-wrap justify-content-start\">\n                    @for (image of imageFormArray.controls; track image; let idx = $index) {\n                        @if (imageFormArray.at(idx).valid && imageFormArray.at(idx).value) {\n                            <p-image [src]=\"imageFormArray.at(idx).value\" [preview]=\"true\" (onImageError)=\"onImageUrlLoadError()\" styleClass=\"mng-image m-2\"></p-image>\n                        } @else {\n                            <span class=\"mng-image m-2 p-image-preview-container no-image\">\n                                <div class=\"p-image-preview-indicator\">\n                                    <i class=\"p-image-preview-icon pi pi-ban\"></i>\n                                </div>\n                            </span>\n                        }\n                    }\n                </div>\n            }\n            @if (!descriptor.imagePreview || descriptor.imageUrlInputVisibleOnDisabled || !iFormControl.disabled) {\n                @for (imageCtrlName of imageFormArray.controls; track imageCtrlName; let idx = $index) {\n                    <div class=\"p-inputgroup mt-1\">\n                        <input\n                            pInputText\n                            [placeholder]=\"'mngEditor.imageUrlPlaceholder' | translate\"\n                            [id]=\"$any(key)\"\n                            type=\"text\"\n                            [formControl]=\"$any(imageFormArray.at(idx))\"\n                            [formlyAttributes]=\"field\" />\n                        @if (descriptor.fileMultiple && !iFormControl.disabled) {\n                            <button type=\"button\" pButton pRipple icon=\"pi pi-minus\" (click)=\"removeImageUrlAt(idx)\"></button>\n                        }\n                    </div>\n                }\n                @if (descriptor.fileMultiple && !iFormControl.disabled) {\n                    <button\n                        type=\"button\"\n                        pButton\n                        pRipple\n                        icon=\"pi pi-plus\"\n                        class=\"p-button-primary w-auto mt-1\"\n                        [label]=\"'mngEditor.imageUrlAdd' | translate\"\n                        (click)=\"addImageUrl()\"></button>\n                }\n            }\n        </div>\n    }\n    @default {\n        <input pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [mngInputTrim]=\"descriptor.trimOption\" />\n    }\n}\n" }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [LOCALE_ID]
-                }] }, { type: i1$2.FormBuilder }, { type: i2$1.TranslateService }] });
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@switch (props.type) {\n    @case ('number') {\n        <p-inputNumber\n            [id]=\"$any(key)\"\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [min]=\"descriptor.numberAutoCorrect ? descriptor.numberMin ?? NUMBER_MIN_SAFE : undefined\"\n            [max]=\"descriptor.numberAutoCorrect ? descriptor.numberMax ?? NUMBER_MAX_SAFE : undefined\"\n            [step]=\"$any(descriptor.numberStep)\"\n            [useGrouping]=\"descriptor.numberUseGrouping\"\n            [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n            [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n            [inputStyleClass]=\"descriptor.inputClassName\"\n            [locale]=\"descriptor.locale ?? applicationLocale\"\n            [mode]=\"numberFieldMode\"\n            [currency]=\"currency\"\n            [currencyDisplay]=\"descriptor.currencyDisplay\">\n        </p-inputNumber>\n    }\n\n    @case ('switch') {\n        <div class=\"field flex flex-column\">\n            <label [for]=\"key\" [class]=\"descriptor.labelClassName\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n            @if (showError) {\n                <small class=\"p-error\">\n                    <formly-validation-message [field]=\"field\"></formly-validation-message>\n                </small>\n            }\n        </div>\n    }\n    @case ('radio') {\n        @for (option of descriptor.radioOptions; track option) {\n            <div [id]=\"key\" class=\"field-radiobutton\">\n                <p-radioButton\n                    [name]=\"$any(key)\"\n                    [value]=\"option.value\"\n                    [formControl]=\"iFormControl\"\n                    [formlyAttributes]=\"field\"\n                    [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n                <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n            </div>\n        }\n    }\n    @case ('textarea') {\n        <textarea [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [rows]=\"descriptor.rows ?? 3\" pInputTextarea [class]=\"descriptor.inputClassName\">\n        </textarea>\n    }\n    @case ('mask') {\n        <p-inputMask\n            [id]=\"$any(key)\"\n            [formControl]=\"iFormControl\"\n            [formlyAttributes]=\"field\"\n            [mask]=\"descriptor.mask\"\n            [placeholder]=\"descriptor.placeholder\"\n            [slotChar]=\"$any(descriptor.slotChar)\"\n            [styleClass]=\"descriptor.inputClassName\">\n        </p-inputMask>\n    }\n    @case ('file') {\n        <p-fileUpload\n            #fileUploadInput\n            [id]=\"$any(key)\"\n            [disabled]=\"iFormControl.disabled\"\n            [multiple]=\"descriptor.fileMultiple ?? false\"\n            [accept]=\"descriptor.fileAccept ?? (descriptor.fieldType === DESC_INPUT_TYPE_IMAGE_FILE ? 'image/*' : undefined)\"\n            [maxFileSize]=\"descriptor.fileMaxFileSize ?? 500000\"\n            [showUploadButton]=\"false\"\n            (onSelect)=\"onFileSelect($event)\"\n            (onRemove)=\"onFileRemove($event)\"\n            (onClear)=\"onFileClear($event)\">\n            <ng-template let-file let-idx=\"index\" pTemplate=\"file\">\n                <div class=\"p-fileupload-row\">\n                    <div>\n                        @if (fileUploadInput.isImage(file)) {\n                            @if (isFileImageSvg(file)) {\n                                <span class=\"flex align-items-center justify-content-center\">\n                                    <i class=\"pi pi-image text-2xl\"></i>\n                                </span>\n                            } @else {\n                                <img [src]=\"file.objectURL\" [width]=\"fileUploadInput.previewWidth\" (error)=\"fileUploadInput.imageError($event)\" />\n                            }\n                        } @else {\n                            <span class=\"flex align-items-center justify-content-center\">\n                                <i [class]=\"'pi ' + getFileDocumentTypeIcon(file) + ' text-2xl'\"></i>\n                            </span>\n                        }\n                    </div>\n                    <div class=\"p-fileupload-filename\">{{ file.name }}</div>\n                    <div>{{ fileUploadInput.formatSize(file.size) }}</div>\n                    <div>\n                        <button\n                            type=\"button\"\n                            pButton\n                            (click)=\"fileUploadInput.remove($event, idx)\"\n                            [disabled]=\"fileUploadInput.uploading\"\n                            class=\"p-button-icon-only\"\n                            [class]=\"fileUploadInput.removeStyleClass\">\n                            @if (!fileUploadInput.cancelIconTemplate) {\n                                <TimesIcon />\n                            }\n                        </button>\n                    </div>\n                </div>\n            </ng-template>\n            <ng-template pTemplate=\"content\" let-files>\n                @if (files.length === 0) {\n                    <div class=\"text-gray-300 dropdown-area\">\n                        <span><i class=\"pi pi-file-import mr-2\"></i>{{ 'fileUpload.dragAndDrop' | translate }}</span>\n                    </div>\n                }\n            </ng-template>\n        </p-fileUpload>\n    }\n    @case ('imageUrl') {\n        <div>\n            @if (descriptor.imagePreview) {\n                <div class=\"flex flex-wrap justify-content-start\">\n                    @for (image of imageFormArray.controls; track image; let idx = $index) {\n                        @if (imageFormArray.at(idx).valid && imageFormArray.at(idx).value) {\n                            <p-image [src]=\"imageFormArray.at(idx).value\" [preview]=\"true\" (onImageError)=\"onImageUrlLoadError()\" styleClass=\"mng-image m-2\"></p-image>\n                        } @else {\n                            <span class=\"mng-image m-2 p-image-preview-container no-image\">\n                                <div class=\"p-image-preview-indicator\">\n                                    <i class=\"p-image-preview-icon pi pi-ban\"></i>\n                                </div>\n                            </span>\n                        }\n                    }\n                </div>\n            }\n            @if (!descriptor.imagePreview || descriptor.imageUrlInputVisibleOnDisabled || !iFormControl.disabled) {\n                @for (imageCtrlName of imageFormArray.controls; track imageCtrlName; let idx = $index) {\n                    <div class=\"p-inputgroup mt-1\">\n                        <input\n                            pInputText\n                            [placeholder]=\"'mngEditor.imageUrlPlaceholder' | translate\"\n                            [id]=\"$any(key)\"\n                            type=\"text\"\n                            [formControl]=\"$any(imageFormArray.at(idx))\"\n                            [formlyAttributes]=\"field\" />\n                        @if (descriptor.fileMultiple && !iFormControl.disabled) {\n                            <button type=\"button\" pButton pRipple icon=\"pi pi-minus\" (click)=\"removeImageUrlAt(idx)\"></button>\n                        }\n                    </div>\n                }\n                @if (descriptor.fileMultiple && !iFormControl.disabled) {\n                    <button\n                        type=\"button\"\n                        pButton\n                        pRipple\n                        icon=\"pi pi-plus\"\n                        class=\"p-button-primary w-auto mt-1\"\n                        [label]=\"'mngEditor.imageUrlAdd' | translate\"\n                        (click)=\"addImageUrl()\"></button>\n                }\n            }\n        </div>\n    }\n    @default {\n        <input pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [mngInputTrim]=\"descriptor.trimOption\" />\n    }\n}\n" }]
+        }] });
 
 class FormlyFieldLabelComponent extends FieldType {
     constructor() {
@@ -3507,10 +3466,10 @@ class FormlyFieldLabelComponent extends FieldType {
         this.props.fieldComponent = this;
         this.formControl?.patchValue(this.descriptor.label);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldLabelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: FormlyFieldLabelComponent, isStandalone: true, selector: "mng-formly-field-label", host: { properties: { "class": "this.className" } }, usesInheritance: true, ngImport: i0, template: "", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldLabelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: FormlyFieldLabelComponent, isStandalone: true, selector: "mng-formly-field-label", host: { properties: { "class": "this.className" } }, usesInheritance: true, ngImport: i0, template: "", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldLabelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldLabelComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-label', changeDetection: ChangeDetectionStrategy.OnPush, template: "" }]
         }], propDecorators: { className: [{
@@ -3563,9 +3522,7 @@ class FormlyFieldLookupDialogComponent extends FieldType {
             this.descriptor.nextEvent(FormFieldEventTypeEnum.ValueChange, FormlyFieldLookupDialogComponent, this, {
                 value: v
             });
-            if (this.props['onValueChange']) {
-                this.props['onValueChange'](this.field, v);
-            }
+            this.props.onValueChange?.(this.field, v);
         });
         this.subscriptions.push(subscription);
     }
@@ -3615,10 +3572,10 @@ class FormlyFieldLookupDialogComponent extends FieldType {
                         eventSubtype: 'LookupError',
                         queryResult: err
                     });
-                    const error = ErrorUtil.fromSubscribeError(err, 'FormlyFieldLookupDialogComponentError', {
+                    const error = fromSubscribeError(err, 'FormlyFieldLookupDialogComponentError', {
                         params: params
                     });
-                    this.logger.log(error, ErrorUtil.getErrorLogLevel(error));
+                    this.logger.log(error, getErrorLogLevel(error));
                 }
             });
         }
@@ -3684,10 +3641,10 @@ class FormlyFieldLookupDialogComponent extends FieldType {
             this.fieldLabelFormControl.setValue(value);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldLookupDialogComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FormlyFieldLookupDialogComponent, isStandalone: true, selector: "mng-formly-field-lookup-dialog", providers: [provideViewContainer(false)], viewQueries: [{ propertyName: "table", first: true, predicate: TableComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [class]=\"'p-inputgroup mng-dropdown-dialog' + descriptor.inputClassName\" [class.p-inputtext-sm]=\"descriptor.isSizeSmall\" [class.p-inputtext-lg]=\"descriptor.isSizeLarge\">\n    <input pInputText type=\"text\" [id]=\"$any(key)\" [readonly]=\"true\" [formlyAttributes]=\"field\" [formControl]=\"fieldLabelFormControl\" />\n    @if (!props.required && formControl.value && !formControl.disabled) {\n        <i class=\"mng-dropdown-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n    }\n    <button\n        pButton\n        pRipple\n        class=\"mng-dropdown-dialog-search-button\"\n        type=\"button\"\n        [label]=\"'general.search' | translate: {item: ''}\"\n        [disabled]=\"formControl.disabled\"\n        (click)=\"openSelectDialog()\"></button>\n</div>\n\n<p-dialog\n    [(visible)]=\"isDialogVisible\"\n    [draggable]=\"false\"\n    [header]=\"'general.search' | translate: {item: props.label!}\"\n    [modal]=\"true\"\n    appendTo=\"body\"\n    styleClass=\"p-fluid mng-dialog mng-formly-field-lookup-dialog\">\n    <ng-template pTemplate=\"content\" mngDialogKeydownHandler>\n        <mng-table\n            [descriptor]=\"descriptor.dialogTableDescriptor!\"\n            [dataProvider]=\"descriptor.dialogTableDataProvider\"\n            [result]=\"addItemsAsync\"\n            [selectionEnabled]=\"true\"\n            [selectionMode]=\"'single'\"\n            [loading]=\"dialogIsLoading$\"\n            [captionComponent]=\"config.table?.captionComponent\"\n            [columnCustomLastComponent]=\"config.table?.columnActionComponent\"\n            (selectionChange)=\"onSelectionChange($event)\"\n            (captionComponentInstance)=\"onCaptionCmpInst($event)\"\n            (columnCustomLastComponentInstance)=\"onColumnActionCmpInst($event)\">\n        </mng-table>\n        <p-messages [value]=\"dialogMessages\"></p-messages>\n    </ng-template>\n\n    <ng-template pTemplate=\"footer\">\n        <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n        <button\n            pButton\n            pRipple\n            type=\"button\"\n            [label]=\"'general.select' | translate\"\n            icon=\"pi pi-check\"\n            class=\"p-button-text\"\n            (click)=\"addItem()\"\n            [loading]=\"(dialogIsLoading$ | async) ?? false\"\n            loadingIcon=\"pi pi-spin pi-spinner\"\n            [disabled]=\"form.disabled\"></button>\n    </ng-template>\n</p-dialog>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: i2$4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i7$2.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: TableComponent, selector: "mng-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "columnLastMinWidth", "captionComponent", "columnCustomLastComponent", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnCustomLastComponentInstance"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: i3.Messages, selector: "p-messages", inputs: ["value", "closable", "style", "styleClass", "enableService", "key", "escape", "severity", "showTransitionOptions", "hideTransitionOptions"], outputs: ["valueChange", "onClose"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i14.InputText, selector: "[pInputText]" }, { kind: "directive", type: DialogKeydownHandlerDirective, selector: "[mngDialogKeydownHandler]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldLookupDialogComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FormlyFieldLookupDialogComponent, isStandalone: true, selector: "mng-formly-field-lookup-dialog", providers: [provideViewContainer(false)], viewQueries: [{ propertyName: "table", first: true, predicate: TableComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [class]=\"'p-inputgroup mng-dropdown-dialog' + descriptor.inputClassName\" [class.p-inputtext-sm]=\"descriptor.isSizeSmall\" [class.p-inputtext-lg]=\"descriptor.isSizeLarge\">\n    <input pInputText type=\"text\" [id]=\"$any(key)\" [readonly]=\"true\" [formlyAttributes]=\"field\" [formControl]=\"fieldLabelFormControl\" />\n    @if (!props.required && formControl.value && !formControl.disabled) {\n        <i class=\"mng-dropdown-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n    }\n    <button\n        pButton\n        pRipple\n        class=\"mng-dropdown-dialog-search-button\"\n        type=\"button\"\n        [label]=\"'general.search' | translate: {item: ''}\"\n        [disabled]=\"formControl.disabled\"\n        (click)=\"openSelectDialog()\"></button>\n</div>\n\n<p-dialog\n    [(visible)]=\"isDialogVisible\"\n    [draggable]=\"false\"\n    [header]=\"'general.search' | translate: {item: props.label!}\"\n    [modal]=\"true\"\n    appendTo=\"body\"\n    styleClass=\"p-fluid mng-dialog mng-formly-field-lookup-dialog\">\n    <ng-template pTemplate=\"content\" mngDialogKeydownHandler>\n        <mng-table\n            [descriptor]=\"descriptor.dialogTableDescriptor!\"\n            [dataProvider]=\"descriptor.dialogTableDataProvider\"\n            [result]=\"addItemsAsync\"\n            [selectionEnabled]=\"true\"\n            [selectionMode]=\"'single'\"\n            [loading]=\"dialogIsLoading$\"\n            [captionComponent]=\"config.table?.captionComponent\"\n            [columnCustomLastComponent]=\"config.table?.columnActionComponent\"\n            (selectionChange)=\"onSelectionChange($event)\"\n            (captionComponentInstance)=\"onCaptionCmpInst($event)\"\n            (columnCustomLastComponentInstance)=\"onColumnActionCmpInst($event)\">\n        </mng-table>\n        <p-messages [value]=\"dialogMessages\"></p-messages>\n    </ng-template>\n\n    <ng-template pTemplate=\"footer\">\n        <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n        <button\n            pButton\n            pRipple\n            type=\"button\"\n            [label]=\"'general.select' | translate\"\n            icon=\"pi pi-check\"\n            class=\"p-button-text\"\n            (click)=\"addItem()\"\n            [loading]=\"(dialogIsLoading$ | async) ?? false\"\n            loadingIcon=\"pi pi-spin pi-spinner\"\n            [disabled]=\"form.disabled\"></button>\n    </ng-template>\n</p-dialog>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i7$2.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: TableComponent, selector: "mng-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "columnLastMinWidth", "captionComponent", "columnCustomLastComponent", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnCustomLastComponentInstance"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: i3$1.Messages, selector: "p-messages", inputs: ["value", "closable", "style", "styleClass", "enableService", "key", "escape", "severity", "showTransitionOptions", "hideTransitionOptions"], outputs: ["valueChange", "onClose"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i13.InputText, selector: "[pInputText]" }, { kind: "directive", type: DialogKeydownHandlerDirective, selector: "[mngDialogKeydownHandler]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldLookupDialogComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldLookupDialogComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-lookup-dialog', imports: [
                         TranslateModule,
@@ -3861,14 +3818,12 @@ class FormlyFieldTableDialogFormComponent extends FieldType {
             eventSubtype: FormFieldEventComponentSubtype.ON_INIT
         });
         let subscription = this.formControl.valueChanges.pipe(startWith(this.formControl.value)).subscribe(v => {
-            this.itemsSubject.next(v);
+            this.itemsSubject.next(v ?? []);
             // emit lifecycle event
             this.descriptor.nextEvent(FormFieldEventTypeEnum.ValueChange, FormlyFieldTableDialogFormComponent, this, {
                 value: v
             });
-            if (this.props['onValueChange']) {
-                this.props['onValueChange'](this.field, v);
-            }
+            this.props.onValueChange?.(this.field, v);
         });
         this.subscriptions.push(subscription);
         this.isDisabledSubject.next(this.formControl.disabled);
@@ -3903,10 +3858,10 @@ class FormlyFieldTableDialogFormComponent extends FieldType {
         }
         return false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldTableDialogFormComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FormlyFieldTableDialogFormComponent, isStandalone: true, selector: "mng-formly-table-dialog-form-field", providers: [provideViewContainer(false)], usesInheritance: true, ngImport: i0, template: "<mng-action-table [descriptor]=\"descriptor.tableDescriptor\" [items]=\"items$\" [actions]=\"actions\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            @for (action of toolbarRightActions; track action) {\n                <mng-action [action]=\"action\"></mng-action>\n            }\n        </div>\n    </ng-template>\n</mng-action-table>\n", styles: [".submit-button{display:none!important;visibility:hidden}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "component", type: ActionTableComponent, selector: "mng-action-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "globalFilterFields", "actions", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldTableDialogFormComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FormlyFieldTableDialogFormComponent, isStandalone: true, selector: "mng-formly-table-dialog-form-field", providers: [provideViewContainer(false)], usesInheritance: true, ngImport: i0, template: "<mng-action-table [descriptor]=\"descriptor.tableDescriptor\" [items]=\"items$\" [actions]=\"actions\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            @for (action of toolbarRightActions; track action) {\n                <mng-action [action]=\"action\"></mng-action>\n            }\n        </div>\n    </ng-template>\n</mng-action-table>\n", styles: [".submit-button{display:none!important;visibility:hidden}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "component", type: ActionTableComponent, selector: "mng-action-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "globalFilterFields", "actions", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldTableDialogFormComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldTableDialogFormComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-table-dialog-form-field', imports: [TranslateModule, ActionComponent, ActionTableComponent, TemplateDirective], providers: [provideViewContainer(false)], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-action-table [descriptor]=\"descriptor.tableDescriptor\" [items]=\"items$\" [actions]=\"actions\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            @for (action of toolbarRightActions; track action) {\n                <mng-action [action]=\"action\"></mng-action>\n            }\n        </div>\n    </ng-template>\n</mng-action-table>\n", styles: [".submit-button{display:none!important;visibility:hidden}\n"] }]
         }], ctorParameters: () => [{ type: i0.Injector }] });
@@ -3920,7 +3875,6 @@ class FormlyFieldTableDialogMultiselectComponent extends FieldType {
         this.itemsAsync = this.itemsSubject.asObservable();
         this.addItemsSubject = new ReplaySubject(1);
         this.addItemsAsync = this.addItemsSubject.asObservable();
-        this.dialogUseDataProvider = false;
         this.dialogDataProviderService = null;
         this.dialogIsLoadingSubject = new ReplaySubject(1);
         this.isDialogVisible = false;
@@ -3936,8 +3890,7 @@ class FormlyFieldTableDialogMultiselectComponent extends FieldType {
         this.descriptor = this.props.descriptor;
         this.props.fieldComponent = this;
         this.dialogIsLoadingSubject.next(false);
-        if (this.descriptor.lookupTableDataProvider?.serviceType) {
-            this.dialogUseDataProvider = true;
+        if (this.descriptor.lookupTableDataProvider.serviceType) {
             this.dialogDataProviderService = this.injector.get(this.descriptor.lookupTableDataProvider.serviceType);
         }
         this.hasAddAction = this.descriptor.actions.some(a => a === FieldManyToManyEditorActionEnum.Add);
@@ -3956,9 +3909,7 @@ class FormlyFieldTableDialogMultiselectComponent extends FieldType {
             this.descriptor.nextEvent(FormFieldEventTypeEnum.ValueChange, FormlyFieldTableDialogMultiselectComponent, this, {
                 value: v ?? []
             });
-            if (this.props['onValueChange']) {
-                this.props['onValueChange'](this.field, v ?? []);
-            }
+            this.props.onValueChange?.(this.field, v);
         });
         this.subscriptions.push(this.searchDebounceSubject.pipe(debounceTime(200), distinctUntilChanged()).subscribe(query => {
             this.addTableComponent?.primeTable.filterGlobal(query, 'contains');
@@ -3983,7 +3934,7 @@ class FormlyFieldTableDialogMultiselectComponent extends FieldType {
     openAddDialog() {
         this.dialogSelectedAddItems = [];
         this.isDialogVisible = true;
-        if (!this.dialogAreItemsLoaded && this.dialogUseDataProvider) {
+        if (!this.dialogAreItemsLoaded) {
             // wrapped in request animation frame due to primeng bug: https://github.com/primefaces/primeng/issues/12980
             requestAnimationFrame(() => {
                 this.dialogIsLoadingSubject.next(true);
@@ -3998,8 +3949,8 @@ class FormlyFieldTableDialogMultiselectComponent extends FieldType {
                         }
                     });
                 }
-                if (this.descriptor.hasLookupExcludeValues) {
-                    const filterValues = this.formControl.value.map((i) => ObjectUtil.getPropertyByPath(i, this.descriptor.excludeValueProperty));
+                if (this.descriptor.hasLookupExcludeValues && this.descriptor.lookupTableDataProvider.isLazy) {
+                    const filterValues = this.formControl.value.map((i) => getObjectPropertyByPath(i, this.descriptor.excludeValueProperty));
                     params.filters = {
                         [this.descriptor.excludeFilterProperty]: {
                             matchMode: FilterMatchMode.NotIn,
@@ -4009,16 +3960,21 @@ class FormlyFieldTableDialogMultiselectComponent extends FieldType {
                 }
                 this.lookupDataProviderSubscription = toObservable(this.descriptor.lookupTableDataProvider?.getAll(params, this.dialogDataProviderService)).subscribe({
                     next: res => {
+                        if (this.descriptor.hasLookupExcludeValues && !this.descriptor.lookupTableDataProvider.isLazy && res && Array.isArray(res.data) && res.data.length > 0) {
+                            const filterValues = this.formControl.value.map((i) => getObjectPropertyByPath(i, this.descriptor.excludeValueProperty));
+                            res.data = res.data.filter(i => filterValues.indexOf(i[this.descriptor.excludeFilterProperty]) < 0);
+                            res.totalCount = res.data.length;
+                        }
                         this.addItemsSubject.next(res);
                         this.dialogAreItemsLoaded = true;
                         this.dialogIsLoadingSubject.next(false);
                     },
                     error: err => {
                         this.dialogIsLoadingSubject.next(false);
-                        const error = ErrorUtil.fromSubscribeError(err, 'FormlyFieldTableDialogMultiselectComponent', {
+                        const error = fromSubscribeError(err, 'FormlyFieldTableDialogMultiselectComponent', {
                             params: params
                         });
-                        this.logger.log(error, ErrorUtil.getErrorLogLevel(error));
+                        this.logger.log(error, getErrorLogLevel(error));
                     }
                 });
             });
@@ -4065,7 +4021,7 @@ class FormlyFieldTableDialogMultiselectComponent extends FieldType {
                 name: 'FormlyFieldTableDialogMultiselectComponentError'
             });
         }
-        value = value.filter((i) => ObjectUtil.getPropertyByPath(i, compareProperty) !== ObjectUtil.getPropertyByPath(item, compareProperty));
+        value = value.filter((i) => getObjectPropertyByPath(i, compareProperty) !== getObjectPropertyByPath(item, compareProperty));
         this.formControl.patchValue(value);
         this.formControl.markAsTouched();
         this.formControl.markAsDirty();
@@ -4075,22 +4031,22 @@ class FormlyFieldTableDialogMultiselectComponent extends FieldType {
         const query = event.target.value;
         this.searchDebounceSubject.next(query);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldTableDialogMultiselectComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FormlyFieldTableDialogMultiselectComponent, isStandalone: true, selector: "mng-formly-table-multiselect-add-field", providers: [provideViewContainer(false)], viewQueries: [{ propertyName: "addTableComponent", first: true, predicate: ["addTableComponent"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"itemsAsync\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header pt-0\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            @if (hasAddAction && !options.formState?.disabled) {\n                <button\n                    pButton\n                    pRipple\n                    type=\"button\"\n                    icon=\"pi pi-plus\"\n                    class=\"p-button-rounded mng-button-xs\"\n                    (click)=\"openAddDialog()\"\n                    [disabled]=\"formControl!.disabled\"></button>\n            }\n        </div>\n    </ng-template>\n    <ng-template mngTemplate=\"columnAction\" let-item=\"rowItem\">\n        @if (hasDeleteAction && !options.formState?.disabled) {\n            <button\n                pButton\n                pRipple\n                type=\"button\"\n                icon=\"pi pi-trash\"\n                class=\"p-button-rounded p-button-danger mng-button-xs\"\n                (click)=\"removeItem(item)\"\n                [disabled]=\"formControl!.disabled\"></button>\n        }\n    </ng-template>\n</mng-table>\n\n@if (hasAddAction) {\n    <p-dialog\n        [(visible)]=\"isDialogVisible\"\n        [draggable]=\"false\"\n        [header]=\"'general.addItem' | translate: {item: props.label! | translate}\"\n        [modal]=\"true\"\n        appendTo=\"body\"\n        styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n        <ng-template pTemplate=\"content\" class=\"table-container\" mngDialogKeydownHandler>\n            <div class=\"h-full flex flex-column\">\n                <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n                    <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n                        <mng-table\n                            #addTableComponent\n                            [descriptor]=\"descriptor.lookupTableDescriptor\"\n                            [globalFilterFields]=\"descriptor.searchFields\"\n                            [result]=\"addItemsAsync\"\n                            [selectionEnabled]=\"true\"\n                            [loading]=\"dialogIsLoading$\"\n                            (selectionChange)=\"onSelectionChange($event)\">\n                            @if (descriptor.searchEnabled) {\n                                <ng-template mngTemplate=\"caption\">\n                                    <div class=\"flex\">\n                                        <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n                                            <i class=\"pi pi-search\"></i>\n                                            <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n                                        </span>\n                                    </div>\n                                </ng-template>\n                            }\n                        </mng-table>\n                    </div>\n                </div>\n                <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n                    <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n                    <button\n                        pButton\n                        pRipple\n                        type=\"button\"\n                        [label]=\"'general.add' | translate\"\n                        icon=\"pi pi-check\"\n                        class=\"p-button-primary\"\n                        (click)=\"addItems()\"\n                        [loading]=\"(dialogIsLoading$ | async) ?? false\"\n                        loadingIcon=\"pi pi-spin pi-spinner\"\n                        [disabled]=\"form.disabled\"></button>\n                </div>\n            </div>\n        </ng-template>\n    </p-dialog>\n}\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: TableComponent, selector: "mng-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "columnLastMinWidth", "captionComponent", "columnCustomLastComponent", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnCustomLastComponentInstance"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i7$2.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: i2$4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i14.InputText, selector: "[pInputText]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: DialogKeydownHandlerDirective, selector: "[mngDialogKeydownHandler]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldTableDialogMultiselectComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FormlyFieldTableDialogMultiselectComponent, isStandalone: true, selector: "mng-formly-table-multiselect-add-field", providers: [provideViewContainer(false)], viewQueries: [{ propertyName: "addTableComponent", first: true, predicate: ["addTableComponent"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"itemsAsync\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header pt-0\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            @if (hasAddAction && !options.formState?.disabled) {\n                <button\n                    pButton\n                    pRipple\n                    type=\"button\"\n                    icon=\"pi pi-plus\"\n                    class=\"p-button-rounded mng-button-xs\"\n                    (click)=\"openAddDialog()\"\n                    [disabled]=\"formControl!.disabled\"></button>\n            }\n        </div>\n    </ng-template>\n    <ng-template mngTemplate=\"columnCustomLast\" let-item=\"rowItem\">\n        @if (hasDeleteAction && !options.formState?.disabled) {\n            <button\n                pButton\n                pRipple\n                type=\"button\"\n                icon=\"pi pi-trash\"\n                class=\"p-button-rounded p-button-danger mng-button-xs\"\n                (click)=\"removeItem(item)\"\n                [disabled]=\"formControl!.disabled\"></button>\n        }\n    </ng-template>\n</mng-table>\n\n@if (hasAddAction) {\n    <p-dialog\n        [(visible)]=\"isDialogVisible\"\n        [draggable]=\"false\"\n        [header]=\"'general.addItem' | translate: {item: props.label! | translate}\"\n        [modal]=\"true\"\n        appendTo=\"body\"\n        styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n        <ng-template pTemplate=\"content\" class=\"table-container\" mngDialogKeydownHandler>\n            <div class=\"h-full flex flex-column\">\n                <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n                    <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n                        <mng-table\n                            #addTableComponent\n                            [descriptor]=\"descriptor.lookupTableDescriptor\"\n                            [globalFilterFields]=\"descriptor.searchFields\"\n                            [result]=\"addItemsAsync\"\n                            [selectionEnabled]=\"true\"\n                            [loading]=\"dialogIsLoading$\"\n                            (selectionChange)=\"onSelectionChange($event)\">\n                            @if (descriptor.searchEnabled) {\n                                <ng-template mngTemplate=\"caption\">\n                                    <div class=\"flex\">\n                                        <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n                                            <i class=\"pi pi-search\"></i>\n                                            <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n                                        </span>\n                                    </div>\n                                </ng-template>\n                            }\n                        </mng-table>\n                    </div>\n                </div>\n                <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n                    <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n                    <button\n                        pButton\n                        pRipple\n                        type=\"button\"\n                        [label]=\"'general.add' | translate\"\n                        icon=\"pi pi-check\"\n                        class=\"p-button-primary\"\n                        (click)=\"addItems()\"\n                        [loading]=\"(dialogIsLoading$ | async) ?? false\"\n                        loadingIcon=\"pi pi-spin pi-spinner\"\n                        [disabled]=\"form.disabled\"></button>\n                </div>\n            </div>\n        </ng-template>\n    </p-dialog>\n}\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: TableComponent, selector: "mng-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "columnLastMinWidth", "captionComponent", "columnCustomLastComponent", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnCustomLastComponentInstance"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i7$2.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i13.InputText, selector: "[pInputText]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: DialogKeydownHandlerDirective, selector: "[mngDialogKeydownHandler]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldTableDialogMultiselectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldTableDialogMultiselectComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-formly-table-multiselect-add-field', imports: [TranslateModule, AsyncPipe, TableComponent, DialogModule, ButtonModule, RippleModule, TemplateDirective, InputTextModule, NgStyle, DialogKeydownHandlerDirective], providers: [provideViewContainer(false)], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"itemsAsync\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header pt-0\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            @if (hasAddAction && !options.formState?.disabled) {\n                <button\n                    pButton\n                    pRipple\n                    type=\"button\"\n                    icon=\"pi pi-plus\"\n                    class=\"p-button-rounded mng-button-xs\"\n                    (click)=\"openAddDialog()\"\n                    [disabled]=\"formControl!.disabled\"></button>\n            }\n        </div>\n    </ng-template>\n    <ng-template mngTemplate=\"columnAction\" let-item=\"rowItem\">\n        @if (hasDeleteAction && !options.formState?.disabled) {\n            <button\n                pButton\n                pRipple\n                type=\"button\"\n                icon=\"pi pi-trash\"\n                class=\"p-button-rounded p-button-danger mng-button-xs\"\n                (click)=\"removeItem(item)\"\n                [disabled]=\"formControl!.disabled\"></button>\n        }\n    </ng-template>\n</mng-table>\n\n@if (hasAddAction) {\n    <p-dialog\n        [(visible)]=\"isDialogVisible\"\n        [draggable]=\"false\"\n        [header]=\"'general.addItem' | translate: {item: props.label! | translate}\"\n        [modal]=\"true\"\n        appendTo=\"body\"\n        styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n        <ng-template pTemplate=\"content\" class=\"table-container\" mngDialogKeydownHandler>\n            <div class=\"h-full flex flex-column\">\n                <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n                    <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n                        <mng-table\n                            #addTableComponent\n                            [descriptor]=\"descriptor.lookupTableDescriptor\"\n                            [globalFilterFields]=\"descriptor.searchFields\"\n                            [result]=\"addItemsAsync\"\n                            [selectionEnabled]=\"true\"\n                            [loading]=\"dialogIsLoading$\"\n                            (selectionChange)=\"onSelectionChange($event)\">\n                            @if (descriptor.searchEnabled) {\n                                <ng-template mngTemplate=\"caption\">\n                                    <div class=\"flex\">\n                                        <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n                                            <i class=\"pi pi-search\"></i>\n                                            <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n                                        </span>\n                                    </div>\n                                </ng-template>\n                            }\n                        </mng-table>\n                    </div>\n                </div>\n                <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n                    <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n                    <button\n                        pButton\n                        pRipple\n                        type=\"button\"\n                        [label]=\"'general.add' | translate\"\n                        icon=\"pi pi-check\"\n                        class=\"p-button-primary\"\n                        (click)=\"addItems()\"\n                        [loading]=\"(dialogIsLoading$ | async) ?? false\"\n                        loadingIcon=\"pi pi-spin pi-spinner\"\n                        [disabled]=\"form.disabled\"></button>\n                </div>\n            </div>\n        </ng-template>\n    </p-dialog>\n}\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"] }]
+            args: [{ standalone: true, selector: 'mng-formly-table-multiselect-add-field', imports: [TranslateModule, AsyncPipe, TableComponent, DialogModule, ButtonModule, RippleModule, TemplateDirective, InputTextModule, NgStyle, DialogKeydownHandlerDirective], providers: [provideViewContainer(false)], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"itemsAsync\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header pt-0\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n            @if (hasAddAction && !options.formState?.disabled) {\n                <button\n                    pButton\n                    pRipple\n                    type=\"button\"\n                    icon=\"pi pi-plus\"\n                    class=\"p-button-rounded mng-button-xs\"\n                    (click)=\"openAddDialog()\"\n                    [disabled]=\"formControl!.disabled\"></button>\n            }\n        </div>\n    </ng-template>\n    <ng-template mngTemplate=\"columnCustomLast\" let-item=\"rowItem\">\n        @if (hasDeleteAction && !options.formState?.disabled) {\n            <button\n                pButton\n                pRipple\n                type=\"button\"\n                icon=\"pi pi-trash\"\n                class=\"p-button-rounded p-button-danger mng-button-xs\"\n                (click)=\"removeItem(item)\"\n                [disabled]=\"formControl!.disabled\"></button>\n        }\n    </ng-template>\n</mng-table>\n\n@if (hasAddAction) {\n    <p-dialog\n        [(visible)]=\"isDialogVisible\"\n        [draggable]=\"false\"\n        [header]=\"'general.addItem' | translate: {item: props.label! | translate}\"\n        [modal]=\"true\"\n        appendTo=\"body\"\n        styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n        <ng-template pTemplate=\"content\" class=\"table-container\" mngDialogKeydownHandler>\n            <div class=\"h-full flex flex-column\">\n                <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n                    <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n                        <mng-table\n                            #addTableComponent\n                            [descriptor]=\"descriptor.lookupTableDescriptor\"\n                            [globalFilterFields]=\"descriptor.searchFields\"\n                            [result]=\"addItemsAsync\"\n                            [selectionEnabled]=\"true\"\n                            [loading]=\"dialogIsLoading$\"\n                            (selectionChange)=\"onSelectionChange($event)\">\n                            @if (descriptor.searchEnabled) {\n                                <ng-template mngTemplate=\"caption\">\n                                    <div class=\"flex\">\n                                        <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n                                            <i class=\"pi pi-search\"></i>\n                                            <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n                                        </span>\n                                    </div>\n                                </ng-template>\n                            }\n                        </mng-table>\n                    </div>\n                </div>\n                <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n                    <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n                    <button\n                        pButton\n                        pRipple\n                        type=\"button\"\n                        [label]=\"'general.add' | translate\"\n                        icon=\"pi pi-check\"\n                        class=\"p-button-primary\"\n                        (click)=\"addItems()\"\n                        [loading]=\"(dialogIsLoading$ | async) ?? false\"\n                        loadingIcon=\"pi pi-spin pi-spinner\"\n                        [disabled]=\"form.disabled\"></button>\n                </div>\n            </div>\n        </ng-template>\n    </p-dialog>\n}\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"] }]
         }], ctorParameters: () => [{ type: i0.Injector }], propDecorators: { addTableComponent: [{
                 type: ViewChild,
                 args: ['addTableComponent']
             }] } });
 
 class FormlyFieldTabsComponent extends FieldType {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldTabsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FormlyFieldTabsComponent, isStandalone: true, selector: "mng-formly-field-tabs", usesInheritance: true, ngImport: i0, template: "<p-tabView [scrollable]=\"true\">\n    @for (tab of field.fieldGroup; track tab) {\n        <p-tabPanel [header]=\"tab.props?.label! | translate\" [headerStyleClass]=\"formControl!.valid ? 'p-tabview-title' : undefined\">\n            <ng-template pTemplate=\"header\">\n                <span class=\"p-tabview-title\" [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.props?.label!) + '_invalid']\">{{\n                    tab.props?.label! | translate\n                }}</span>\n            </ng-template>\n            <formly-field [field]=\"tab\"></formly-field>\n        </p-tabPanel>\n    }\n</p-tabView>\n", dependencies: [{ kind: "ngmodule", type: TabViewModule }, { kind: "component", type: i1$5.TabView, selector: "p-tabView", inputs: ["style", "styleClass", "controlClose", "scrollable", "activeIndex", "selectOnFocus", "nextButtonAriaLabel", "prevButtonAriaLabel", "autoHideButtons", "tabindex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i1$5.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "directive", type: i2$4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$2.FormlyField, selector: "formly-field", inputs: ["field"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldTabsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FormlyFieldTabsComponent, isStandalone: true, selector: "mng-formly-field-tabs", usesInheritance: true, ngImport: i0, template: "<p-tabView [scrollable]=\"true\">\n    @for (tab of field.fieldGroup; track tab) {\n        <p-tabPanel [header]=\"tab.props?.label! | translate\" [headerStyleClass]=\"formControl!.valid ? 'p-tabview-title' : undefined\">\n            <ng-template pTemplate=\"header\">\n                <span class=\"p-tabview-title\" [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.props?.label!) + '_invalid']\">{{\n                    tab.props?.label! | translate\n                }}</span>\n            </ng-template>\n            <formly-field [field]=\"tab\"></formly-field>\n        </p-tabPanel>\n    }\n</p-tabView>\n", dependencies: [{ kind: "ngmodule", type: TabViewModule }, { kind: "component", type: i1$6.TabView, selector: "p-tabView", inputs: ["style", "styleClass", "controlClose", "scrollable", "activeIndex", "selectOnFocus", "nextButtonAriaLabel", "prevButtonAriaLabel", "autoHideButtons", "tabindex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i1$6.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$1.FormlyField, selector: "formly-field", inputs: ["field"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldTabsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldTabsComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-tabs', imports: [TabViewModule, TranslateModule, FormlyModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-tabView [scrollable]=\"true\">\n    @for (tab of field.fieldGroup; track tab) {\n        <p-tabPanel [header]=\"tab.props?.label! | translate\" [headerStyleClass]=\"formControl!.valid ? 'p-tabview-title' : undefined\">\n            <ng-template pTemplate=\"header\">\n                <span class=\"p-tabview-title\" [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.props?.label!) + '_invalid']\">{{\n                    tab.props?.label! | translate\n                }}</span>\n            </ng-template>\n            <formly-field [field]=\"tab\"></formly-field>\n        </p-tabPanel>\n    }\n</p-tabView>\n" }]
         }] });
@@ -4114,10 +4070,10 @@ class FormlyFieldNoLabelWrapperComponent extends FieldWrapper {
         }
         return field;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldNoLabelWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FormlyFieldNoLabelWrapperComponent, isStandalone: true, selector: "mng-formly-field-no-label-wrapper", usesInheritance: true, ngImport: i0, template: "<div [class]=\"props['descriptor']?.['fieldClassName'] ?? 'field table'\">\n    <ng-container #fieldComponent></ng-container>\n    @if (props['descriptor']?.['helpText']) {\n        <small class=\"block\">{{ props['descriptor']?.['helpText'] | translate }}</small>\n    }\n    @if (showError && shouldShowError()) {\n        <small class=\"block p-error\">\n            <formly-validation-message [field]=\"sanitizeErrorsForGroups(field)\"></formly-validation-message>\n        </small>\n    }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldNoLabelWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FormlyFieldNoLabelWrapperComponent, isStandalone: true, selector: "mng-formly-field-no-label-wrapper", usesInheritance: true, ngImport: i0, template: "<div [class]=\"props['descriptor']?.['fieldClassName'] ?? 'field table'\">\n    <ng-container #fieldComponent></ng-container>\n    @if (props['descriptor']?.['helpText']) {\n        <small class=\"block\">{{ props['descriptor']?.['helpText'] | translate }}</small>\n    }\n    @if (showError && shouldShowError()) {\n        <small class=\"block p-error\">\n            <formly-validation-message [field]=\"sanitizeErrorsForGroups(field)\"></formly-validation-message>\n        </small>\n    }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$1.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldNoLabelWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldNoLabelWrapperComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-no-label-wrapper', imports: [FormlyModule, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"props['descriptor']?.['fieldClassName'] ?? 'field table'\">\n    <ng-container #fieldComponent></ng-container>\n    @if (props['descriptor']?.['helpText']) {\n        <small class=\"block\">{{ props['descriptor']?.['helpText'] | translate }}</small>\n    }\n    @if (showError && shouldShowError()) {\n        <small class=\"block p-error\">\n            <formly-validation-message [field]=\"sanitizeErrorsForGroups(field)\"></formly-validation-message>\n        </small>\n    }\n</div>\n" }]
         }] });
@@ -4138,14 +4094,104 @@ class FormlyFieldWrapperComponent extends FieldWrapper {
             this.props?.['descriptor']?.withHelpText('');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FormlyFieldWrapperComponent, isStandalone: true, selector: "mng-formly-field-wrapper", usesInheritance: true, ngImport: i0, template: "<div [class]=\"props['descriptor']?.['fieldClassName'] ?? 'field'\">\n    <div class=\"grid mt-0\">\n        @if (props.label) {\n            <label [for]=\"key\" class=\"col\" [class]=\"props['descriptor']?.['labelClassName'] ?? ''\"\n                >{{ props!.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n        }\n    </div>\n    <ng-container #fieldComponent></ng-container>\n    @if (props['descriptor']?.['helpText']) {\n        <small class=\"block\">{{ props['descriptor']?.['helpText'] | translate }}</small>\n    }\n    @if (showError) {\n        <small class=\"p-error block\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    }\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FormlyFieldWrapperComponent, isStandalone: true, selector: "mng-formly-field-wrapper", usesInheritance: true, ngImport: i0, template: "<div [class]=\"props['descriptor']?.['fieldClassName'] ?? 'field'\">\n    <div class=\"grid mt-0\">\n        @if (props.label) {\n            <label [for]=\"key\" class=\"col\" [class]=\"props['descriptor']?.['labelClassName'] ?? ''\"\n                >{{ props!.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n        }\n    </div>\n    <ng-container #fieldComponent></ng-container>\n    @if (props['descriptor']?.['helpText']) {\n        <small class=\"block\">{{ props['descriptor']?.['helpText'] | translate }}</small>\n    }\n    @if (showError) {\n        <small class=\"p-error block\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    }\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$1.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FormlyFieldWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldWrapperComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-formly-field-wrapper', imports: [TranslateModule, FormlyModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"props['descriptor']?.['fieldClassName'] ?? 'field'\">\n    <div class=\"grid mt-0\">\n        @if (props.label) {\n            <label [for]=\"key\" class=\"col\" [class]=\"props['descriptor']?.['labelClassName'] ?? ''\"\n                >{{ props!.label! | translate }}\n                @if (props.required && props['hideRequiredMarker'] !== true) {\n                    <span>*</span>\n                }\n            </label>\n        }\n    </div>\n    <ng-container #fieldComponent></ng-container>\n    @if (props['descriptor']?.['helpText']) {\n        <small class=\"block\">{{ props['descriptor']?.['helpText'] | translate }}</small>\n    }\n    @if (showError) {\n        <small class=\"p-error block\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    }\n</div>\n" }]
         }] });
 
+class FormlyFieldDatepickerComponent extends FieldType {
+    constructor() {
+        super(...arguments);
+        this.dpFormControl = new FormControl();
+        this.styleClass = signal('');
+        this.moduleConfig = inject(COMMONS_MODULE_CONFIG_IT, { optional: true });
+        this.destroyRef = inject(DestroyRef);
+        this.dateTimeInUtc = this.moduleConfig?.serialization?.dateTimeInUtc ?? false;
+        this.dateTimeWithTimezone = this.moduleConfig?.serialization?.dateTimeWithTimezone ?? true;
+        this.dateTimeWithMillis = this.moduleConfig?.serialization?.dateTimeWithMillis ?? true;
+    }
+    ngOnInit() {
+        this.descriptor = this.props.descriptor;
+        this.props.fieldComponent = this;
+        // emit lifecycle event
+        this.descriptor.nextEvent(FormFieldEventTypeEnum.ComponentLifecycle, FormlyFieldDatepickerComponent, this, {
+            eventSubtype: FormFieldEventComponentSubtype.ON_INIT
+        });
+        // init status changes
+        this.formControl.statusChanges.pipe(takeUntilDestroyed(this.destroyRef), startWith(this.formControl.status)).subscribe(status => {
+            if (status === 'INVALID') {
+                this.styleClass.set('ng-invalid');
+            }
+            else {
+                this.styleClass.set('ng-valid');
+            }
+            if (status === 'DISABLED' && this.dpFormControl.enabled) {
+                this.dpFormControl.disable({ emitEvent: false });
+            }
+            else if (status !== 'DISABLED' && this.dpFormControl.disabled) {
+                this.dpFormControl.enable({ emitEvent: false });
+            }
+        });
+        // init values from form to datepicker
+        if (typeof this.formControl?.value === 'string' || typeof this.formControl?.value === 'number') {
+            this.dpFormControl.setValue(new Date(this.formControl.value));
+            this.dpFormControl.markAsPristine(); // mark as pristine only on component initialization
+        }
+        this.formControl.valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef), filter$1(formValue => !this.areDateValuesEqual(formValue, this.dpFormControl.value)))
+            .subscribe(v => {
+            this.dpFormControl.setValue(new Date(v), { emitEvent: false }); // do not emit event, because it can trigger infinite loop
+        });
+        // listen for changes from datepicker to form
+        this.dpFormControl.valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef), filter$1(value => !this.areDateValuesEqual(value, this.formControl.value)))
+            .subscribe(v => {
+            v = this.convertDateValue(v);
+            this.formControl.setValue(v);
+            this.descriptor.nextEvent(FormFieldEventTypeEnum.ValueChange, FormlyFieldDatepickerComponent, this, {
+                value: v
+            });
+            this.props.onValueChange?.(this.field, v);
+        });
+    }
+    onBlur() {
+        this.formControl.markAsTouched();
+    }
+    convertDateValue(value) {
+        const convertDateType = this.descriptor.datePickerValueNoTime || !this.descriptor.datePickerShowTime ? 'date' : 'date-time';
+        const convertDateTimeOpts = {
+            utc: this.descriptor.datePickerValueUtc ?? this.dateTimeInUtc,
+            noMillis: !this.dateTimeWithMillis,
+            noTimezone: this.descriptor.datePickerValueNoTimezone ?? !this.dateTimeWithTimezone
+        };
+        if (!this.descriptor.datePickerValueAsDateObj) {
+            return dateToIsoString(value, convertDateType, convertDateTimeOpts);
+        }
+        return value;
+    }
+    areDateValuesEqual(val1, val2) {
+        const date1 = this.convertDateValue(val1);
+        const date2 = this.convertDateValue(val2);
+        return (date1 instanceof Date && date2 instanceof Date && date1.toISOString() === date2.toISOString()) || date1 === date2;
+    }
+    ngOnDestroy() {
+        // warning: formly calls on destroy before on init
+        // emit lifecycle event
+        this.descriptor?.nextEvent(FormFieldEventTypeEnum.ComponentLifecycle, FormlyFieldDatepickerComponent, this, {
+            eventSubtype: FormFieldEventComponentSubtype.ON_DESTROY
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldDatepickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: FormlyFieldDatepickerComponent, isStandalone: true, selector: "mng-formly-field-datepicker", usesInheritance: true, ngImport: i0, template: "<p-calendar\n    appendTo=\"body\"\n    [class]=\"styleClass()\"\n    [formControl]=\"dpFormControl\"\n    [formlyAttributes]=\"field\"\n    [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n    [minDate]=\"$any(descriptor.datePickerMin)\"\n    [maxDate]=\"$any(descriptor.datePickerMax)\"\n    [showTime]=\"descriptor.datePickerShowTime ?? false\"\n    [showSeconds]=\"descriptor.datePickerShowSeconds ?? false\"\n    [showIcon]=\"true\"\n    [inputStyleClass]=\"descriptor.inputClassName\"\n    [firstDayOfWeek]=\"1\"\n    (onBlur)=\"onBlur()\">\n</p-calendar>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i3$2.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FormlyFieldDatepickerComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'mng-formly-field-datepicker', imports: [ReactiveFormsModule, FormlyModule, CalendarModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-calendar\n    appendTo=\"body\"\n    [class]=\"styleClass()\"\n    [formControl]=\"dpFormControl\"\n    [formlyAttributes]=\"field\"\n    [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n    [minDate]=\"$any(descriptor.datePickerMin)\"\n    [maxDate]=\"$any(descriptor.datePickerMax)\"\n    [showTime]=\"descriptor.datePickerShowTime ?? false\"\n    [showSeconds]=\"descriptor.datePickerShowSeconds ?? false\"\n    [showIcon]=\"true\"\n    [inputStyleClass]=\"descriptor.inputClassName\"\n    [firstDayOfWeek]=\"1\"\n    (onBlur)=\"onBlur()\">\n</p-calendar>\n" }]
+        }] });
+
 const formlyWrappersConfig = [
     { name: 'field', component: FormlyFieldWrapperComponent },
     { name: 'field-no-label', component: FormlyFieldNoLabelWrapperComponent }
@@ -4218,12 +4264,13 @@ const formlyTypesConfig = [
     },
     {
         name: 'datepicker',
-        extends: 'input',
+        component: FormlyFieldDatepickerComponent,
         defaultOptions: {
             props: {
                 type: 'datepicker'
             }
-        }
+        },
+        wrappers: ['field']
     },
     {
         name: 'mask',
@@ -4426,86 +4473,60 @@ function commonsFormlyConfigProvider(translate, datePipe, config = {}) {
 class TableviewComponent {
     constructor() {
         this.viewContainer = inject(ViewContainer, { optional: true });
-        this.actions = [];
-        this.tableActions = [];
-        this.toolbarLeftActions = [];
-        this.toolbarRightActions = [];
-        this.hasItemSelectionAction = false;
-        this.selectedItems = [];
+        this.descriptor = input.required();
+        this.dataProvider = input();
+        this.actions = input([]);
+        this.toolbarLeftActions = computed(() => this.filterActionsByPositions(this.actions(), [ActionPositionEnum.ToolbarLeft]));
+        this.toolbarRightActions = computed(() => this.filterActionsByPositions(this.actions(), [ActionPositionEnum.ToolbarRight]).reverse());
+        this.tableActions = computed(() => this.filterActionsByPositions(this.actions(), [ActionPositionEnum.TableHeader, ActionPositionEnum.RowInline, ActionPositionEnum.RowClick]));
+        this.tableParams = signal(undefined);
+        this.hasItemSelectionAction = computed(() => [...this.toolbarLeftActions(), ...this.toolbarRightActions()].some(e => e.hasItemsSelection));
+        this.selectedItems = signal([]);
+        this.templates = contentChildren(TemplateDirective);
+        this.footerTemplate = computed(() => findTemplateByName([...this.templates()], 'footer'));
+        this.rowExpandTemplate = computed(() => findTemplateByName([...this.templates()], 'rowExpandContent'));
     }
     ngOnInit() {
         if (this.viewContainer) {
-            this.viewContainer.actions = this.actions;
+            this.viewContainer.actions = this.actions();
         }
-        if (this.viewContainer && this.dataProvider) {
-            this.viewContainer.dataProvider = this.dataProvider;
+        const dataProvider = this.dataProvider();
+        if (this.viewContainer && dataProvider) {
+            this.viewContainer.dataProvider = dataProvider;
         }
-        for (const action of this.actions.filter(value => value.positionTableviewCategories?.includes(TableviewActionDefaultCategories.READ) ?? true)) {
-            switch (action.position) {
-                case ActionPositionEnum.ToolbarLeft:
-                    this.toolbarLeftActions.push(action);
-                    break;
-                case ActionPositionEnum.ToolbarRight:
-                    this.toolbarRightActions.push(action);
-                    break;
-                case ActionPositionEnum.TableHeader:
-                case ActionPositionEnum.RowInline:
-                case ActionPositionEnum.RowClick:
-                    this.tableActions.push(action);
-                    break;
-            }
-        }
-        this.toolbarRightActions = this.toolbarRightActions.reverse();
-        this.hasItemSelectionAction = [...this.toolbarLeftActions, ...this.toolbarRightActions].some(e => e.hasItemsSelection);
-    }
-    ngAfterContentInit() {
-        this.templates.forEach(template => {
-            switch (template.getType()) {
-                case 'footer':
-                    this.footerTemplate = template.template;
-                    break;
-            }
-        });
     }
     onTableLoad(event) {
-        this.tableParams = event.params;
+        this.tableParams.set(event.params);
     }
     selectionChange(selectedItems) {
-        this.selectedItems = selectedItems;
+        this.selectedItems.set(selectedItems);
+    }
+    filterActionsByPositions(actions, actionPositions) {
+        return actions.filter(action => (action.positionTableviewCategories?.includes(TableviewActionDefaultCategories.READ) ?? true) && actionPositions.includes(action.position));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: TableviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: TableviewComponent, isStandalone: true, selector: "mng-tableview", inputs: { descriptor: "descriptor", dataProvider: "dataProvider", actions: "actions" }, providers: [provideViewContainer()], queries: [{ propertyName: "templates", predicate: TemplateDirective }], ngImport: i0, template: "<div class=\"mng-tableview\">\n    <div class=\"card\">\n        @if (toolbarLeftActions.length > 0 || toolbarRightActions.length > 0) {\n            <p-toolbar styleClass=\"mb-4\">\n                <ng-template pTemplate=\"left\">\n                    @for (action of toolbarLeftActions; track action) {\n                        <mng-action [action]=\"action\" [dataListParams]=\"tableParams\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems\"></mng-action>\n                    }\n                </ng-template>\n                <ng-template pTemplate=\"right\">\n                    @for (action of toolbarRightActions; track action) {\n                        <mng-action [action]=\"action\" [dataListParams]=\"tableParams\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems\"></mng-action>\n                    }\n                </ng-template>\n            </p-toolbar>\n        }\n\n        <mng-action-table\n            [descriptor]=\"descriptor.table\"\n            [dataProvider]=\"dataProvider\"\n            [useQueryParams]=\"true\"\n            [actions]=\"tableActions\"\n            [selectionEnabled]=\"hasItemSelectionAction\"\n            [selectionMode]=\"'multiple'\"\n            (tableLoad)=\"onTableLoad($event)\"\n            (selectionChange)=\"selectionChange($event)\">\n            <ng-template mngTemplate=\"caption\">\n                <div class=\"flex flex-column md:flex-row md:justify-content-between table-header\">\n                    <h5 class=\"p-0 m-0\">{{ descriptor.tableTitle ?? '' | translate }}</h5>\n                </div>\n            </ng-template>\n\n            @if (footerTemplate) {\n                <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n                    <ng-container *ngTemplateOutlet=\"footerTemplate; context: {data, totalCount}\"></ng-container>\n                </ng-template>\n            }\n        </mng-action-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i2$3.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i2$4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "component", type: ActionTableComponent, selector: "mng-action-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "globalFilterFields", "actions", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TableviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: TableviewComponent, isStandalone: true, selector: "mng-tableview", inputs: { descriptor: { classPropertyName: "descriptor", publicName: "descriptor", isSignal: true, isRequired: true, transformFunction: null }, dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideViewContainer()], queries: [{ propertyName: "templates", predicate: TemplateDirective, isSignal: true }], ngImport: i0, template: "<div class=\"mng-tableview\">\n    <div class=\"card\">\n        @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n            <p-toolbar styleClass=\"mb-4\">\n                <ng-template pTemplate=\"left\">\n                    @for (action of toolbarLeftActions(); track action) {\n                        <mng-action [action]=\"action\" [dataListParams]=\"tableParams()\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems()\"></mng-action>\n                    }\n                </ng-template>\n                <ng-template pTemplate=\"right\">\n                    @for (action of toolbarRightActions(); track action) {\n                        <mng-action [action]=\"action\" [dataListParams]=\"tableParams()\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems()\"></mng-action>\n                    }\n                </ng-template>\n            </p-toolbar>\n        }\n\n        <mng-action-table\n            [descriptor]=\"descriptor().table\"\n            [dataProvider]=\"dataProvider()\"\n            [useQueryParams]=\"true\"\n            [actions]=\"tableActions()\"\n            [selectionEnabled]=\"hasItemSelectionAction()\"\n            [selectionMode]=\"'multiple'\"\n            (tableLoad)=\"onTableLoad($event)\"\n            (selectionChange)=\"selectionChange($event)\">\n            <ng-template mngTemplate=\"caption\">\n                <div class=\"flex flex-column md:flex-row md:justify-content-between table-header\">\n                    <h5 class=\"p-0 m-0\">{{ descriptor().tableTitle ?? '' | translate }}</h5>\n                </div>\n            </ng-template>\n            @if (rowExpandTemplate()) {\n                <ng-template mngTemplate=\"rowExpandContent\" let-item=\"rowItem\">\n                    <ng-container *ngTemplateOutlet=\"rowExpandTemplate(); context: {rowItem: item}\"></ng-container>\n                </ng-template>\n            }\n\n            @if (footerTemplate()) {\n                <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n                    <ng-container *ngTemplateOutlet=\"footerTemplate(); context: {data, totalCount}\"></ng-container>\n                </ng-template>\n            }\n        </mng-action-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i2$2.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "component", type: ActionTableComponent, selector: "mng-action-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "globalFilterFields", "actions", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: TableviewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TableviewComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-tableview', imports: [ToolbarModule, SharedModule, TranslateModule, NgTemplateOutlet, ActionComponent, ActionTableComponent, TemplateDirective, RouterOutlet], providers: [provideViewContainer()], template: "<div class=\"mng-tableview\">\n    <div class=\"card\">\n        @if (toolbarLeftActions.length > 0 || toolbarRightActions.length > 0) {\n            <p-toolbar styleClass=\"mb-4\">\n                <ng-template pTemplate=\"left\">\n                    @for (action of toolbarLeftActions; track action) {\n                        <mng-action [action]=\"action\" [dataListParams]=\"tableParams\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems\"></mng-action>\n                    }\n                </ng-template>\n                <ng-template pTemplate=\"right\">\n                    @for (action of toolbarRightActions; track action) {\n                        <mng-action [action]=\"action\" [dataListParams]=\"tableParams\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems\"></mng-action>\n                    }\n                </ng-template>\n            </p-toolbar>\n        }\n\n        <mng-action-table\n            [descriptor]=\"descriptor.table\"\n            [dataProvider]=\"dataProvider\"\n            [useQueryParams]=\"true\"\n            [actions]=\"tableActions\"\n            [selectionEnabled]=\"hasItemSelectionAction\"\n            [selectionMode]=\"'multiple'\"\n            (tableLoad)=\"onTableLoad($event)\"\n            (selectionChange)=\"selectionChange($event)\">\n            <ng-template mngTemplate=\"caption\">\n                <div class=\"flex flex-column md:flex-row md:justify-content-between table-header\">\n                    <h5 class=\"p-0 m-0\">{{ descriptor.tableTitle ?? '' | translate }}</h5>\n                </div>\n            </ng-template>\n\n            @if (footerTemplate) {\n                <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n                    <ng-container *ngTemplateOutlet=\"footerTemplate; context: {data, totalCount}\"></ng-container>\n                </ng-template>\n            }\n        </mng-action-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n" }]
-        }], propDecorators: { descriptor: [{
-                type: Input,
-                args: [{ required: true }]
-            }], dataProvider: [{
-                type: Input
-            }], actions: [{
-                type: Input
-            }], templates: [{
-                type: ContentChildren,
-                args: [TemplateDirective]
-            }] } });
+            args: [{ standalone: true, selector: 'mng-tableview', imports: [ToolbarModule, SharedModule, TranslateModule, NgTemplateOutlet, ActionComponent, ActionTableComponent, TemplateDirective, RouterOutlet], providers: [provideViewContainer()], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mng-tableview\">\n    <div class=\"card\">\n        @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n            <p-toolbar styleClass=\"mb-4\">\n                <ng-template pTemplate=\"left\">\n                    @for (action of toolbarLeftActions(); track action) {\n                        <mng-action [action]=\"action\" [dataListParams]=\"tableParams()\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems()\"></mng-action>\n                    }\n                </ng-template>\n                <ng-template pTemplate=\"right\">\n                    @for (action of toolbarRightActions(); track action) {\n                        <mng-action [action]=\"action\" [dataListParams]=\"tableParams()\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems()\"></mng-action>\n                    }\n                </ng-template>\n            </p-toolbar>\n        }\n\n        <mng-action-table\n            [descriptor]=\"descriptor().table\"\n            [dataProvider]=\"dataProvider()\"\n            [useQueryParams]=\"true\"\n            [actions]=\"tableActions()\"\n            [selectionEnabled]=\"hasItemSelectionAction()\"\n            [selectionMode]=\"'multiple'\"\n            (tableLoad)=\"onTableLoad($event)\"\n            (selectionChange)=\"selectionChange($event)\">\n            <ng-template mngTemplate=\"caption\">\n                <div class=\"flex flex-column md:flex-row md:justify-content-between table-header\">\n                    <h5 class=\"p-0 m-0\">{{ descriptor().tableTitle ?? '' | translate }}</h5>\n                </div>\n            </ng-template>\n            @if (rowExpandTemplate()) {\n                <ng-template mngTemplate=\"rowExpandContent\" let-item=\"rowItem\">\n                    <ng-container *ngTemplateOutlet=\"rowExpandTemplate(); context: {rowItem: item}\"></ng-container>\n                </ng-template>\n            }\n\n            @if (footerTemplate()) {\n                <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n                    <ng-container *ngTemplateOutlet=\"footerTemplate(); context: {data, totalCount}\"></ng-container>\n                </ng-template>\n            }\n        </mng-action-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n" }]
+        }] });
 
 class TableviewRouteComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: TableviewRouteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: TableviewRouteComponent, isStandalone: true, selector: "mng-tableview-route", inputs: { tableview: "tableview" }, ngImport: i0, template: "<mng-tableview [descriptor]=\"tableview.descriptor\" [dataProvider]=\"tableview.dataProvider\" [actions]=\"tableview.actions\"> </mng-tableview>\n", dependencies: [{ kind: "component", type: TableviewComponent, selector: "mng-tableview", inputs: ["descriptor", "dataProvider", "actions"] }] }); }
+    constructor() {
+        this.tableview = input.required();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TableviewRouteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.4", type: TableviewRouteComponent, isStandalone: true, selector: "mng-tableview-route", inputs: { tableview: { classPropertyName: "tableview", publicName: "tableview", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<mng-tableview [descriptor]=\"tableview().descriptor\" [dataProvider]=\"tableview().dataProvider\" [actions]=\"tableview().actions\"> </mng-tableview>\n", dependencies: [{ kind: "component", type: TableviewComponent, selector: "mng-tableview", inputs: ["descriptor", "dataProvider", "actions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: TableviewRouteComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TableviewRouteComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-tableview-route', imports: [TableviewComponent], template: "<mng-tableview [descriptor]=\"tableview.descriptor\" [dataProvider]=\"tableview.dataProvider\" [actions]=\"tableview.actions\"> </mng-tableview>\n" }]
-        }], propDecorators: { tableview: [{
-                type: Input,
-                args: [{ required: true }]
-            }] } });
+            args: [{ standalone: true, selector: 'mng-tableview-route', imports: [TableviewComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-tableview [descriptor]=\"tableview().descriptor\" [dataProvider]=\"tableview().dataProvider\" [actions]=\"tableview().actions\"> </mng-tableview>\n" }]
+        }] });
 
-class TableviewRouteBuilderInternal extends RouteBuilder {
-    constructor(path, options) {
-        super({ path: path, component: options.component ?? TableviewRouteBuilder });
+class TableviewRouteBuilder extends RouteBuilder {
+    constructor(path, component, loadComponent) {
+        super({ path: path, component, loadComponent });
         this.path = path;
         this.isFromComponent = true;
         this.routeData = { breadcrumb: null };
@@ -4516,28 +4537,6 @@ class TableviewRouteBuilderInternal extends RouteBuilder {
         this.hasAdd = true;
         this.addPath = 'add';
         this.hasDelete = true;
-        if (!options.component) {
-            this.isFromComponent = false;
-            this.descriptor = options.descriptor;
-            this.dataProvider = options.dataProvider;
-            this.actions = options.actions;
-            this.hasDetails = false;
-            this.hasAdd = false;
-            this.hasEdit = false;
-            if (this.actions) {
-                for (const action of this.actions) {
-                    if (action instanceof ActionEditorDetailsDescriptorInst) {
-                        this.hasDetails = true;
-                    }
-                    else if (action instanceof ActionEditorAddDescriptorInst) {
-                        this.hasAdd = true;
-                    }
-                    else if (action instanceof ActionEditorEditDescriptorInst) {
-                        this.hasEdit = true;
-                    }
-                }
-            }
-        }
     }
     withReadOnly(permissions) {
         if (permissions) {
@@ -4643,12 +4642,11 @@ class TableviewRouteBuilderInternal extends RouteBuilder {
         // copy route data for children, reset breadcrumbs menu items and permission
         const childrenRouteData = {
             ...this.routeData,
-            breadcrumb: null,
-            menuItems: undefined,
-            permissions: undefined
+            breadcrumb: null
         };
+        const loadActionRoute = () => Promise.resolve().then(function () { return actionRoute_component; });
         // list route
-        const rootChildRouteBuilder = RouteBuilder.create('', ActionRouteComponent);
+        const rootChildRouteBuilder = createLazyRoute('', loadActionRoute);
         rootChildRouteBuilder.withData({ ...childrenRouteData });
         if (this.tableviewPermissions?.[TableviewActionDefaultCategories.READ]) {
             rootChildRouteBuilder.withPermissions(this.tableviewPermissions[TableviewActionDefaultCategories.READ]);
@@ -4656,7 +4654,7 @@ class TableviewRouteBuilderInternal extends RouteBuilder {
         this.addChildBuilder(rootChildRouteBuilder);
         // add route
         if (this.hasAdd) {
-            const routeBuilder = RouteBuilder.create(this.addPath, ActionRouteComponent);
+            const routeBuilder = createLazyRoute(this.addPath, loadActionRoute);
             routeBuilder.withData({ ...childrenRouteData });
             if (this.tableviewPermissions?.[TableviewActionDefaultCategories.ADD]) {
                 routeBuilder.withPermissions(this.tableviewPermissions[TableviewActionDefaultCategories.ADD]);
@@ -4665,7 +4663,7 @@ class TableviewRouteBuilderInternal extends RouteBuilder {
             routeBuilder.withCanDeactivate(unsavedChangesGuard);
         }
         if (this.hasDetails) {
-            const routeBuilder = RouteBuilder.create(this.detailsPath, ActionRouteComponent);
+            const routeBuilder = createLazyRoute(this.detailsPath, loadActionRoute);
             routeBuilder.withData({ ...childrenRouteData });
             if (this.tableviewPermissions?.[TableviewActionDefaultCategories.DETAILS]) {
                 routeBuilder.withPermissions(this.tableviewPermissions[TableviewActionDefaultCategories.DETAILS]);
@@ -4673,7 +4671,7 @@ class TableviewRouteBuilderInternal extends RouteBuilder {
             this.addChildBuilder(routeBuilder);
         }
         if (this.hasEdit) {
-            const routeBuilder = RouteBuilder.create(this.editPath, ActionRouteComponent);
+            const routeBuilder = createLazyRoute(this.editPath, loadActionRoute);
             routeBuilder.withData({ ...childrenRouteData });
             if (this.tableviewPermissions?.[TableviewActionDefaultCategories.EDIT]) {
                 routeBuilder.withPermissions(this.tableviewPermissions[TableviewActionDefaultCategories.EDIT]);
@@ -4691,13 +4689,11 @@ class TableviewRouteBuilderInternal extends RouteBuilder {
         return menuItemPermission;
     }
 }
-class TableviewRouteBuilder {
-    static fromComponent(path, component) {
-        return new TableviewRouteBuilderInternal(path, { component });
-    }
-    static from(path, descriptor, dataProvider, actions) {
-        return new TableviewRouteBuilderInternal(path, { descriptor, dataProvider, actions });
-    }
+function createTableviewRoute(path, component) {
+    return new TableviewRouteBuilder(path, component);
+}
+function createTableviewLazyRoute(path, loadComponent) {
+    return new TableviewRouteBuilder(path, undefined, loadComponent);
 }
 
 /**
@@ -4709,6 +4705,7 @@ function withTableview(config) {
     return {
         type: CommonsFeatureTypeEnum.Tableview,
         providers: [
+            DatePipe,
             NavigationService,
             {
                 provide: COMMONS_TABLEVIEW_FEATURE_CONFIG_IT,
@@ -4752,5 +4749,5 @@ function withTableview(config) {
  * Generated bundle index. Do not edit.
  */
 
-export { ACTION_EDITOR_COMPONENT_IT, ActionComponent, ActionContext, ActionEditorComponent, ActionErrorMapperService, ActionExecutorService, ActionInstance, ActionInstanceStateEnum, ActionRouteComponent, ActionTableComponent, COMMONS_TABLEVIEW_FEATURE_CONFIG_IT, ComponentActionExecutorService, DataLanguageDropdownComponent, DefaultActionErrorMapperService, DefaultDataProviderExecutor, EditorFormlyUtil, FormEditorComponent, FormlyFieldActionComponent, FormlyFieldAutocompleteComponent, FormlyFieldCustomComponent, FormlyFieldDropdownComponent, FormlyFieldFieldsetComponent, FormlyFieldInputComponent, FormlyFieldLabelComponent, FormlyFieldLookupDialogComponent, FormlyFieldNoLabelWrapperComponent, FormlyFieldTableDialogFormComponent, FormlyFieldTableDialogMultiselectComponent, FormlyFieldTabsComponent, FormlyFieldWrapperComponent, I18nUtils, NavigationService, RootActionExecutorService, TableviewComponent, TableviewRouteBuilder, TableviewRouteBuilderInternal, TableviewRouteComponent, ViewContainer, actionNotificationError, actionNotificationSuccess, calculateTableColumnActionWidth, commonsFormlyConfigProvider, formlyTypesConfig, formlyWrappersConfig, getActionButtonRoundedWidth, getEmailValidationMessage, getFormEditorInfoMessage, getFormEditorWarningMessage, getFormlyValidationMessages, getMaxDateValidationMessage, getMaxLengthValidationMessage, getMaxValidationMessage, getMinDateValidationMessage, getMinLengthValidationMessage, getMinValidationMessage, getRequiredValidationMessage, getTableCellPaddingX, getTextPatternValidationMessage, provideActionExecutor, provideViewContainer, unsavedChangesGuard, withTableview };
+export { ACTION_EDITOR_COMPONENT_IT, ActionComponent, ActionContext, ActionEditorComponent, ActionErrorMapperService, ActionExecutorService, ActionInstance, ActionInstanceStateEnum, ActionTableComponent, COMMONS_TABLEVIEW_FEATURE_CONFIG_IT, ComponentActionExecutorService, DataLanguageDropdownComponent, DefaultActionErrorMapperService, DefaultDataProviderExecutor, FormEditorComponent, FormlyFieldActionComponent, FormlyFieldAutocompleteComponent, FormlyFieldCustomComponent, FormlyFieldDropdownComponent, FormlyFieldFieldsetComponent, FormlyFieldInputComponent, FormlyFieldLabelComponent, FormlyFieldLookupDialogComponent, FormlyFieldNoLabelWrapperComponent, FormlyFieldTableDialogFormComponent, FormlyFieldTableDialogMultiselectComponent, FormlyFieldTabsComponent, FormlyFieldWrapperComponent, NavigationService, RootActionExecutorService, TableviewComponent, TableviewRouteBuilder, TableviewRouteComponent, ViewContainer, actionNotificationError, actionNotificationSuccess, addAsyncValidationsToFormlyField, addValidationsToFormlyField, calculateTableColumnActionWidth, commonsFormlyConfigProvider, createFormlyConfigFromDescriptor, createFormlyField, createFormlyFields, createFormlyGroupType, createFormlyLocalizationsTab, createFormlyTabType, createFormlyValidation, createTableviewLazyRoute, createTableviewRoute, formlyTypesConfig, formlyWrappersConfig, getActionButtonRoundedWidth, getEmailValidationMessage, getFormEditorInfoMessage, getFormEditorWarningMessage, getFormlyValidationMessages, getI18nActionEditorTitleAsync, getI18nActionParams, getI18nActionParamsAsync, getI18nActionTitleAsync, getI18nForAction, getI18nForActionAsync, getMaxDateValidationMessage, getMaxLengthValidationMessage, getMaxValidationMessage, getMinDateValidationMessage, getMinLengthValidationMessage, getMinValidationMessage, getRequiredValidationMessage, getTableCellPaddingX, getTextPatternValidationMessage, populateI18nActionParams, provideActionExecutor, provideViewContainer, unsavedChangesGuard, withTableview };
 //# sourceMappingURL=mediusinc-mng-commons-tableview.mjs.map