@mediusinc/mng-commons 0.9.6 → 0.9.7

package/fesm2015/mediusinc-mng-commons.mjs

@@ -9,14 +9,14 @@ import { Validators, FormGroup, FormArray, NG_VALUE_ACCESSOR, FormControl, React
 import * as i1 from '@angular/router';
 import { NavigationEnd, GuardsCheckEnd, RouterModule } from '@angular/router';
 import * as i3$2 from '@ngx-formly/core';
-import { FieldType, FieldWrapper, FORMLY_CONFIG, FormlyModule } from '@ngx-formly/core';
+import { FieldWrapper, FieldType, FORMLY_CONFIG, FormlyModule } from '@ngx-formly/core';
 import * as i1$1 from '@ngx-translate/core';
 import { TranslateService, TranslateModule } from '@ngx-translate/core';
 import * as i2 from 'primeng/api';
 import { FilterMatchMode, ConfirmationService, MessageService } from 'primeng/api';
-import * as i2$1 from 'primeng/autocomplete';
+import * as i3$4 from 'primeng/autocomplete';
 import { AutoComplete, AutoCompleteModule } from 'primeng/autocomplete';
-import * as i2$4 from 'primeng/breadcrumb';
+import * as i2$2 from 'primeng/breadcrumb';
 import { BreadcrumbModule } from 'primeng/breadcrumb';
 import * as i5$1 from 'primeng/button';
 import { ButtonModule } from 'primeng/button';
@@ -30,7 +30,7 @@ import { ConfirmDialogModule } from 'primeng/confirmdialog';
 import { ConfirmPopupModule } from 'primeng/confirmpopup';
 import * as i1$3 from 'primeng/dialog';
 import { DialogModule } from 'primeng/dialog';
-import * as i2$2 from 'primeng/dropdown';
+import * as i3$5 from 'primeng/dropdown';
 import { Dropdown, DropdownModule } from 'primeng/dropdown';
 import * as i3$1 from 'primeng/dynamicdialog';
 import { DynamicDialogModule, DialogService } from 'primeng/dynamicdialog';
@@ -42,7 +42,7 @@ import * as i6$1 from 'primeng/inputmask';
 import { InputMaskModule } from 'primeng/inputmask';
 import * as i1$2 from 'primeng/inputnumber';
 import { InputNumberModule } from 'primeng/inputnumber';
-import * as i2$3 from 'primeng/inputswitch';
+import * as i2$1 from 'primeng/inputswitch';
 import { InputSwitchModule } from 'primeng/inputswitch';
 import * as i11 from 'primeng/inputtext';
 import { InputTextModule } from 'primeng/inputtext';
@@ -50,19 +50,19 @@ import * as i10 from 'primeng/inputtextarea';
 import { InputTextareaModule } from 'primeng/inputtextarea';
 import * as i3$3 from 'primeng/messages';
 import { MessagesModule } from 'primeng/messages';
-import * as i3$4 from 'primeng/multiselect';
+import * as i4$2 from 'primeng/multiselect';
 import { MultiSelectModule } from 'primeng/multiselect';
 import { PaginatorModule } from 'primeng/paginator';
 import * as i6 from 'primeng/progressspinner';
 import { ProgressSpinnerModule } from 'primeng/progressspinner';
-import * as i4$3 from 'primeng/radiobutton';
+import * as i4$4 from 'primeng/radiobutton';
 import { RadioButtonModule } from 'primeng/radiobutton';
 import * as i8 from 'primeng/ripple';
 import { RippleModule } from 'primeng/ripple';
 import { SelectButtonModule } from 'primeng/selectbutton';
 import * as i8$1 from 'primeng/skeleton';
 import { SkeletonModule } from 'primeng/skeleton';
-import * as i4$4 from 'primeng/table';
+import * as i4$5 from 'primeng/table';
 import { Table, TableModule } from 'primeng/table';
 import * as i1$4 from 'primeng/tabview';
 import { TabViewModule } from 'primeng/tabview';
@@ -70,13 +70,13 @@ import { TagModule } from 'primeng/tag';
 import * as i6$2 from 'primeng/toast';
 import { ToastModule } from 'primeng/toast';
 import { ToggleButtonModule } from 'primeng/togglebutton';
-import * as i4$2 from 'primeng/toolbar';
+import * as i4$3 from 'primeng/toolbar';
 import { ToolbarModule } from 'primeng/toolbar';
 import * as i9 from 'primeng/tooltip';
 import { TooltipModule } from 'primeng/tooltip';
 import { isObservable, throwError, of, Subject, BehaviorSubject, ReplaySubject, distinctUntilChanged, combineLatest, tap, switchMap, mergeMap as mergeMap$1, from, Observable } from 'rxjs';
-import 'reflect-metadata';
 import { map, mergeMap, catchError, first, filter, finalize, startWith } from 'rxjs/operators';
+import 'reflect-metadata';
 import * as i4 from '@angular/platform-browser';
 import * as FileSaver from 'file-saver';
 import { trigger, state, style, transition, animate } from '@angular/animations';
@@ -2047,6 +2047,7 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
         this._required = false;
         this._disabled = false;
         this._validations = [];
+        this._asyncValidations = [];
         this._className = '';
         this._labelClassName = '';
         this._inputClassName = '';
@@ -2088,6 +2089,9 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
     get validations() {
         return this._validations;
     }
+    get asyncValidations() {
+        return this._asyncValidations;
+    }
     get requiredExpression() {
         return this._requiredExpression;
     }
@@ -2164,6 +2168,10 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
         this._validations.push(new FieldValidationDescriptor(name, validator, message));
         return this;
     }
+    withAsyncValidation(name, asyncValidator, message) {
+        this._asyncValidations.push(new FieldValidationDescriptor(name, asyncValidator, message));
+        return this;
+    }
     withClassName(className, labelClassName = '', inputClassName = '', fieldClassName) {
         this._className = className;
         this._labelClassName = labelClassName;
@@ -2196,6 +2204,7 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
         obj._getter = this._getter;
         obj._setter = this._setter;
         obj._validations = this._validations;
+        obj._asyncValidations = this._asyncValidations;
     }
 }
 class FieldInputDescriptor extends AFieldDescriptor {
@@ -3387,6 +3396,7 @@ class EditorFormlyUtil {
             field.defaultValue = descriptor.defaultValue;
         }
         EditorFormlyUtil.addValidationsToFormlyField(field, descriptor.validations);
+        EditorFormlyUtil.addAsyncValidationsToFormlyField(field, descriptor.asyncValidations);
         return field;
     }
     static addValidationsToFormlyField(config, validations) {
@@ -3415,6 +3425,33 @@ class EditorFormlyUtil {
             }
         }
     }
+    static addAsyncValidationsToFormlyField(config, asyncValidations) {
+        if (!config.asyncValidators) {
+            config.asyncValidators = {};
+        }
+        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.asyncValidation)) {
+                    config.asyncValidators.asyncValidation = [];
+                }
+                config.asyncValidators.asyncValidation.push(validation.name);
+            }
+        }
+    }
 }
 
 class EnumUtil {
@@ -6368,15 +6405,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImpor
                 args: ['submitButton']
             }] } });
 
+class MngFormlyFieldWrapperComponent extends FieldWrapper {
+}
+MngFormlyFieldWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+MngFormlyFieldWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyFieldWrapperComponent, selector: "mng-formly-field-wrapper", usesInheritance: true, ngImport: i0, template: "<div [class]=\"to?.['descriptor']?.['fieldClassName'] ?? 'field'\">\n    <label [for]=\"key\" [class]=\"to?.['descriptor']?.['labelClassName'] ?? ''\"\n        >{{ $any(to?.label) | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label\n    >\n    <ng-container #fieldComponent></ng-container>\n    <small *ngIf=\"to?.['descriptor']?.['helpText']\">{{ to?.['descriptor']?.['helpText'] | translate }}</small>\n    <small *ngIf=\"showError\" class=\"p-error\">\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\n    </small>\n</div>\n", components: [{ type: i3$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldWrapperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mng-formly-field-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"to?.['descriptor']?.['fieldClassName'] ?? 'field'\">\n    <label [for]=\"key\" [class]=\"to?.['descriptor']?.['labelClassName'] ?? ''\"\n        >{{ $any(to?.label) | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label\n    >\n    <ng-container #fieldComponent></ng-container>\n    <small *ngIf=\"to?.['descriptor']?.['helpText']\">{{ to?.['descriptor']?.['helpText'] | translate }}</small>\n    <small *ngIf=\"showError\" class=\"p-error\">\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\n    </small>\n</div>\n" }]
+        }] });
+
+class MngFormlyTableWrapperComponent extends FieldWrapper {
+}
+MngFormlyTableWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyTableWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+MngFormlyTableWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyTableWrapperComponent, selector: "mng-formly-table-wrapper", usesInheritance: true, ngImport: i0, template: "<div [class]=\"to?.['descriptor']?.['fieldClassName'] ?? 'field table'\">\n    <ng-container #fieldComponent></ng-container>\n    <small *ngIf=\"to?.['descriptor']?.['helpText']\">{{ to?.['descriptor']?.['helpText'] | translate }}</small>\n    <small *ngIf=\"showError\" class=\"p-error\">\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\n    </small>\n</div>\n", components: [{ type: i3$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyTableWrapperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mng-formly-table-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"to?.['descriptor']?.['fieldClassName'] ?? 'field table'\">\n    <ng-container #fieldComponent></ng-container>\n    <small *ngIf=\"to?.['descriptor']?.['helpText']\">{{ to?.['descriptor']?.['helpText'] | translate }}</small>\n    <small *ngIf=\"showError\" class=\"p-error\">\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\n    </small>\n</div>\n" }]
+        }] });
+
 const MNG_AUTOCOMPLETE_VALUE_ACCESSOR = {
     provide: NG_VALUE_ACCESSOR,
     useExisting: forwardRef(() => MngAutocompleteComponent),
     multi: true
 };
 class MngAutocompleteComponent {
-    constructor(injector, translate) {
+    constructor(injector, translate, formlyWrapper) {
         this.injector = injector;
         this.translate = translate;
+        this.formlyWrapper = formlyWrapper;
         this.itemsLabelTranslate = false;
         this.inlineSearch = false;
         this.openOnFocus = false;
@@ -6434,6 +6490,10 @@ class MngAutocompleteComponent {
             (_a = this.primeAutocomplete) === null || _a === void 0 ? void 0 : _a.show();
         }
     }
+    onBlur($event) {
+        var _a, _b;
+        (_b = (_a = this.formlyWrapper) === null || _a === void 0 ? void 0 : _a.formControl) === null || _b === void 0 ? void 0 : _b.markAsTouched();
+    }
     registerOnChange(fn) {
         this.onChangeFn = fn;
     }
@@ -6593,12 +6653,16 @@ class MngAutocompleteComponent {
         }
     }
 }
-MngAutocompleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngAutocompleteComponent, deps: [{ token: i0.Injector }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-MngAutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", inlineSearch: "inlineSearch", openOnFocus: "openOnFocus", multiselect: "multiselect", placeholder: "placeholder", className: "className", dropdownClassName: "dropdownClassName" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_AUTOCOMPLETE_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeAutocomplete", first: true, predicate: AutoComplete, descendants: true }], ngImport: i0, template: "<p-autoComplete\n    (onFocus)=\"onFocus($event)\"\n    [formControl]=\"autocompleteFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dropdown]=\"true\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [field]=\"$any(itemsLabelProperty)\"\n    [suggestions]=\"(suggestions$ | async) ?? []\"\n    [multiple]=\"multiselect\"\n    [showEmptyMessage]=\"true\"\n    [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    [minLength]=\"openOnFocus ? 0 : 1\"\n    (completeMethod)=\"onSearch($event)\"\n    (onSelect)=\"onSelect($event)\"\n    appendTo=\"body\"\n    dropdownMode=\"current\">\n</p-autoComplete>\n", components: [{ type: i2$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "virtualScroll", "itemSize", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "field", "scrollHeight", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "suggestions"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide"] }], directives: [{ type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe, "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngAutocompleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngAutocompleteComponent, deps: [{ token: i0.Injector }, { token: i1$1.TranslateService }, { token: MngFormlyFieldWrapperComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+MngAutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", inlineSearch: "inlineSearch", openOnFocus: "openOnFocus", multiselect: "multiselect", placeholder: "placeholder", className: "className", dropdownClassName: "dropdownClassName" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_AUTOCOMPLETE_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeAutocomplete", first: true, predicate: AutoComplete, descendants: true }], ngImport: i0, template: "<p-autoComplete\n    (onFocus)=\"onFocus($event)\"\n    [formControl]=\"autocompleteFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dropdown]=\"true\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [field]=\"$any(itemsLabelProperty)\"\n    [suggestions]=\"(suggestions$ | async) ?? []\"\n    [multiple]=\"multiselect\"\n    [showEmptyMessage]=\"true\"\n    [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    [minLength]=\"openOnFocus ? 0 : 1\"\n    (completeMethod)=\"onSearch($event)\"\n    (onSelect)=\"onSelect($event)\"\n    (onBlur)=\"onBlur($event)\"\n    appendTo=\"body\"\n    dropdownMode=\"current\">\n</p-autoComplete>\n", components: [{ type: i3$4.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "virtualScroll", "itemSize", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "field", "scrollHeight", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "suggestions"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide"] }], directives: [{ type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe, "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngAutocompleteComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-autocomplete', providers: [MNG_AUTOCOMPLETE_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-autoComplete\n    (onFocus)=\"onFocus($event)\"\n    [formControl]=\"autocompleteFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dropdown]=\"true\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [field]=\"$any(itemsLabelProperty)\"\n    [suggestions]=\"(suggestions$ | async) ?? []\"\n    [multiple]=\"multiselect\"\n    [showEmptyMessage]=\"true\"\n    [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    [minLength]=\"openOnFocus ? 0 : 1\"\n    (completeMethod)=\"onSearch($event)\"\n    (onSelect)=\"onSelect($event)\"\n    appendTo=\"body\"\n    dropdownMode=\"current\">\n</p-autoComplete>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1$1.TranslateService }]; }, propDecorators: { dataProvider: [{
+            args: [{ selector: 'mng-autocomplete', providers: [MNG_AUTOCOMPLETE_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-autoComplete\n    (onFocus)=\"onFocus($event)\"\n    [formControl]=\"autocompleteFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dropdown]=\"true\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [field]=\"$any(itemsLabelProperty)\"\n    [suggestions]=\"(suggestions$ | async) ?? []\"\n    [multiple]=\"multiselect\"\n    [showEmptyMessage]=\"true\"\n    [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    [minLength]=\"openOnFocus ? 0 : 1\"\n    (completeMethod)=\"onSearch($event)\"\n    (onSelect)=\"onSelect($event)\"\n    (onBlur)=\"onBlur($event)\"\n    appendTo=\"body\"\n    dropdownMode=\"current\">\n</p-autoComplete>\n" }]
+        }], ctorParameters: function () {
+        return [{ type: i0.Injector }, { type: i1$1.TranslateService }, { type: MngFormlyFieldWrapperComponent, decorators: [{
+                        type: Optional
+                    }] }];
+    }, propDecorators: { dataProvider: [{
                 type: Input
             }], dataKeyProperty: [{
                 type: Input
@@ -6636,9 +6700,10 @@ const MNG_DROPDOWN_VALUE_ACCESSOR = {
     multi: true
 };
 class MngDropdownComponent {
-    constructor(injector, translate) {
+    constructor(injector, translate, formlyWrapper) {
         this.injector = injector;
         this.translate = translate;
+        this.formlyWrapper = formlyWrapper;
         this.itemsLabelTranslate = false;
         this.multiselect = false;
         this.showClear = true;
@@ -6742,13 +6807,21 @@ class MngDropdownComponent {
     writeValue(obj) {
         this.dropdownFormControl.setValue(obj, { emitEvent: false });
     }
+    onBlur($event) {
+        var _a, _b;
+        (_b = (_a = this.formlyWrapper) === null || _a === void 0 ? void 0 : _a.formControl) === null || _b === void 0 ? void 0 : _b.markAsTouched();
+    }
 }
-MngDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngDropdownComponent, deps: [{ token: i0.Injector }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-MngDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngDropdownComponent, selector: "mng-dropdown", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsDisabledProperty: "itemsDisabledProperty", multiselect: "multiselect", placeholder: "placeholder", showClear: "showClear", selectFirstItem: "selectFirstItem", className: "className", dropdownClassName: "dropdownClassName" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_DROPDOWN_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeDropdown", first: true, predicate: Dropdown, descendants: true }], ngImport: i0, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [optionLabel]=\"$any(itemsLabelProperty)\"\n    [optionValue]=\"$any(itemsValueProperty)\"\n    [optionDisabled]=\"$any(itemsDisabledProperty)\"\n    [options]=\"$any(items$ | async)\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        display=\"chip\"\n        [formControl]=\"dropdownFormControl\"\n        [defaultLabel]=\"$any(placeholder)\"\n        [dataKey]=\"$any(dataKeyProperty)\"\n        [optionLabel]=\"$any(itemsLabelProperty)\"\n        [optionValue]=\"$any(itemsValueProperty)\"\n        [optionDisabled]=\"$any(itemsDisabledProperty)\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"$any(className)\"\n        [panelStyleClass]=\"$any(dropdownClassName)\"\n        [filter]=\"false\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n", components: [{ type: i2$2.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "virtualScroll", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear"] }, { type: i3$4.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "autoZIndex", "baseZIndex", "filterBy", "virtualScroll", "itemSize", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "scrollHeight", "defaultLabel", "placeholder", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onPanelShow", "onPanelHide"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngDropdownComponent, deps: [{ token: i0.Injector }, { token: i1$1.TranslateService }, { token: MngFormlyFieldWrapperComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+MngDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngDropdownComponent, selector: "mng-dropdown", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsDisabledProperty: "itemsDisabledProperty", multiselect: "multiselect", placeholder: "placeholder", showClear: "showClear", selectFirstItem: "selectFirstItem", className: "className", dropdownClassName: "dropdownClassName" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_DROPDOWN_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeDropdown", first: true, predicate: Dropdown, descendants: true }], ngImport: i0, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [optionLabel]=\"$any(itemsLabelProperty)\"\n    [optionValue]=\"$any(itemsValueProperty)\"\n    [optionDisabled]=\"$any(itemsDisabledProperty)\"\n    [options]=\"$any(items$ | async)\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    (onBlur)=\"onBlur($event)\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        display=\"chip\"\n        [formControl]=\"dropdownFormControl\"\n        [defaultLabel]=\"$any(placeholder)\"\n        [dataKey]=\"$any(dataKeyProperty)\"\n        [optionLabel]=\"$any(itemsLabelProperty)\"\n        [optionValue]=\"$any(itemsValueProperty)\"\n        [optionDisabled]=\"$any(itemsDisabledProperty)\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"$any(className)\"\n        [panelStyleClass]=\"$any(dropdownClassName)\"\n        [filter]=\"false\"\n        (onBlur)=\"onBlur($event)\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n", components: [{ type: i3$5.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "virtualScroll", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear"] }, { type: i4$2.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "autoZIndex", "baseZIndex", "filterBy", "virtualScroll", "itemSize", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "scrollHeight", "defaultLabel", "placeholder", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onPanelShow", "onPanelHide"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngDropdownComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-dropdown', providers: [MNG_DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [optionLabel]=\"$any(itemsLabelProperty)\"\n    [optionValue]=\"$any(itemsValueProperty)\"\n    [optionDisabled]=\"$any(itemsDisabledProperty)\"\n    [options]=\"$any(items$ | async)\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        display=\"chip\"\n        [formControl]=\"dropdownFormControl\"\n        [defaultLabel]=\"$any(placeholder)\"\n        [dataKey]=\"$any(dataKeyProperty)\"\n        [optionLabel]=\"$any(itemsLabelProperty)\"\n        [optionValue]=\"$any(itemsValueProperty)\"\n        [optionDisabled]=\"$any(itemsDisabledProperty)\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"$any(className)\"\n        [panelStyleClass]=\"$any(dropdownClassName)\"\n        [filter]=\"false\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1$1.TranslateService }]; }, propDecorators: { dataProvider: [{
+            args: [{ selector: 'mng-dropdown', providers: [MNG_DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"$any(placeholder)\"\n    [dataKey]=\"$any(dataKeyProperty)\"\n    [optionLabel]=\"$any(itemsLabelProperty)\"\n    [optionValue]=\"$any(itemsValueProperty)\"\n    [optionDisabled]=\"$any(itemsDisabledProperty)\"\n    [options]=\"$any(items$ | async)\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"$any(className)\"\n    [panelStyleClass]=\"$any(dropdownClassName)\"\n    (onBlur)=\"onBlur($event)\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        display=\"chip\"\n        [formControl]=\"dropdownFormControl\"\n        [defaultLabel]=\"$any(placeholder)\"\n        [dataKey]=\"$any(dataKeyProperty)\"\n        [optionLabel]=\"$any(itemsLabelProperty)\"\n        [optionValue]=\"$any(itemsValueProperty)\"\n        [optionDisabled]=\"$any(itemsDisabledProperty)\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"$any(className)\"\n        [panelStyleClass]=\"$any(dropdownClassName)\"\n        [filter]=\"false\"\n        (onBlur)=\"onBlur($event)\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n" }]
+        }], ctorParameters: function () {
+        return [{ type: i0.Injector }, { type: i1$1.TranslateService }, { type: MngFormlyFieldWrapperComponent, decorators: [{
+                        type: Optional
+                    }] }];
+    }, propDecorators: { dataProvider: [{
                 type: Input
             }], dataKeyProperty: [{
                 type: Input
@@ -6973,7 +7046,7 @@ class MngActionEditorComponent {
     }
 }
 MngActionEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngActionEditorComponent, deps: [{ token: i0.Injector }, { token: i1$1.TranslateService }, { token: MngActionExecutorService }, { token: MngCommonsService }, { token: MngNavigationService }, { token: i3$1.DynamicDialogRef, optional: true }, { token: i3$1.DynamicDialogConfig, optional: true }, { token: MngViewContainerComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MngActionEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngActionEditorComponent, selector: "mng-action-editor", inputs: { action: "action", itemId: "itemId", item: "item", actionData: "actionData", dataProvider: "dataProvider", viewContainerInit: ["viewContainer", "viewContainerInit"] }, outputs: { actionRunEventEmitter: "actionSubmit", actionCancelEventEmitter: "actionCancel" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "submitButtonElementRef", first: true, predicate: ["submitButton"], descendants: true }, { propertyName: "editorComponent", first: true, predicate: MngFormEditorComponent, descendants: true }], ngImport: i0, template: "<h5 *ngIf=\"!isDialog && title\">{{ title }}</h5>\n<div class=\"h-full flex flex-column\">\n    <div class=\"flex-grow-1\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n        <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n            <ng-template pTemplate=\"left\">\n                <mng-action *ngFor=\"let action of toolbarLeftActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n            </ng-template>\n            <ng-template pTemplate=\"right\">\n                <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n            </ng-template>\n        </p-toolbar>\n    </div>\n\n    <div class=\"flex-grow-1\">\n        <div class=\"text-center\" *ngIf=\"loading$ | async\">\n            <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n        </div>\n        <mng-form-editor *ngIf=\"action.editorDescriptor && (loading$ | async) === false\" [descriptor]=\"action.editorDescriptor\" [item]=\"item\" (formSubmit)=\"onSubmit($event)\">\n        </mng-form-editor>\n    </div>\n\n    <div class=\"flex flex-row justify-content-between\">\n        <div>\n            <mng-action *ngFor=\"let action of footerLeftActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n        </div>\n        <div>\n            <mng-action *ngFor=\"let action of footerRightActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n        </div>\n    </div>\n</div>\n", components: [{ type: i4$2.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass"] }, { type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer"], outputs: ["finish"] }, { type: i6.ProgressSpinner, selector: "p-progressSpinner", inputs: ["style", "styleClass", "strokeWidth", "fill", "animationDuration"] }, { type: MngFormEditorComponent, selector: "mng-form-editor", inputs: ["descriptor", "submitLoading", "item", "isSubmitButtonVisible", "isFormDisabled"], outputs: ["formSubmit"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngActionEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngActionEditorComponent, selector: "mng-action-editor", inputs: { action: "action", itemId: "itemId", item: "item", actionData: "actionData", dataProvider: "dataProvider", viewContainerInit: ["viewContainer", "viewContainerInit"] }, outputs: { actionRunEventEmitter: "actionSubmit", actionCancelEventEmitter: "actionCancel" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "submitButtonElementRef", first: true, predicate: ["submitButton"], descendants: true }, { propertyName: "editorComponent", first: true, predicate: MngFormEditorComponent, descendants: true }], ngImport: i0, template: "<h5 *ngIf=\"!isDialog && title\">{{ title }}</h5>\n<div class=\"h-full flex flex-column\">\n    <div class=\"flex-grow-1\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n        <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n            <ng-template pTemplate=\"left\">\n                <mng-action *ngFor=\"let action of toolbarLeftActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n            </ng-template>\n            <ng-template pTemplate=\"right\">\n                <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n            </ng-template>\n        </p-toolbar>\n    </div>\n\n    <div class=\"flex-grow-1\">\n        <div class=\"text-center\" *ngIf=\"loading$ | async\">\n            <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n        </div>\n        <mng-form-editor *ngIf=\"action.editorDescriptor && (loading$ | async) === false\" [descriptor]=\"action.editorDescriptor\" [item]=\"item\" (formSubmit)=\"onSubmit($event)\">\n        </mng-form-editor>\n    </div>\n\n    <div class=\"flex flex-row justify-content-between\">\n        <div>\n            <mng-action *ngFor=\"let action of footerLeftActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n        </div>\n        <div>\n            <mng-action *ngFor=\"let action of footerRightActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n        </div>\n    </div>\n</div>\n", components: [{ type: i4$3.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass"] }, { type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer"], outputs: ["finish"] }, { type: i6.ProgressSpinner, selector: "p-progressSpinner", inputs: ["style", "styleClass", "strokeWidth", "fill", "animationDuration"] }, { type: MngFormEditorComponent, selector: "mng-form-editor", inputs: ["descriptor", "submitLoading", "item", "isSubmitButtonVisible", "isFormDisabled"], outputs: ["formSubmit"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngActionEditorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mng-action-editor', changeDetection: ChangeDetectionStrategy.OnPush, template: "<h5 *ngIf=\"!isDialog && title\">{{ title }}</h5>\n<div class=\"h-full flex flex-column\">\n    <div class=\"flex-grow-1\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n        <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n            <ng-template pTemplate=\"left\">\n                <mng-action *ngFor=\"let action of toolbarLeftActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n            </ng-template>\n            <ng-template pTemplate=\"right\">\n                <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n            </ng-template>\n        </p-toolbar>\n    </div>\n\n    <div class=\"flex-grow-1\">\n        <div class=\"text-center\" *ngIf=\"loading$ | async\">\n            <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n        </div>\n        <mng-form-editor *ngIf=\"action.editorDescriptor && (loading$ | async) === false\" [descriptor]=\"action.editorDescriptor\" [item]=\"item\" (formSubmit)=\"onSubmit($event)\">\n        </mng-form-editor>\n    </div>\n\n    <div class=\"flex flex-row justify-content-between\">\n        <div>\n            <mng-action *ngFor=\"let action of footerLeftActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n        </div>\n        <div>\n            <mng-action *ngFor=\"let action of footerRightActions\" [action]=\"action\" [disabled]=\"submitLoading$\" [viewContainer]=\"viewContainer\"></mng-action>\n        </div>\n    </div>\n</div>\n" }]
@@ -7131,7 +7204,7 @@ class MngFormlyFieldInputComponent extends FieldType {
     }
 }
 MngFormlyFieldInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldInputComponent, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
-MngFormlyFieldInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyFieldInputComponent, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"to.type\">\n    <p-inputNumber\n        *ngSwitchCase=\"'number'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [min]=\"$any(descriptor.numberMin)\"\n        [max]=\"$any(descriptor.numberMax)\"\n        [step]=\"$any(descriptor.numberStep)\"\n        [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [locale]=\"$any(descriptor.locale ?? applicationLocale)\"\n        [mode]=\"$any(numberFieldMode)\"\n        [currency]=\"$any(currency)\"\n        [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n        <small *ngIf=\"showError\" class=\"p-error\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    </div>\n\n    <ng-container *ngSwitchCase=\"'radio'\">\n        <div *ngFor=\"let option of descriptor.radioOptions\" [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    </ng-container>\n\n    <textarea\n        *ngSwitchCase=\"'textarea'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [rows]=\"descriptor.rows ?? 3\"\n        pInputTextarea\n        [class]=\"descriptor.inputClassName\">\n    </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\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\"\n        [showSeconds]=\"descriptor.datePickerShowSeconds\"\n        [showIcon]=\"true\"\n        [inputStyleClass]=\"descriptor.inputClassName\">\n    </p-calendar>\n\n    <p-inputMask\n        *ngSwitchCase=\"'mask'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [mask]=\"$any(descriptor.mask)\"\n        [placeholder]=\"$any(descriptor.placeholder)\"\n        [slotChar]=\"$any(descriptor.slotChar)\"\n        [styleClass]=\"descriptor.inputClassName\">\n    </p-inputMask>\n\n    <p-fileUpload\n        *ngSwitchCase=\"'file'\"\n        [multiple]=\"descriptor.fileMultiple\"\n        [accept]=\"$any(descriptor.fileAccept)\"\n        [maxFileSize]=\"descriptor.fileMaxFileSize\"\n        [showUploadButton]=\"false\"\n        (onSelect)=\"onFileSelect($event)\"\n        (onRemove)=\"onFileRemove($event)\"\n        (onClear)=\"onFileClear($event)\">\n    </p-fileUpload>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", components: [{ type: i1$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "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", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown"] }, { type: i2$3.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabelledBy"], outputs: ["onChange"] }, { type: i3$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { type: i4$3.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { type: i5$2.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { type: i6$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown"] }, { type: i7.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", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler"] }], directives: [{ type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i11.InputText, selector: "[pInputText]" }], pipes: { "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngFormlyFieldInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyFieldInputComponent, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"to.type\">\n    <p-inputNumber\n        *ngSwitchCase=\"'number'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [min]=\"$any(descriptor.numberMin)\"\n        [max]=\"$any(descriptor.numberMax)\"\n        [step]=\"$any(descriptor.numberStep)\"\n        [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [locale]=\"$any(descriptor.locale ?? applicationLocale)\"\n        [mode]=\"$any(numberFieldMode)\"\n        [currency]=\"$any(currency)\"\n        [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n        <small *ngIf=\"showError\" class=\"p-error\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    </div>\n\n    <ng-container *ngSwitchCase=\"'radio'\">\n        <div *ngFor=\"let option of descriptor.radioOptions\" [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    </ng-container>\n\n    <textarea\n        *ngSwitchCase=\"'textarea'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [rows]=\"descriptor.rows ?? 3\"\n        pInputTextarea\n        [class]=\"descriptor.inputClassName\">\n    </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\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\"\n        [showSeconds]=\"descriptor.datePickerShowSeconds\"\n        [showIcon]=\"true\"\n        [inputStyleClass]=\"descriptor.inputClassName\">\n    </p-calendar>\n\n    <p-inputMask\n        *ngSwitchCase=\"'mask'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [mask]=\"$any(descriptor.mask)\"\n        [placeholder]=\"$any(descriptor.placeholder)\"\n        [slotChar]=\"$any(descriptor.slotChar)\"\n        [styleClass]=\"descriptor.inputClassName\">\n    </p-inputMask>\n\n    <p-fileUpload\n        *ngSwitchCase=\"'file'\"\n        [multiple]=\"descriptor.fileMultiple\"\n        [accept]=\"$any(descriptor.fileAccept)\"\n        [maxFileSize]=\"descriptor.fileMaxFileSize\"\n        [showUploadButton]=\"false\"\n        (onSelect)=\"onFileSelect($event)\"\n        (onRemove)=\"onFileRemove($event)\"\n        (onClear)=\"onFileClear($event)\">\n    </p-fileUpload>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", components: [{ type: i1$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "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", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown"] }, { type: i2$1.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabelledBy"], outputs: ["onChange"] }, { type: i3$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { type: i4$4.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { type: i5$2.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { type: i6$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown"] }, { type: i7.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", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler"] }], directives: [{ type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i11.InputText, selector: "[pInputText]" }], pipes: { "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mng-formly-field-input', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"to.type\">\n    <p-inputNumber\n        *ngSwitchCase=\"'number'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [min]=\"$any(descriptor.numberMin)\"\n        [max]=\"$any(descriptor.numberMax)\"\n        [step]=\"$any(descriptor.numberStep)\"\n        [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [locale]=\"$any(descriptor.locale ?? applicationLocale)\"\n        [mode]=\"$any(numberFieldMode)\"\n        [currency]=\"$any(currency)\"\n        [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n        <small *ngIf=\"showError\" class=\"p-error\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    </div>\n\n    <ng-container *ngSwitchCase=\"'radio'\">\n        <div *ngFor=\"let option of descriptor.radioOptions\" [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    </ng-container>\n\n    <textarea\n        *ngSwitchCase=\"'textarea'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [rows]=\"descriptor.rows ?? 3\"\n        pInputTextarea\n        [class]=\"descriptor.inputClassName\">\n    </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\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\"\n        [showSeconds]=\"descriptor.datePickerShowSeconds\"\n        [showIcon]=\"true\"\n        [inputStyleClass]=\"descriptor.inputClassName\">\n    </p-calendar>\n\n    <p-inputMask\n        *ngSwitchCase=\"'mask'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [mask]=\"$any(descriptor.mask)\"\n        [placeholder]=\"$any(descriptor.placeholder)\"\n        [slotChar]=\"$any(descriptor.slotChar)\"\n        [styleClass]=\"descriptor.inputClassName\">\n    </p-inputMask>\n\n    <p-fileUpload\n        *ngSwitchCase=\"'file'\"\n        [multiple]=\"descriptor.fileMultiple\"\n        [accept]=\"$any(descriptor.fileAccept)\"\n        [maxFileSize]=\"descriptor.fileMaxFileSize\"\n        [showUploadButton]=\"false\"\n        (onSelect)=\"onFileSelect($event)\"\n        (onRemove)=\"onFileRemove($event)\"\n        (onClear)=\"onFileClear($event)\">\n    </p-fileUpload>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n" }]
@@ -7330,7 +7403,7 @@ class MngTableColumnFilterComponent {
     }
 }
 MngTableColumnFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngTableColumnFilterComponent, deps: [{ token: i2.PrimeNGConfig }], target: i0.ɵɵFactoryTarget.Component });
-MngTableColumnFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: { descriptor: "descriptor", display: "display" }, ngImport: i0, template: "<p-columnFilter\n    class=\"ml-auto\"\n    [type]=\"primeType\"\n    matchMode=\"equals\"\n    [field]=\"descriptor.property\"\n    [display]=\"primeDisplay\"\n    [matchMode]=\"primeDefaultMatchMode\"\n    [matchModeOptions]=\"$any(primeMatchModes)\"\n    [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n    [showMatchModes]=\"true\"\n    [showOperator]=\"false\"\n    [showAddButton]=\"false\"\n    [hideOnClear]=\"true\"\n    [minFractionDigits]=\"$any(descriptor.numberMinFractionDigits)\"\n    [maxFractionDigits]=\"$any(descriptor.numberMaxFractionDigits)\"\n    [useGrouping]=\"descriptor.numberUseGrouping\">\n    <ng-template *ngIf=\"primeType === 'date'\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <p-calendar\n            appendTo=\"body\"\n            [ngModel]=\"value\"\n            (ngModelChange)=\"dateFilter($event, filterCallback)\"\n            [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n            [showIcon]=\"true\"\n            [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n            [showTime]=\"descriptor.datePickerShowTime\">\n        </p-calendar>\n    </ng-template>\n    <ng-template *ngIf=\"lookupDescriptor\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <ng-container [ngSwitch]=\"lookupDescriptor.lookupType\">\n            <mng-autocomplete\n                *ngSwitchCase=\"lookupTypeAutocomplete\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n                [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                (valueChange)=\"autocompleteFilter($event, filterCallback)\">\n            </mng-autocomplete>\n            <mng-dropdown\n                *ngSwitchCase=\"lookupTypeDropdown\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                [showClear]=\"false\"\n                (valueChange)=\"dropdownFilter($event, filterCallback)\">\n            </mng-dropdown>\n        </ng-container>\n    </ng-template>\n</p-columnFilter>\n", components: [{ type: i4$4.ColumnFilter, selector: "p-columnFilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping"] }, { type: i5$2.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName"], outputs: ["valueChange"] }, { type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsLabelTranslate", "itemsValueProperty", "itemsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName"], outputs: ["valueChange"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], pipes: { "translate": i1$1.TranslatePipe } });
+MngTableColumnFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: { descriptor: "descriptor", display: "display" }, ngImport: i0, template: "<p-columnFilter\n    class=\"ml-auto\"\n    [type]=\"primeType\"\n    matchMode=\"equals\"\n    [field]=\"descriptor.property\"\n    [display]=\"primeDisplay\"\n    [matchMode]=\"primeDefaultMatchMode\"\n    [matchModeOptions]=\"$any(primeMatchModes)\"\n    [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n    [showMatchModes]=\"true\"\n    [showOperator]=\"false\"\n    [showAddButton]=\"false\"\n    [hideOnClear]=\"true\"\n    [minFractionDigits]=\"$any(descriptor.numberMinFractionDigits)\"\n    [maxFractionDigits]=\"$any(descriptor.numberMaxFractionDigits)\"\n    [useGrouping]=\"descriptor.numberUseGrouping\">\n    <ng-template *ngIf=\"primeType === 'date'\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <p-calendar\n            appendTo=\"body\"\n            [ngModel]=\"value\"\n            (ngModelChange)=\"dateFilter($event, filterCallback)\"\n            [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n            [showIcon]=\"true\"\n            [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n            [showTime]=\"descriptor.datePickerShowTime\">\n        </p-calendar>\n    </ng-template>\n    <ng-template *ngIf=\"lookupDescriptor\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <ng-container [ngSwitch]=\"lookupDescriptor.lookupType\">\n            <mng-autocomplete\n                *ngSwitchCase=\"lookupTypeAutocomplete\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n                [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                (valueChange)=\"autocompleteFilter($event, filterCallback)\">\n            </mng-autocomplete>\n            <mng-dropdown\n                *ngSwitchCase=\"lookupTypeDropdown\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                [showClear]=\"false\"\n                (valueChange)=\"dropdownFilter($event, filterCallback)\">\n            </mng-dropdown>\n        </ng-container>\n    </ng-template>\n</p-columnFilter>\n", components: [{ type: i4$5.ColumnFilter, selector: "p-columnFilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping"] }, { type: i5$2.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName"], outputs: ["valueChange"] }, { type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsLabelTranslate", "itemsValueProperty", "itemsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName"], outputs: ["valueChange"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], pipes: { "translate": i1$1.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngTableColumnFilterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mng-table-column-filter', template: "<p-columnFilter\n    class=\"ml-auto\"\n    [type]=\"primeType\"\n    matchMode=\"equals\"\n    [field]=\"descriptor.property\"\n    [display]=\"primeDisplay\"\n    [matchMode]=\"primeDefaultMatchMode\"\n    [matchModeOptions]=\"$any(primeMatchModes)\"\n    [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n    [showMatchModes]=\"true\"\n    [showOperator]=\"false\"\n    [showAddButton]=\"false\"\n    [hideOnClear]=\"true\"\n    [minFractionDigits]=\"$any(descriptor.numberMinFractionDigits)\"\n    [maxFractionDigits]=\"$any(descriptor.numberMaxFractionDigits)\"\n    [useGrouping]=\"descriptor.numberUseGrouping\">\n    <ng-template *ngIf=\"primeType === 'date'\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <p-calendar\n            appendTo=\"body\"\n            [ngModel]=\"value\"\n            (ngModelChange)=\"dateFilter($event, filterCallback)\"\n            [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n            [showIcon]=\"true\"\n            [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n            [showTime]=\"descriptor.datePickerShowTime\">\n        </p-calendar>\n    </ng-template>\n    <ng-template *ngIf=\"lookupDescriptor\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <ng-container [ngSwitch]=\"lookupDescriptor.lookupType\">\n            <mng-autocomplete\n                *ngSwitchCase=\"lookupTypeAutocomplete\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n                [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                (valueChange)=\"autocompleteFilter($event, filterCallback)\">\n            </mng-autocomplete>\n            <mng-dropdown\n                *ngSwitchCase=\"lookupTypeDropdown\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                [showClear]=\"false\"\n                (valueChange)=\"dropdownFilter($event, filterCallback)\">\n            </mng-dropdown>\n        </ng-container>\n    </ng-template>\n</p-columnFilter>\n" }]
@@ -7822,7 +7895,7 @@ class MngTableComponent {
     }
 }
 MngTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngTableComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i1$1.TranslateService }, { token: MngActionExecutorService }, { token: MngViewContainerComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MngTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngTableComponent, selector: "mng-table", inputs: { descriptor: "descriptor", items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", actions: "actions", isColumnClickable: "isColumnClickable", viewContainerInit: ["viewContainer", "viewContainerInit"], captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth" }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }, { propertyName: "components", predicate: MngComponentDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [style.height]=\"scrollHeight === 'flex' ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n    <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n    <p-table\n        *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n        [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n        [dataKey]=\"$any(descriptor.dataKeyProperty)\"\n        [lazy]=\"useDataProvider\"\n        [loading]=\"(loading$ | async) ?? false\"\n        [paginator]=\"useDataProvider && !infiniteScroll\"\n        [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n        [first]=\"$any(infiniteScroll ? 0 : offset)\"\n        [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n        [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n        [showCurrentPageReport]=\"!infiniteScroll\"\n        [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n        [multiSortMeta]=\"$any(multiSortMeta)\"\n        [filters]=\"filterMetadata\"\n        [(selection)]=\"selection\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        [scrollable]=\"infiniteScroll\"\n        [virtualScroll]=\"infiniteScroll\"\n        [virtualRowHeight]=\"$any(rowHeight)\"\n        [scrollHeight]=\"$any(scrollHeight)\"\n        [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n        [rowHover]=\"descriptor.hasHover\"\n        [styleClass]=\"className\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\"\n        sortMode=\"multiple\"\n        responsiveLayout=\"scroll\">\n        <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #componentOrDefaultCaption>\n                <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n                <ng-template #defaultCaption>\n                    <h5 class=\"p-0 m-0\">{{ descriptor.title }}</h5>\n                </ng-template>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr *ngIf=\"!descriptor.hideHeader\">\n                <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n                <ng-container *ngFor=\"let col of descriptor.columns\">\n                    <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\" [class]=\"col.headerClassName\" [style.width.%]=\"col.width\" [style.min-width.px]=\"col.minWidth\">\n                        <div class=\"flex justify-content-between align-items-center\">\n                            {{ col.title ?? (col.property | i18nProperty: descriptor.model) | translate }}\n                            <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n                            <mng-table-column-filter\n                                *ngIf=\"col.filterDescriptor && descriptor.filterDisplay === filterDisplayMenu\"\n                                class=\"ml-auto\"\n                                [display]=\"descriptor.filterDisplay\"\n                                [descriptor]=\"col.filterDescriptor\">\n                            </mng-table-column-filter>\n                        </div>\n                    </th>\n                    <th *ngIf=\"!col.isSortEnabled\">\n                        {{ col.title ?? (col.property | i18nProperty: descriptor.model) | translate }}\n                        <ng-container>\n                            <mng-table-column-filter\n                                *ngIf=\"col.filterDescriptor && descriptor.filterDisplay === filterDisplayMenu\"\n                                class=\"ml-auto\"\n                                [display]=\"descriptor.filterDisplay\"\n                                [descriptor]=\"col.filterDescriptor\">\n                            </mng-table-column-filter>\n                        </ng-container>\n                    </th>\n                </ng-container>\n                <th *ngIf=\"showInlineActionsColumn\"></th>\n            </tr>\n            <tr *ngIf=\"descriptor.filterDisplay === filterDisplayRow\" class=\"mng-column-filter-row\">\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n                <th\n                    *ngFor=\"let col of descriptor.columns\"\n                    [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n                    [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n                    [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\">\n                    <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n                        <mng-table-column-filter [display]=\"descriptor.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n                    </div>\n                </th>\n                <th *ngIf=\"showInlineActionsColumn\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngIf=\"selectionEnabled && selectionMode === 'single'\">\n                    <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n                </td>\n                <td\n                    *ngFor=\"let col of descriptor.columns\"\n                    (click)=\"onCellClick($event, col, item, idx)\"\n                    [class]=\"col.className\"\n                    [class.clickable]=\"isColumnClickable\"\n                    [style.width.%]=\"col.width\"\n                    [style.min-width.px]=\"col.minWidth\">\n                    <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n                </td>\n                <td *ngIf=\"showInlineActionsColumn\" class=\"column-action text-right\" [style.min-width.px]=\"columnActionMinWidth\">\n                    <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n                        <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                    </ng-container>\n                    <ng-template #showColumnActionComponentOrDefault>\n                        <span\n                            *ngIf=\"columnActionComponent; else defaultColumnActions\"\n                            [mngComponent]=\"columnActionComponent!\"\n                            (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n                    </ng-template>\n                    <ng-template #defaultColumnActions>\n                        <mng-action\n                            *ngFor=\"let action of rowInlineActions\"\n                            [action]=\"action\"\n                            [item]=\"item\"\n                            [itemId]=\"descriptor.model.idPropertyName ? item[descriptor.model.idPropertyName] : null\"\n                            [actionData]=\"{itemIndex: idx}\"\n                            (finish)=\"onActionFinish($event)\">\n                        </mng-action>\n                    </ng-template>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    <div class=\"loading-text\"></div>\n                    <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"emptymessage\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    {{ 'mngTable.noItems' | translate }}\n                </td>\n            </tr>\n        </ng-template>\n    </p-table>\n</div>\n", components: [{ type: i4$4.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollDelay", "virtualRowHeight", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "minBufferPx", "maxBufferPx", "responsiveLayout", "breakpoint", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { type: i4$4.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { type: i4$4.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor", "display"] }, { type: i4$4.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { type: i4$4.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer"], outputs: ["finish"] }, { type: i8$1.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$4.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "async": i3.AsyncPipe, "translate": i1$1.TranslatePipe, "i18nProperty": MngI18nPropertyPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngTableComponent, selector: "mng-table", inputs: { descriptor: "descriptor", items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", actions: "actions", isColumnClickable: "isColumnClickable", viewContainerInit: ["viewContainer", "viewContainerInit"], captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth" }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }, { propertyName: "components", predicate: MngComponentDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [style.height]=\"scrollHeight === 'flex' ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n    <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n    <p-table\n        *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n        [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n        [dataKey]=\"$any(descriptor.dataKeyProperty)\"\n        [lazy]=\"useDataProvider\"\n        [loading]=\"(loading$ | async) ?? false\"\n        [paginator]=\"useDataProvider && !infiniteScroll\"\n        [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n        [first]=\"$any(infiniteScroll ? 0 : offset)\"\n        [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n        [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n        [showCurrentPageReport]=\"!infiniteScroll\"\n        [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n        [multiSortMeta]=\"$any(multiSortMeta)\"\n        [filters]=\"filterMetadata\"\n        [(selection)]=\"selection\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        [scrollable]=\"infiniteScroll\"\n        [virtualScroll]=\"infiniteScroll\"\n        [virtualRowHeight]=\"$any(rowHeight)\"\n        [scrollHeight]=\"$any(scrollHeight)\"\n        [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n        [rowHover]=\"descriptor.hasHover\"\n        [styleClass]=\"className\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\"\n        sortMode=\"multiple\"\n        responsiveLayout=\"scroll\">\n        <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #componentOrDefaultCaption>\n                <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n                <ng-template #defaultCaption>\n                    <h5 class=\"p-0 m-0\">{{ descriptor.title }}</h5>\n                </ng-template>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr *ngIf=\"!descriptor.hideHeader\">\n                <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n                <ng-container *ngFor=\"let col of descriptor.columns\">\n                    <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\" [class]=\"col.headerClassName\" [style.width.%]=\"col.width\" [style.min-width.px]=\"col.minWidth\">\n                        <div class=\"flex justify-content-between align-items-center\">\n                            {{ col.title ?? (col.property | i18nProperty: descriptor.model) | translate }}\n                            <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n                            <mng-table-column-filter\n                                *ngIf=\"col.filterDescriptor && descriptor.filterDisplay === filterDisplayMenu\"\n                                class=\"ml-auto\"\n                                [display]=\"descriptor.filterDisplay\"\n                                [descriptor]=\"col.filterDescriptor\">\n                            </mng-table-column-filter>\n                        </div>\n                    </th>\n                    <th *ngIf=\"!col.isSortEnabled\">\n                        {{ col.title ?? (col.property | i18nProperty: descriptor.model) | translate }}\n                        <ng-container>\n                            <mng-table-column-filter\n                                *ngIf=\"col.filterDescriptor && descriptor.filterDisplay === filterDisplayMenu\"\n                                class=\"ml-auto\"\n                                [display]=\"descriptor.filterDisplay\"\n                                [descriptor]=\"col.filterDescriptor\">\n                            </mng-table-column-filter>\n                        </ng-container>\n                    </th>\n                </ng-container>\n                <th *ngIf=\"showInlineActionsColumn\"></th>\n            </tr>\n            <tr *ngIf=\"descriptor.filterDisplay === filterDisplayRow\" class=\"mng-column-filter-row\">\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n                <th\n                    *ngFor=\"let col of descriptor.columns\"\n                    [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n                    [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n                    [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\">\n                    <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n                        <mng-table-column-filter [display]=\"descriptor.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n                    </div>\n                </th>\n                <th *ngIf=\"showInlineActionsColumn\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngIf=\"selectionEnabled && selectionMode === 'single'\">\n                    <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n                </td>\n                <td\n                    *ngFor=\"let col of descriptor.columns\"\n                    (click)=\"onCellClick($event, col, item, idx)\"\n                    [class]=\"col.className\"\n                    [class.clickable]=\"isColumnClickable\"\n                    [style.width.%]=\"col.width\"\n                    [style.min-width.px]=\"col.minWidth\">\n                    <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n                </td>\n                <td *ngIf=\"showInlineActionsColumn\" class=\"column-action text-right\" [style.min-width.px]=\"columnActionMinWidth\">\n                    <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n                        <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                    </ng-container>\n                    <ng-template #showColumnActionComponentOrDefault>\n                        <span\n                            *ngIf=\"columnActionComponent; else defaultColumnActions\"\n                            [mngComponent]=\"columnActionComponent!\"\n                            (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n                    </ng-template>\n                    <ng-template #defaultColumnActions>\n                        <mng-action\n                            *ngFor=\"let action of rowInlineActions\"\n                            [action]=\"action\"\n                            [item]=\"item\"\n                            [itemId]=\"descriptor.model.idPropertyName ? item[descriptor.model.idPropertyName] : null\"\n                            [actionData]=\"{itemIndex: idx}\"\n                            (finish)=\"onActionFinish($event)\">\n                        </mng-action>\n                    </ng-template>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    <div class=\"loading-text\"></div>\n                    <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"emptymessage\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    {{ 'mngTable.noItems' | translate }}\n                </td>\n            </tr>\n        </ng-template>\n    </p-table>\n</div>\n", components: [{ type: i4$5.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollDelay", "virtualRowHeight", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "minBufferPx", "maxBufferPx", "responsiveLayout", "breakpoint", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { type: i4$5.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { type: i4$5.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor", "display"] }, { type: i4$5.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { type: i4$5.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer"], outputs: ["finish"] }, { type: i8$1.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$5.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "async": i3.AsyncPipe, "translate": i1$1.TranslatePipe, "i18nProperty": MngI18nPropertyPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mng-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.height]=\"scrollHeight === 'flex' ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n    <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n    <p-table\n        *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n        [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n        [dataKey]=\"$any(descriptor.dataKeyProperty)\"\n        [lazy]=\"useDataProvider\"\n        [loading]=\"(loading$ | async) ?? false\"\n        [paginator]=\"useDataProvider && !infiniteScroll\"\n        [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n        [first]=\"$any(infiniteScroll ? 0 : offset)\"\n        [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n        [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n        [showCurrentPageReport]=\"!infiniteScroll\"\n        [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n        [multiSortMeta]=\"$any(multiSortMeta)\"\n        [filters]=\"filterMetadata\"\n        [(selection)]=\"selection\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        [scrollable]=\"infiniteScroll\"\n        [virtualScroll]=\"infiniteScroll\"\n        [virtualRowHeight]=\"$any(rowHeight)\"\n        [scrollHeight]=\"$any(scrollHeight)\"\n        [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n        [rowHover]=\"descriptor.hasHover\"\n        [styleClass]=\"className\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\"\n        sortMode=\"multiple\"\n        responsiveLayout=\"scroll\">\n        <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #componentOrDefaultCaption>\n                <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n                <ng-template #defaultCaption>\n                    <h5 class=\"p-0 m-0\">{{ descriptor.title }}</h5>\n                </ng-template>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr *ngIf=\"!descriptor.hideHeader\">\n                <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n                <ng-container *ngFor=\"let col of descriptor.columns\">\n                    <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\" [class]=\"col.headerClassName\" [style.width.%]=\"col.width\" [style.min-width.px]=\"col.minWidth\">\n                        <div class=\"flex justify-content-between align-items-center\">\n                            {{ col.title ?? (col.property | i18nProperty: descriptor.model) | translate }}\n                            <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n                            <mng-table-column-filter\n                                *ngIf=\"col.filterDescriptor && descriptor.filterDisplay === filterDisplayMenu\"\n                                class=\"ml-auto\"\n                                [display]=\"descriptor.filterDisplay\"\n                                [descriptor]=\"col.filterDescriptor\">\n                            </mng-table-column-filter>\n                        </div>\n                    </th>\n                    <th *ngIf=\"!col.isSortEnabled\">\n                        {{ col.title ?? (col.property | i18nProperty: descriptor.model) | translate }}\n                        <ng-container>\n                            <mng-table-column-filter\n                                *ngIf=\"col.filterDescriptor && descriptor.filterDisplay === filterDisplayMenu\"\n                                class=\"ml-auto\"\n                                [display]=\"descriptor.filterDisplay\"\n                                [descriptor]=\"col.filterDescriptor\">\n                            </mng-table-column-filter>\n                        </ng-container>\n                    </th>\n                </ng-container>\n                <th *ngIf=\"showInlineActionsColumn\"></th>\n            </tr>\n            <tr *ngIf=\"descriptor.filterDisplay === filterDisplayRow\" class=\"mng-column-filter-row\">\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n                <th\n                    *ngFor=\"let col of descriptor.columns\"\n                    [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n                    [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n                    [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\">\n                    <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n                        <mng-table-column-filter [display]=\"descriptor.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n                    </div>\n                </th>\n                <th *ngIf=\"showInlineActionsColumn\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngIf=\"selectionEnabled && selectionMode === 'single'\">\n                    <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n                </td>\n                <td\n                    *ngFor=\"let col of descriptor.columns\"\n                    (click)=\"onCellClick($event, col, item, idx)\"\n                    [class]=\"col.className\"\n                    [class.clickable]=\"isColumnClickable\"\n                    [style.width.%]=\"col.width\"\n                    [style.min-width.px]=\"col.minWidth\">\n                    <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n                </td>\n                <td *ngIf=\"showInlineActionsColumn\" class=\"column-action text-right\" [style.min-width.px]=\"columnActionMinWidth\">\n                    <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n                        <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                    </ng-container>\n                    <ng-template #showColumnActionComponentOrDefault>\n                        <span\n                            *ngIf=\"columnActionComponent; else defaultColumnActions\"\n                            [mngComponent]=\"columnActionComponent!\"\n                            (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n                    </ng-template>\n                    <ng-template #defaultColumnActions>\n                        <mng-action\n                            *ngFor=\"let action of rowInlineActions\"\n                            [action]=\"action\"\n                            [item]=\"item\"\n                            [itemId]=\"descriptor.model.idPropertyName ? item[descriptor.model.idPropertyName] : null\"\n                            [actionData]=\"{itemIndex: idx}\"\n                            (finish)=\"onActionFinish($event)\">\n                        </mng-action>\n                    </ng-template>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    <div class=\"loading-text\"></div>\n                    <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"emptymessage\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    {{ 'mngTable.noItems' | translate }}\n                </td>\n            </tr>\n        </ng-template>\n    </p-table>\n</div>\n" }]
@@ -7946,7 +8019,7 @@ class MngTableviewComponent {
     }
 }
 MngTableviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngTableviewComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2.MessageService }, { token: i1$1.TranslateService }, { token: i3$1.DialogService }, { token: i2.ConfirmationService }, { token: MngActionExecutorService }, { token: MngViewContainerComponentService }], target: i0.ɵɵFactoryTarget.Component });
-MngTableviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngTableviewComponent, selector: "mng-tableview", inputs: { descriptor: "descriptor", dataProvider: "dataProvider", actions: "actions" }, providers: [MessageService, ConfirmationService, MngViewContainerComponentService], viewQueries: [{ propertyName: "tableComponent", first: true, predicate: MngTableComponent, descendants: true }], ngImport: i0, template: "<div class=\"mng-tableview\">\n    <p-toast></p-toast>\n\n    <div class=\"card\">\n        <p-toolbar styleClass=\"mb-4\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n            <ng-template pTemplate=\"left\">\n                <mng-action *ngFor=\"let action of toolbarLeftActions\" [action]=\"action\" [queryParam]=\"tableQueryParam\"> </mng-action>\n            </ng-template>\n\n            <ng-template pTemplate=\"right\">\n                <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\" [queryParam]=\"tableQueryParam\"> </mng-action>\n            </ng-template>\n        </p-toolbar>\n\n        <mng-table [descriptor]=\"descriptor.table\" [dataProvider]=\"dataProvider\" [useQueryParams]=\"true\" [actions]=\"actions\" (tableLoad)=\"onTableLoad($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        </mng-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n", components: [{ type: i6$2.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { type: i4$2.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass"] }, { type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer"], outputs: ["finish"] }, { type: MngTableComponent, selector: "mng-table", inputs: ["descriptor", "items", "queryResult", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "actions", "isColumnClickable", "viewContainer", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: MngTemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { type: i1.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], pipes: { "translate": i1$1.TranslatePipe } });
+MngTableviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngTableviewComponent, selector: "mng-tableview", inputs: { descriptor: "descriptor", dataProvider: "dataProvider", actions: "actions" }, providers: [MessageService, ConfirmationService, MngViewContainerComponentService], viewQueries: [{ propertyName: "tableComponent", first: true, predicate: MngTableComponent, descendants: true }], ngImport: i0, template: "<div class=\"mng-tableview\">\n    <p-toast></p-toast>\n\n    <div class=\"card\">\n        <p-toolbar styleClass=\"mb-4\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n            <ng-template pTemplate=\"left\">\n                <mng-action *ngFor=\"let action of toolbarLeftActions\" [action]=\"action\" [queryParam]=\"tableQueryParam\"> </mng-action>\n            </ng-template>\n\n            <ng-template pTemplate=\"right\">\n                <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\" [queryParam]=\"tableQueryParam\"> </mng-action>\n            </ng-template>\n        </p-toolbar>\n\n        <mng-table [descriptor]=\"descriptor.table\" [dataProvider]=\"dataProvider\" [useQueryParams]=\"true\" [actions]=\"actions\" (tableLoad)=\"onTableLoad($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        </mng-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n", components: [{ type: i6$2.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { type: i4$3.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass"] }, { type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer"], outputs: ["finish"] }, { type: MngTableComponent, selector: "mng-table", inputs: ["descriptor", "items", "queryResult", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "actions", "isColumnClickable", "viewContainer", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: MngTemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { type: i1.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], pipes: { "translate": i1$1.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngTableviewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mng-tableview', providers: [MessageService, ConfirmationService, MngViewContainerComponentService], template: "<div class=\"mng-tableview\">\n    <p-toast></p-toast>\n\n    <div class=\"card\">\n        <p-toolbar styleClass=\"mb-4\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n            <ng-template pTemplate=\"left\">\n                <mng-action *ngFor=\"let action of toolbarLeftActions\" [action]=\"action\" [queryParam]=\"tableQueryParam\"> </mng-action>\n            </ng-template>\n\n            <ng-template pTemplate=\"right\">\n                <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\" [queryParam]=\"tableQueryParam\"> </mng-action>\n            </ng-template>\n        </p-toolbar>\n\n        <mng-table [descriptor]=\"descriptor.table\" [dataProvider]=\"dataProvider\" [useQueryParams]=\"true\" [actions]=\"actions\" (tableLoad)=\"onTableLoad($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        </mng-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n" }]
@@ -8567,31 +8640,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImpor
             args: [{ selector: 'mng-formly-field-fieldset', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let group of field.fieldGroup; let i = index; let last = last\">\n    <ng-container [ngSwitch]=\"group?.templateOptions?.['descriptor']?.type\">\n        <p-fieldset *ngSwitchCase=\"typeFieldset\" [legend]=\"group.templateOptions?.label! | translate\">\n            <formly-field [field]=\"group\"></formly-field>\n        </p-fieldset>\n        <formly-field *ngSwitchDefault [field]=\"group\"></formly-field>\n    </ng-container>\n</ng-container>\n" }]
         }] });
 
-class MngFormlyFieldWrapperComponent extends FieldWrapper {
-}
-MngFormlyFieldWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MngFormlyFieldWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyFieldWrapperComponent, selector: "mng-formly-field-wrapper", usesInheritance: true, ngImport: i0, template: "<div [class]=\"to?.['descriptor']?.['fieldClassName'] ?? 'field'\">\n    <label [for]=\"key\" [class]=\"to?.['descriptor']?.['labelClassName'] ?? ''\"\n        >{{ $any(to?.label) | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label\n    >\n    <ng-container #fieldComponent></ng-container>\n    <small *ngIf=\"to?.['descriptor']?.['helpText']\">{{ to?.['descriptor']?.['helpText'] | translate }}</small>\n    <small *ngIf=\"showError\" class=\"p-error\">\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\n    </small>\n</div>\n", components: [{ type: i3$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyFieldWrapperComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'mng-formly-field-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"to?.['descriptor']?.['fieldClassName'] ?? 'field'\">\n    <label [for]=\"key\" [class]=\"to?.['descriptor']?.['labelClassName'] ?? ''\"\n        >{{ $any(to?.label) | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label\n    >\n    <ng-container #fieldComponent></ng-container>\n    <small *ngIf=\"to?.['descriptor']?.['helpText']\">{{ to?.['descriptor']?.['helpText'] | translate }}</small>\n    <small *ngIf=\"showError\" class=\"p-error\">\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\n    </small>\n</div>\n" }]
-        }] });
-
-class MngFormlyTableWrapperComponent extends FieldWrapper {
-}
-MngFormlyTableWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyTableWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MngFormlyTableWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngFormlyTableWrapperComponent, selector: "mng-formly-table-wrapper", usesInheritance: true, ngImport: i0, template: "<div [class]=\"to?.['descriptor']?.['fieldClassName'] ?? 'field table'\">\n    <ng-container #fieldComponent></ng-container>\n    <small *ngIf=\"to?.['descriptor']?.['helpText']\">{{ to?.['descriptor']?.['helpText'] | translate }}</small>\n    <small *ngIf=\"showError\" class=\"p-error\">\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\n    </small>\n</div>\n", components: [{ type: i3$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngFormlyTableWrapperComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'mng-formly-table-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"to?.['descriptor']?.['fieldClassName'] ?? 'field table'\">\n    <ng-container #fieldComponent></ng-container>\n    <small *ngIf=\"to?.['descriptor']?.['helpText']\">{{ to?.['descriptor']?.['helpText'] | translate }}</small>\n    <small *ngIf=\"showError\" class=\"p-error\">\n        <formly-validation-message [field]=\"field\"></formly-validation-message>\n    </small>\n</div>\n" }]
-        }] });
-
 class MngBreadcrumbComponent {
     constructor(mngCommons) {
         this.mngCommons = mngCommons;
     }
 }
 MngBreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngBreadcrumbComponent, deps: [{ token: MngCommonsService }], target: i0.ɵɵFactoryTarget.Component });
-MngBreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngBreadcrumbComponent, selector: "mng-breadcrumb", ngImport: i0, template: "<div class=\"layout-breadcrumb-container\">\n    <div class=\"layout-breadcrumb\">\n        <p-breadcrumb [home]=\"$any(mngCommons.breadcrumbHome$ | async)\" [model]=\"$any(mngCommons.breadcrumbs$ | async)\" styleClass=\"layout-breadcrumb py-2\"></p-breadcrumb>\n    </div>\n</div>\n", components: [{ type: i2$4.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngBreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngBreadcrumbComponent, selector: "mng-breadcrumb", ngImport: i0, template: "<div class=\"layout-breadcrumb-container\">\n    <div class=\"layout-breadcrumb\">\n        <p-breadcrumb [home]=\"$any(mngCommons.breadcrumbHome$ | async)\" [model]=\"$any(mngCommons.breadcrumbs$ | async)\" styleClass=\"layout-breadcrumb py-2\"></p-breadcrumb>\n    </div>\n</div>\n", components: [{ type: i2$2.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngBreadcrumbComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mng-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-breadcrumb-container\">\n    <div class=\"layout-breadcrumb\">\n        <p-breadcrumb [home]=\"$any(mngCommons.breadcrumbHome$ | async)\" [model]=\"$any(mngCommons.breadcrumbs$ | async)\" styleClass=\"layout-breadcrumb py-2\"></p-breadcrumb>\n    </div>\n</div>\n" }]
@@ -9141,7 +9196,7 @@ class MngTopbarComponent {
     }
 }
 MngTopbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngTopbarComponent, deps: [{ token: i1.ActivatedRoute }, { token: MngCommonsService }, { token: MngMainLayoutComponentService }], target: i0.ɵɵFactoryTarget.Component });
-MngTopbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngTopbarComponent, selector: "mng-topbar", viewQueries: [{ propertyName: "templates", predicate: MngTemplateDirective, descendants: true }], ngImport: i0, template: "<div class=\"layout-topbar\">\n    <div class=\"layout-topbar-left\">\n        <a\n            href=\"#\"\n            class=\"topbar-menu-button\"\n            (click)=\"mainLayoutService.onMenuButtonClick($event)\"\n            *ngIf=\"(mngCommons.menuModeIsOverlay$ | async) || (mainLayoutService.isMobile$ | async)\">\n            <i class=\"pi pi-bars\"></i>\n        </a>\n\n        <ng-container [mngComponent]=\"breadcrumbComponent\"></ng-container>\n    </div>\n\n    <ng-container [mngComponent]=\"menuComponent\"></ng-container>\n\n    <div class=\"layout-topbar-right\">\n        <ul class=\"layout-topbar-right-items\">\n            <li #profile class=\"profile-item\" [ngClass]=\"{'active-topmenuitem': (mainLayoutService.activeTopbarItem$ | async) === profile}\">\n                <a href=\"#\" (click)=\"mainLayoutService.onTopbarItemClick($event, profile)\">\n                    <i class=\"pi pi-fw pi-user\"></i>\n                </a>\n                <ul class=\"fadeInDown\" *ngIf=\"user\">\n                    <li role=\"menuitem\">\n                        <a>\n                            {{ user?.displayName ?? user?.username }}\n                        </a>\n                    </li>\n                    <li role=\"menuitem\" *ngIf=\"user?.logout || user?.logoutUrl\">\n                        <a [href]=\"user?.logoutUrl\" (click)=\"logout(user, $event)\">\n                            <i class=\"pi pi-fw pi-sign-out\"></i>\n                            <span>{{ 'mngTopbar.logout' | translate }}</span>\n                        </a>\n                    </li>\n                </ul>\n            </li>\n            <li *ngIf=\"languages.length > 1\" class=\"profile-item\" [ngClass]=\"{'active-topmenuitem': (mainLayoutService.activeTopbarItem$ | async) === profile}\">\n                <i class=\"pi pi-fw pi-globe\"></i>\n                <p-dropdown [ngModel]=\"selectedLanguage\" [options]=\"languages\" (onChange)=\"switchLanguage($event.value)\"></p-dropdown>\n            </li>\n        </ul>\n    </div>\n</div>\n", components: [{ type: i2$2.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "virtualScroll", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "async": i3.AsyncPipe, "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngTopbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MngTopbarComponent, selector: "mng-topbar", viewQueries: [{ propertyName: "templates", predicate: MngTemplateDirective, descendants: true }], ngImport: i0, template: "<div class=\"layout-topbar\">\n    <div class=\"layout-topbar-left\">\n        <a\n            href=\"#\"\n            class=\"topbar-menu-button\"\n            (click)=\"mainLayoutService.onMenuButtonClick($event)\"\n            *ngIf=\"(mngCommons.menuModeIsOverlay$ | async) || (mainLayoutService.isMobile$ | async)\">\n            <i class=\"pi pi-bars\"></i>\n        </a>\n\n        <ng-container [mngComponent]=\"breadcrumbComponent\"></ng-container>\n    </div>\n\n    <ng-container [mngComponent]=\"menuComponent\"></ng-container>\n\n    <div class=\"layout-topbar-right\">\n        <ul class=\"layout-topbar-right-items\">\n            <li #profile class=\"profile-item\" [ngClass]=\"{'active-topmenuitem': (mainLayoutService.activeTopbarItem$ | async) === profile}\">\n                <a href=\"#\" (click)=\"mainLayoutService.onTopbarItemClick($event, profile)\">\n                    <i class=\"pi pi-fw pi-user\"></i>\n                </a>\n                <ul class=\"fadeInDown\" *ngIf=\"user\">\n                    <li role=\"menuitem\">\n                        <a>\n                            {{ user?.displayName ?? user?.username }}\n                        </a>\n                    </li>\n                    <li role=\"menuitem\" *ngIf=\"user?.logout || user?.logoutUrl\">\n                        <a [href]=\"user?.logoutUrl\" (click)=\"logout(user, $event)\">\n                            <i class=\"pi pi-fw pi-sign-out\"></i>\n                            <span>{{ 'mngTopbar.logout' | translate }}</span>\n                        </a>\n                    </li>\n                </ul>\n            </li>\n            <li *ngIf=\"languages.length > 1\" class=\"profile-item\" [ngClass]=\"{'active-topmenuitem': (mainLayoutService.activeTopbarItem$ | async) === profile}\">\n                <i class=\"pi pi-fw pi-globe\"></i>\n                <p-dropdown [ngModel]=\"selectedLanguage\" [options]=\"languages\" (onChange)=\"switchLanguage($event.value)\"></p-dropdown>\n            </li>\n        </ul>\n    </div>\n</div>\n", components: [{ type: i3$5.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "virtualScroll", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "async": i3.AsyncPipe, "translate": i1$1.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MngTopbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mng-topbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-topbar\">\n    <div class=\"layout-topbar-left\">\n        <a\n            href=\"#\"\n            class=\"topbar-menu-button\"\n            (click)=\"mainLayoutService.onMenuButtonClick($event)\"\n            *ngIf=\"(mngCommons.menuModeIsOverlay$ | async) || (mainLayoutService.isMobile$ | async)\">\n            <i class=\"pi pi-bars\"></i>\n        </a>\n\n        <ng-container [mngComponent]=\"breadcrumbComponent\"></ng-container>\n    </div>\n\n    <ng-container [mngComponent]=\"menuComponent\"></ng-container>\n\n    <div class=\"layout-topbar-right\">\n        <ul class=\"layout-topbar-right-items\">\n            <li #profile class=\"profile-item\" [ngClass]=\"{'active-topmenuitem': (mainLayoutService.activeTopbarItem$ | async) === profile}\">\n                <a href=\"#\" (click)=\"mainLayoutService.onTopbarItemClick($event, profile)\">\n                    <i class=\"pi pi-fw pi-user\"></i>\n                </a>\n                <ul class=\"fadeInDown\" *ngIf=\"user\">\n                    <li role=\"menuitem\">\n                        <a>\n                            {{ user?.displayName ?? user?.username }}\n                        </a>\n                    </li>\n                    <li role=\"menuitem\" *ngIf=\"user?.logout || user?.logoutUrl\">\n                        <a [href]=\"user?.logoutUrl\" (click)=\"logout(user, $event)\">\n                            <i class=\"pi pi-fw pi-sign-out\"></i>\n                            <span>{{ 'mngTopbar.logout' | translate }}</span>\n                        </a>\n                    </li>\n                </ul>\n            </li>\n            <li *ngIf=\"languages.length > 1\" class=\"profile-item\" [ngClass]=\"{'active-topmenuitem': (mainLayoutService.activeTopbarItem$ | async) === profile}\">\n                <i class=\"pi pi-fw pi-globe\"></i>\n                <p-dropdown [ngModel]=\"selectedLanguage\" [options]=\"languages\" (onChange)=\"switchLanguage($event.value)\"></p-dropdown>\n            </li>\n        </ul>\n    </div>\n</div>\n" }]