@mediusinc/mng-commons 0.2.8 → 0.2.13

package/fesm2015/mediusinc-mng-commons.mjs

@@ -6,7 +6,7 @@ import { Injectable, InjectionToken, Inject, Component, ChangeDetectionStrategy,
 import * as i2$3 from '@angular/forms';
 import { Validators, FormGroup, NG_VALUE_ACCESSOR, FormControl, ReactiveFormsModule } from '@angular/forms';
 import * as i1 from '@angular/router';
-import { NavigationEnd, RouterModule } from '@angular/router';
+import { NavigationEnd, GuardsCheckEnd, RouterModule } from '@angular/router';
 import * as i3 from '@ngx-formly/core';
 import { FieldType, FieldWrapper, FORMLY_CONFIG, FormlyModule } from '@ngx-formly/core';
 import * as i2$2 from '@ngx-translate/core';
@@ -36,14 +36,15 @@ import { DynamicDialogModule, DialogService } from 'primeng/dynamicdialog';
 import * as i1$5 from 'primeng/fieldset';
 import { FieldsetModule } from 'primeng/fieldset';
 import { FileUploadModule } from 'primeng/fileupload';
+import * as i6$1 from 'primeng/inputmask';
 import { InputMaskModule } from 'primeng/inputmask';
 import * as i1$3 from 'primeng/inputnumber';
 import { InputNumberModule } from 'primeng/inputnumber';
 import * as i2$5 from 'primeng/inputswitch';
 import { InputSwitchModule } from 'primeng/inputswitch';
-import * as i9$1 from 'primeng/inputtext';
+import * as i10$1 from 'primeng/inputtext';
 import { InputTextModule } from 'primeng/inputtext';
-import * as i8$1 from 'primeng/inputtextarea';
+import * as i9$1 from 'primeng/inputtextarea';
 import { InputTextareaModule } from 'primeng/inputtextarea';
 import * as i3$1 from 'primeng/messages';
 import { MessagesModule } from 'primeng/messages';
@@ -67,11 +68,11 @@ import { TagModule } from 'primeng/tag';
 import * as i7$1 from 'primeng/toast';
 import { ToastModule } from 'primeng/toast';
 import { ToggleButtonModule } from 'primeng/togglebutton';
-import * as i8$2 from 'primeng/toolbar';
+import * as i8$1 from 'primeng/toolbar';
 import { ToolbarModule } from 'primeng/toolbar';
 import * as i10 from 'primeng/tooltip';
 import { TooltipModule } from 'primeng/tooltip';
-import { of, throwError, Observable, from, BehaviorSubject, Subject, ReplaySubject } from 'rxjs';
+import { of, throwError, Observable, from, BehaviorSubject, Subject, ReplaySubject, distinctUntilChanged, combineLatest } from 'rxjs';
 import 'reflect-metadata';
 import { mergeMap, map, first, catchError, filter, finalize, startWith } from 'rxjs/operators';
 import * as i4 from '@angular/platform-browser';
@@ -427,17 +428,10 @@ class DataProvider {
     get modelType() {
         return this._modelType;
     }
-    get enumName() {
-        return this._enumName;
-    }
     withServiceType(type) {
         this._serviceType = type;
         return this;
     }
-    withEnumName(enumName) {
-        this._enumName = enumName;
-        return this;
-    }
 }
 
 class EditorDataProvider extends DataProvider {
@@ -766,29 +760,33 @@ class EditorDescriptor {
         this._disabled = false;
         this._model = new ModelDescriptor(modelType, idProperty, titleProperty);
     }
+    get disabled() {
+        return this._disabled;
+    }
     get model() {
         return this._model;
     }
     get tabs() {
         return this._tabs;
     }
-    get disabled() {
-        return this._disabled;
-    }
     get fields() {
         return this._fields;
     }
     createTabGroup(name, title) {
         const tabGroup = new FieldTabGroupDescriptor(this, name);
-        if (title) {
-            tabGroup.withTitle(title);
+        if (!title) {
+            title = I18nUtil.getModelTabKey(this.model, name);
         }
+        tabGroup.withTitle(title);
         this.createTabGroupDescriptor(tabGroup);
         return tabGroup;
     }
     createFieldGroup(name, title) {
         const fieldGroup = new FieldGroupDescriptor(this, name);
-        if (title) {
+        if (title !== null) {
+            if (!title) {
+                title = I18nUtil.getModelGroupKey(this.model, name);
+            }
             fieldGroup.withTitle(title);
         }
         this.createFieldGroupDescriptor(fieldGroup);
@@ -830,16 +828,8 @@ class EditorDescriptor {
         this.addFieldDescriptor(field);
         return field;
     }
-    addFieldLookupEnum(property, options) {
-        const propDef = ObjectSerializer.get().findAttributeDefinitionByClassType(this.model.type, property);
-        if (!propDef) {
-            throw new Error(`Property (attribute) definition not found for property ${property} on class type ${this._model.typeName}`);
-        }
-        const enumDef = ObjectSerializer.get().findEnum(propDef.type);
-        if (!enumDef) {
-            throw new Error(`Enum definition ${propDef.type} not found for property ${property} on class type ${this._model.typeName}`);
-        }
-        const field = new FieldLookupEnumDescriptor(this, property, propDef.type, options);
+    addFieldLookupEnum(property, enumType, options, nameAsValue = false, optionsTitlePath) {
+        const field = new FieldLookupEnumDescriptor(this, property, enumType, options, nameAsValue, optionsTitlePath);
         this.addFieldDescriptor(field);
         return field;
     }
@@ -878,11 +868,6 @@ class EditorDescriptor {
         editor._disabled = this._disabled;
         return editor;
     }
-    createTabGroupDescriptor(tabGroup) {
-        this._currentTabGroup = tabGroup;
-        this._tabs.push(tabGroup);
-        return this;
-    }
     createFieldGroupDescriptor(fieldGroup) {
         var _a;
         this.createDefaultTabGroup();
@@ -891,16 +876,21 @@ class EditorDescriptor {
         (_a = this._currentTabGroup) === null || _a === void 0 ? void 0 : _a.addField(fieldGroup);
         return this;
     }
+    createTabGroupDescriptor(tabGroup) {
+        this._currentTabGroup = tabGroup;
+        this._tabs.push(tabGroup);
+        return this;
+    }
     createDefaultGroup() {
         var _a;
         this.createDefaultTabGroup();
         if (((_a = this._currentTabGroup) === null || _a === void 0 ? void 0 : _a.fields.length) === 0) {
-            this.createFieldGroup(EditorDescriptor.defaultGroupName);
+            this.createFieldGroup(EditorDescriptor.defaultGroupName, null);
         }
     }
     createDefaultTabGroup() {
         if (this._tabs.length === 0) {
-            this.createTabGroup(EditorDescriptor.defaultGroupName);
+            this.createTabGroup(EditorDescriptor.defaultGroupName, 'general.general');
         }
     }
 }
@@ -921,10 +911,7 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
         this._className = '';
         this._validators = [];
         this._property = property;
-        this._label = this._editor.model.typeName + '.properties.' + property;
-    }
-    get property() {
-        return this._property;
+        this._label = I18nUtil.getModelPropertyKey(this._editor.model, property);
     }
     get group() {
         return this._group;
@@ -941,6 +928,9 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
     get disabled() {
         return this._disabled;
     }
+    get defaultValue() {
+        return this._defaultValue;
+    }
     get className() {
         return this._className;
     }
@@ -956,6 +946,9 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
     get disabledFunction() {
         return this._disabledFunction;
     }
+    get property() {
+        return this._property;
+    }
     withLabel(label) {
         this._label = label;
         return this;
@@ -975,6 +968,10 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
         }
         return this;
     }
+    withDefaultValue(defaultValue) {
+        this._defaultValue = defaultValue;
+        return this;
+    }
     withClassName(className) {
         this._className = className;
         return this;
@@ -996,6 +993,7 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
         obj._placeholder = this._placeholder;
         obj._required = this._required;
         obj._disabled = this._disabled;
+        obj._defaultValue = this._defaultValue;
         obj._disabledFunction = this._disabledFunction;
         obj._className = this._className;
         obj._getter = this._getter;
@@ -1014,8 +1012,8 @@ class FieldInputDescriptor extends AFieldDescriptor {
     get fieldType() {
         return this._fieldType;
     }
-    get numberStep() {
-        return this._numberStep;
+    get rows() {
+        return this._rows;
     }
     get numberMin() {
         return this._numberMin;
@@ -1023,8 +1021,8 @@ class FieldInputDescriptor extends AFieldDescriptor {
     get numberMax() {
         return this._numberMax;
     }
-    get rows() {
-        return this._rows;
+    get numberStep() {
+        return this._numberStep;
     }
     get numberMinFractionDigits() {
         return this._numberMinFractionDigits;
@@ -1056,6 +1054,15 @@ class FieldInputDescriptor extends AFieldDescriptor {
     get pattern() {
         return this._pattern;
     }
+    get mask() {
+        return this._mask;
+    }
+    get slotChar() {
+        return this._slotChar;
+    }
+    get customComponentName() {
+        return this._customComponentName;
+    }
     asText(minLength, maxLength, pattern, isEmail) {
         this._fieldType = FieldInputDescriptor.TypeEnum.Text;
         this._minLength = minLength;
@@ -1087,9 +1094,19 @@ class FieldInputDescriptor extends AFieldDescriptor {
         this._fieldType = FieldInputDescriptor.TypeEnum.Switch;
         return this;
     }
-    asRadio(options) {
+    asRadio(options, optionsTitlePath) {
+        this._fieldType = FieldInputDescriptor.TypeEnum.Radio;
+        this._radioOptions = options.map(o => ({ value: o, title: `${optionsTitlePath ? `${optionsTitlePath}.` : ''}${o}` }));
+        return this;
+    }
+    asRadioFromEnum(enumType, optionsTitlePath, values, nameAsValue = false) {
         this._fieldType = FieldInputDescriptor.TypeEnum.Radio;
-        this._radioOptions = options;
+        if (typeof optionsTitlePath === 'undefined') {
+            optionsTitlePath = TypeUtil.findEnumName(enumType);
+        }
+        this._radioOptions = Array.isArray(values)
+            ? EnumUtil.fromValuesAsEnumValueArray(enumType, values, nameAsValue, optionsTitlePath !== null && optionsTitlePath !== void 0 ? optionsTitlePath : undefined)
+            : EnumUtil.fromConstantsAsEnumValueArray(enumType, nameAsValue, optionsTitlePath !== null && optionsTitlePath !== void 0 ? optionsTitlePath : undefined);
         return this;
     }
     asDatePicker(format, min, max, showTime) {
@@ -1100,6 +1117,17 @@ class FieldInputDescriptor extends AFieldDescriptor {
         this._datePickerShowTime = showTime !== null && showTime !== void 0 ? showTime : false;
         return this;
     }
+    asMask(mask, slotChar) {
+        this._fieldType = FieldInputDescriptor.TypeEnum.Mask;
+        this._mask = mask;
+        this._slotChar = slotChar;
+        return this;
+    }
+    asCustomComponent(customComponentName) {
+        this._fieldType = FieldInputDescriptor.TypeEnum.Custom;
+        this._customComponentName = customComponentName;
+        return this;
+    }
     copy() {
         const field = new FieldInputDescriptor(this._editor, this._property);
         this.copyFieldsTo(field);
@@ -1110,7 +1138,7 @@ class FieldInputDescriptor extends AFieldDescriptor {
         field._numberStep = this._numberStep;
         field._numberMinFractionDigits = this._numberMinFractionDigits;
         field._numberMaxFractionDigits = this._numberMaxFractionDigits;
-        field._radioOptions = this._radioOptions;
+        field._radioOptions = [...this._radioOptions];
         field._datePickerFormat = this._datePickerFormat;
         field._datePickerMin = this._datePickerMin;
         field._datePickerMax = this._datePickerMax;
@@ -1118,6 +1146,9 @@ class FieldInputDescriptor extends AFieldDescriptor {
         field._maxLength = this._maxLength;
         field._minLength = this._minLength;
         field._pattern = this._pattern;
+        field._mask = this._mask;
+        field._slotChar = this._slotChar;
+        field._customComponentName = this._customComponentName;
         return field;
     }
 }
@@ -1130,6 +1161,8 @@ class FieldInputDescriptor extends AFieldDescriptor {
         TypeEnum[TypeEnum["Switch"] = 3] = "Switch";
         TypeEnum[TypeEnum["Radio"] = 4] = "Radio";
         TypeEnum[TypeEnum["Datepicker"] = 5] = "Datepicker";
+        TypeEnum[TypeEnum["Mask"] = 6] = "Mask";
+        TypeEnum[TypeEnum["Custom"] = 7] = "Custom";
     })(TypeEnum = FieldInputDescriptor.TypeEnum || (FieldInputDescriptor.TypeEnum = {}));
 })(FieldInputDescriptor || (FieldInputDescriptor = {}));
 class FieldLookupDescriptor extends AFieldDescriptor {
@@ -1139,9 +1172,6 @@ class FieldLookupDescriptor extends AFieldDescriptor {
         this._modelType = modelType;
         ModelUtil.trySetLookupItemsProperties(this);
     }
-    get modelType() {
-        return this._modelType;
-    }
     get lookupType() {
         return this._lookupType;
     }
@@ -1157,6 +1187,9 @@ class FieldLookupDescriptor extends AFieldDescriptor {
     get dataProvider() {
         return this._dataProvider;
     }
+    get modelType() {
+        return this._modelType;
+    }
     withItemsLabelProperty(itemsLabelProperty) {
         this._itemsLabelProperty = itemsLabelProperty;
         return this;
@@ -1205,17 +1238,26 @@ class FieldLookupDescriptor extends AFieldDescriptor {
     })(LookupTypeEnum = FieldLookupDescriptor.LookupTypeEnum || (FieldLookupDescriptor.LookupTypeEnum = {}));
 })(FieldLookupDescriptor || (FieldLookupDescriptor = {}));
 class FieldLookupEnumDescriptor extends FieldLookupDescriptor {
-    constructor(editor, property, enumName, options) {
+    constructor(editor, property, enumType, options, nameAsValue = false, optionsTitlePath) {
         super(editor, property, null);
-        this._enumName = enumName;
-        const dataProvider = new LookupDataProvider(null).withEnumName(enumName).withLookup(() => of(options));
+        this._enumType = enumType;
+        if (typeof optionsTitlePath === 'undefined') {
+            optionsTitlePath = TypeUtil.findEnumName(enumType);
+        }
+        const optionEnumValues = Array.isArray(options)
+            ? EnumUtil.fromValuesAsEnumValueArray(enumType, options, nameAsValue, optionsTitlePath !== null && optionsTitlePath !== void 0 ? optionsTitlePath : undefined)
+            : EnumUtil.fromConstantsAsEnumValueArray(enumType, nameAsValue, optionsTitlePath !== null && optionsTitlePath !== void 0 ? optionsTitlePath : undefined);
+        const dataProvider = new LookupDataProvider(null).withLookup(() => of(optionEnumValues));
         this.withLookupDataProvider(dataProvider);
+        this.withItemsLabelProperty('title');
+        this.withItemsValueProperty('value');
+        this.withDataKeyProperty('value');
     }
-    get enumName() {
-        return this._enumName;
+    get enumType() {
+        return this._enumType;
     }
     copy() {
-        const field = new FieldLookupEnumDescriptor(this._editor, this._property, this._enumName, []);
+        const field = new FieldLookupEnumDescriptor(this._editor, this._property, this._enumType, []);
         this.copyFieldsTo(field);
         field._lookupType = this._lookupType;
         field._itemsLabelProperty = this._itemsLabelProperty;
@@ -1239,11 +1281,8 @@ class FieldManyToManyEditorDescriptor extends AFieldDescriptor {
         this._lookupTableDescriptor = lookupTableDescriptor;
         this._actions.push(FieldManyToManyEditorDescriptor.ActionEnum.Add, FieldManyToManyEditorDescriptor.ActionEnum.Delete);
     }
-    get mainTableDescriptor() {
-        return this._mainTableDescriptor;
-    }
-    get lookupTableDescriptor() {
-        return this._lookupTableDescriptor;
+    get fieldType() {
+        return this._fieldType;
     }
     get lookupTableDataProvider() {
         return this._lookupTableDataProvider;
@@ -1251,9 +1290,6 @@ class FieldManyToManyEditorDescriptor extends AFieldDescriptor {
     get actions() {
         return this._actions;
     }
-    get fieldType() {
-        return this._fieldType;
-    }
     get hasLookupExcludeValues() {
         return this._hasLookupExcludeValues;
     }
@@ -1263,6 +1299,12 @@ class FieldManyToManyEditorDescriptor extends AFieldDescriptor {
     get excludeValueProperty() {
         return this._excludeValueProperty;
     }
+    get mainTableDescriptor() {
+        return this._mainTableDescriptor;
+    }
+    get lookupTableDescriptor() {
+        return this._lookupTableDescriptor;
+    }
     withLookup(getAll, serviceType) {
         const dataProvider = new TableviewDataProvider(this._model.type);
         if (serviceType) {
@@ -1318,6 +1360,12 @@ class FieldManyEditorDescriptor extends AFieldDescriptor {
         this._tableviewDescriptor = tableviewDescriptor;
         this._actions.push(FieldManyEditorDescriptor.ActionEnum.Add, FieldManyEditorDescriptor.ActionEnum.Edit, FieldManyEditorDescriptor.ActionEnum.Delete);
     }
+    get fieldType() {
+        return this._fieldType;
+    }
+    get actions() {
+        return this._actions;
+    }
     get tableviewDescriptor() {
         return this._tableviewDescriptor;
     }
@@ -1333,12 +1381,6 @@ class FieldManyEditorDescriptor extends AFieldDescriptor {
     get editorForUpdate() {
         return this._tableviewDescriptor.editEditor;
     }
-    get fieldType() {
-        return this._fieldType;
-    }
-    get actions() {
-        return this._actions;
-    }
     withActions(actions = []) {
         this.actions.push(...actions);
         return this;
@@ -1371,6 +1413,12 @@ class AFieldGroupDescriptor extends AGenericFieldDescriptor {
         this._name = `${this.baseName}${name}`;
         this._default = name === EditorDescriptor.defaultGroupName;
     }
+    get title() {
+        return this._title;
+    }
+    get validators() {
+        return this._validators;
+    }
     get baseName() {
         return `${this.groupName()}_`;
     }
@@ -1380,12 +1428,6 @@ class AFieldGroupDescriptor extends AGenericFieldDescriptor {
     get default() {
         return this._default;
     }
-    get title() {
-        return this._title;
-    }
-    get validators() {
-        return this._validators;
-    }
     withTitle(title) {
         this._title = title;
         return this;
@@ -1498,6 +1540,7 @@ class TableDescriptor {
         this._filterDisplay = TableDescriptor.FilterDisplayEnum.Menu;
         this._paginationMode = TableDescriptor.PaginationModeEnum.Pagination;
         this._columns = [];
+        this._hideHeader = false;
         this._hasDefaultSort = false;
         this._defaultSortProperty = [];
         this._defaultSortAsc = [];
@@ -1505,9 +1548,6 @@ class TableDescriptor {
         this._tableFullHeightOffset = 315;
         this._model = new ModelDescriptor(modelType, idProperty, titleProperty);
     }
-    get model() {
-        return this._model;
-    }
     get filterDisplay() {
         return this._filterDisplay;
     }
@@ -1520,6 +1560,9 @@ class TableDescriptor {
     get title() {
         return this._title;
     }
+    get hideHeader() {
+        return this._hideHeader;
+    }
     get dataKeyProperty() {
         return this._dataKeyProperty;
     }
@@ -1538,6 +1581,9 @@ class TableDescriptor {
     get tableFullHeightOffset() {
         return this._tableFullHeightOffset;
     }
+    get model() {
+        return this._model;
+    }
     addColumnDescriptor(column) {
         this._columns.push(column);
         this.setDataKeyFromColumn();
@@ -1570,6 +1616,13 @@ class TableDescriptor {
         this.setDataKeyFromColumn();
         return column;
     }
+    addColumnEnum(property, enumType, nameAsValue = false, titlePath) {
+        const column = new ColumnDescriptor(this, property);
+        column.asEnum(enumType, nameAsValue, titlePath);
+        this._columns.push(column);
+        this.setDataKeyFromColumn();
+        return column;
+    }
     addColumnObject(property, modelType, displayProperty) {
         const column = new ColumnDescriptor(this, property);
         column.withModelType(modelType);
@@ -1590,6 +1643,10 @@ class TableDescriptor {
         this._title = title;
         return this;
     }
+    withHideHeader(hideHeader = true) {
+        this._hideHeader = hideHeader;
+        return this;
+    }
     withDataKeyProperty(property) {
         this._dataKeyProperty = property;
         return this;
@@ -1608,21 +1665,22 @@ class TableDescriptor {
         this._tableFullHeightOffset = tableFullHeightOffset;
         return this;
     }
-    setDataKeyFromColumn() {
-        if (!this._dataKeyProperty && this._columns.length === 1) {
-            this._dataKeyProperty = this._columns[0].property;
-        }
-    }
     copy() {
         const descriptor = new TableDescriptor(this.model.type, this.model.idPropertyName, this.model.titlePropertyName);
         descriptor._columns = this.columns.map(c => c.copy());
         descriptor._title = this._title;
+        descriptor._hideHeader = this._hideHeader;
         descriptor._dataKeyProperty = this._dataKeyProperty;
         descriptor._defaultSortProperty = this._defaultSortProperty.map(p => p);
         descriptor._defaultSortAsc = this._defaultSortAsc.map(p => p);
         descriptor._filterDisplay = this._filterDisplay;
         return descriptor;
     }
+    setDataKeyFromColumn() {
+        if (!this._dataKeyProperty && this._columns.length === 1) {
+            this._dataKeyProperty = this._columns[0].property;
+        }
+    }
 }
 (function (TableDescriptor) {
     let PaginationModeEnum;
@@ -1641,36 +1699,46 @@ class ColumnDescriptor {
         this._modelType = null;
         this._columnType = ColumnDescriptor.TypeEnum.String;
         this._isSortEnabled = false;
+        this._enumNameAsValue = false;
         this._table = table;
         this._property = property;
     }
-    get table() {
-        return this._table;
-    }
-    get property() {
-        return this._property;
-    }
     get modelType() {
         return this._modelType;
     }
-    get displayPropertyPath() {
-        return this._displayPropertyPath;
+    get columnType() {
+        return this._columnType;
     }
     get title() {
         return this._title;
     }
+    get displayPropertyPath() {
+        return this._displayPropertyPath;
+    }
     get isSortEnabled() {
         return this._isSortEnabled;
     }
-    get columnType() {
-        return this._columnType;
-    }
     get filterDescriptor() {
         return this._filterDescriptor;
     }
     get displayFormat() {
         return this._displayFormat;
     }
+    get table() {
+        return this._table;
+    }
+    get property() {
+        return this._property;
+    }
+    get enumType() {
+        return this._enumType;
+    }
+    get enumTitlePath() {
+        return this._enumTitlePath;
+    }
+    get enumNameAsValue() {
+        return this._enumNameAsValue;
+    }
     asType(type = ColumnDescriptor.TypeEnum.String) {
         this._columnType = type;
         return this;
@@ -1689,6 +1757,16 @@ class ColumnDescriptor {
         this._columnType = ColumnDescriptor.TypeEnum.Boolean;
         return this;
     }
+    asEnum(enumType, nameAsValue = false, titlePath) {
+        this._columnType = ColumnDescriptor.TypeEnum.Enum;
+        this._enumType = enumType;
+        this._enumNameAsValue = nameAsValue;
+        if (typeof titlePath === 'undefined') {
+            titlePath = TypeUtil.findEnumName(enumType);
+        }
+        this._enumTitlePath = titlePath;
+        return this;
+    }
     withModelType(modelType) {
         this._modelType = modelType;
         return this;
@@ -1703,7 +1781,23 @@ class ColumnDescriptor {
     }
     withFilter() {
         this._filterDescriptor = new FilterDescriptor(this._property);
-        this._filterDescriptor.asFilterType(this._columnType);
+        let filterType;
+        switch (this._columnType) {
+            case ColumnDescriptor.TypeEnum.Number:
+                filterType = FilterDescriptor.TypeEnum.Number;
+                break;
+            case ColumnDescriptor.TypeEnum.Boolean:
+                filterType = FilterDescriptor.TypeEnum.Boolean;
+                break;
+            case ColumnDescriptor.TypeEnum.Date:
+                filterType = FilterDescriptor.TypeEnum.Date;
+                break;
+            case ColumnDescriptor.TypeEnum.String:
+            default:
+                filterType = FilterDescriptor.TypeEnum.String;
+                break;
+        }
+        this._filterDescriptor.asFilterType(filterType);
         return this._filterDescriptor;
     }
     withFilterLookup() {
@@ -1711,6 +1805,14 @@ class ColumnDescriptor {
         this._filterDescriptor = filterDescriptor;
         return filterDescriptor;
     }
+    withFilterLookupEnum(options) {
+        if (this._columnType !== ColumnDescriptor.TypeEnum.Enum || !this._enumType) {
+            throw new Error(`Column ${this._property} is not of type enum or enum type is undefined.`);
+        }
+        const filterDescriptor = new FilterLookupEnumDescriptor(this._property, this._enumType, options, this._enumNameAsValue, this._enumTitlePath);
+        this._filterDescriptor = filterDescriptor;
+        return filterDescriptor;
+    }
     withSort(isEnabled = true) {
         this._isSortEnabled = isEnabled;
         return this;
@@ -1733,6 +1835,7 @@ class ColumnDescriptor {
         TypeEnum[TypeEnum["Number"] = 1] = "Number";
         TypeEnum[TypeEnum["Boolean"] = 2] = "Boolean";
         TypeEnum[TypeEnum["Date"] = 3] = "Date";
+        TypeEnum[TypeEnum["Enum"] = 4] = "Enum";
     })(TypeEnum = ColumnDescriptor.TypeEnum || (ColumnDescriptor.TypeEnum = {}));
 })(ColumnDescriptor || (ColumnDescriptor = {}));
 class FilterDescriptor {
@@ -1742,9 +1845,6 @@ class FilterDescriptor {
         this._className = '';
         this._property = property;
     }
-    get property() {
-        return this._property;
-    }
     get filterType() {
         return this._filterType;
     }
@@ -1760,6 +1860,9 @@ class FilterDescriptor {
     get className() {
         return this._className;
     }
+    get property() {
+        return this._property;
+    }
     asFilterType(filterType) {
         this._filterType = filterType;
         return this;
@@ -1784,17 +1887,17 @@ class FilterDescriptor {
         this._matchModes = matchModes;
         return this;
     }
+    copy() {
+        const descriptor = new FilterDescriptor(this._property);
+        this.copyFieldsTo(descriptor);
+        return descriptor;
+    }
     copyFieldsTo(descriptor) {
         descriptor._filterType = this._filterType;
         descriptor._filterProperty = this._filterProperty;
         descriptor._placeholder = this._placeholder;
         descriptor._className = this._className;
     }
-    copy() {
-        const descriptor = new FilterDescriptor(this._property);
-        this.copyFieldsTo(descriptor);
-        return descriptor;
-    }
 }
 (function (FilterDescriptor) {
     let TypeEnum;
@@ -1804,6 +1907,7 @@ class FilterDescriptor {
         TypeEnum[TypeEnum["Boolean"] = 2] = "Boolean";
         TypeEnum[TypeEnum["Date"] = 3] = "Date";
         TypeEnum[TypeEnum["Lookup"] = 4] = "Lookup";
+        TypeEnum[TypeEnum["LookupEnum"] = 5] = "LookupEnum";
     })(TypeEnum = FilterDescriptor.TypeEnum || (FilterDescriptor.TypeEnum = {}));
     let MatchModeEnum;
     (function (MatchModeEnum) {
@@ -1835,12 +1939,12 @@ class FilterLookupDescriptor extends FilterDescriptor {
         this._filterType = FilterDescriptor.TypeEnum.Lookup;
         ModelUtil.trySetLookupItemsProperties(this);
     }
-    get modelType() {
-        return this._modelType;
-    }
     get lookupType() {
         return this._lookupType;
     }
+    get dataProvider() {
+        return this._dataProvider;
+    }
     get itemsLabelProperty() {
         return this._itemsLabelProperty;
     }
@@ -1850,12 +1954,15 @@ class FilterLookupDescriptor extends FilterDescriptor {
     get dataKeyProperty() {
         return this._dataKeyProperty;
     }
-    get dataProvider() {
-        return this._dataProvider;
-    }
     get multiselect() {
         return this._multiselect;
     }
+    get dropdownClassName() {
+        return this._dropdownClassName;
+    }
+    get modelType() {
+        return this._modelType;
+    }
     withItemsLabelProperty(itemsLabelProperty) {
         this._itemsLabelProperty = itemsLabelProperty;
         return this;
@@ -1868,9 +1975,6 @@ class FilterLookupDescriptor extends FilterDescriptor {
         this._dataKeyProperty = dataKeyProperty;
         return this;
     }
-    get dropdownClassName() {
-        return this._dropdownClassName;
-    }
     withLookup(lookup, serviceType) {
         const dataProvider = new LookupDataProvider(this._modelType);
         if (serviceType) {
@@ -1896,6 +2000,11 @@ class FilterLookupDescriptor extends FilterDescriptor {
         this._lookupType = FilterLookupDescriptor.LookupTypeEnum.Autocomplete;
         return this;
     }
+    copy() {
+        const descriptor = new FilterLookupDescriptor(this._property, this._modelType);
+        this.copyFieldsTo(descriptor);
+        return descriptor;
+    }
     copyFieldsTo(descriptor) {
         super.copyFieldsTo(descriptor);
         descriptor._dataProvider = this._dataProvider;
@@ -1904,10 +2013,30 @@ class FilterLookupDescriptor extends FilterDescriptor {
         descriptor._itemsValueProperty = this._itemsValueProperty;
         descriptor._dataKeyProperty = this._dataKeyProperty;
     }
+}
+class FilterLookupEnumDescriptor extends FilterLookupDescriptor {
+    constructor(property, enumType, options, nameAsValue = false, optionsTitlePath) {
+        super(property, null);
+        this._enumType = enumType;
+        if (typeof optionsTitlePath === 'undefined') {
+            optionsTitlePath = TypeUtil.findEnumName(enumType);
+        }
+        const optionEnumValues = Array.isArray(options)
+            ? EnumUtil.fromValuesAsEnumValueArray(enumType, options, nameAsValue, optionsTitlePath !== null && optionsTitlePath !== void 0 ? optionsTitlePath : undefined)
+            : EnumUtil.fromConstantsAsEnumValueArray(enumType, nameAsValue, optionsTitlePath !== null && optionsTitlePath !== void 0 ? optionsTitlePath : undefined);
+        const dataProvider = new LookupDataProvider(null).withLookup(() => of(optionEnumValues));
+        this.withLookupDataProvider(dataProvider);
+        this.withItemsLabelProperty('title');
+        this.withItemsValueProperty('value');
+        this.withDataKeyProperty('value');
+    }
+    get enumType() {
+        return this._enumType;
+    }
     copy() {
-        const descriptor = new FilterLookupDescriptor(this._property, this._modelType);
-        this.copyFieldsTo(descriptor);
-        return descriptor;
+        const field = new FilterLookupEnumDescriptor(this._property, this._enumType, []);
+        this.copyFieldsTo(field);
+        return field;
     }
 }
 (function (FilterLookupDescriptor) {
@@ -1928,9 +2057,6 @@ class TableviewDescriptor {
         this._editEditor = new EditorDescriptor(modelType, idProperty, titleProperty);
         this._tableTitle = `${this._model.typeName}.name`;
     }
-    get model() {
-        return this._model;
-    }
     get table() {
         return this._table;
     }
@@ -1946,6 +2072,9 @@ class TableviewDescriptor {
     get tableTitle() {
         return this._tableTitle;
     }
+    get model() {
+        return this._model;
+    }
     withTableDescriptor(descriptor) {
         this._table = descriptor;
         return this;
@@ -1987,6 +2116,9 @@ class TableviewDescriptor {
     addColumnBoolean(property) {
         return this._table.addColumnBoolean(property);
     }
+    addColumnEnum(property, enumType, nameAsValue = false, titlePath) {
+        return this._table.addColumnEnum(property, enumType, nameAsValue, titlePath);
+    }
     addColumnObject(property, modelType, displayProperty) {
         return this._table.addColumnObject(property, modelType, displayProperty);
     }
@@ -2020,8 +2152,8 @@ class TableviewDescriptor {
         this._editEditor.addFieldDescriptor(field);
         return field;
     }
-    addFieldLookupEnum(property, options) {
-        const field = this._viewEditor.addFieldLookupEnum(property, options);
+    addFieldLookupEnum(property, enumType, options, nameAsValue = false, optionsTitlePath) {
+        const field = this._viewEditor.addFieldLookupEnum(property, enumType, options, nameAsValue, optionsTitlePath);
         this._addEditor.addFieldDescriptor(field);
         this._editEditor.addFieldDescriptor(field);
         return field;
@@ -2159,6 +2291,12 @@ class EditorFormlyUtil {
                 case FieldInputDescriptor.TypeEnum.Datepicker:
                     field.type = 'datepicker';
                     break;
+                case FieldInputDescriptor.TypeEnum.Mask:
+                    field.type = 'mask';
+                    break;
+                case FieldInputDescriptor.TypeEnum.Custom:
+                    field.type = descriptor.customComponentName;
+                    break;
                 default:
                     field.type = 'input';
                     field.templateOptions.minLength = descriptor.minLength;
@@ -2202,6 +2340,9 @@ class EditorFormlyUtil {
         else {
             field.expressionProperties['templateOptions.disabled'] = 'formState.disabled';
         }
+        if (typeof descriptor.defaultValue !== 'undefined') {
+            field.defaultValue = descriptor.defaultValue;
+        }
         for (const validator of descriptor.validators) {
             field.validators[validator.name] = { expression: validator.expression, message: validator.message };
         }
@@ -2209,6 +2350,90 @@ class EditorFormlyUtil {
     }
 }
 
+class EnumUtil {
+    /**
+     * Returns array of names for constants in enum.
+     * @param enumType Enum object.
+     */
+    static getConstantNames(enumType) {
+        return EnumUtil.getConstantNamesFromEnumObject(enumType);
+    }
+    /**
+     * Returns array of names for constants in enum.
+     * @param enumObj Enum object.
+     */
+    static getConstantNamesFromEnumObject(enumObj) {
+        // in number enum, the numbers are also represented in objects and should be filtered out
+        return Object.keys(enumObj).filter(v => isNaN(+v));
+    }
+    /**
+     * Returns array of string values for constants in enum.
+     * @param enumType Enum object.
+     */
+    static getConstantValuesAsString(enumType) {
+        return Object.keys(enumType).map(v => enumType[v]);
+    }
+    /**
+     * Returns array of number values for constants in enum.
+     * @param enumType Enum object.
+     */
+    static getConstantValuesAsNumber(enumType) {
+        return Object.keys(enumType)
+            .filter(v => !isNaN(+v))
+            .map(v => +v);
+    }
+    /**
+     * Returns array of type EnumValue for all constants in enum.
+     * @param enumType Enum object.
+     * @param nameAsValue If use name of constant as value (optional, default: false).
+     * @param titlePath Base path for title to use as translation (optional).
+     */
+    static fromConstantsAsEnumValueArray(enumType, nameAsValue = false, titlePath) {
+        return EnumUtil.getConstantNames(enumType).map(n => ({ name: n, title: `${titlePath ? `${titlePath}.` : ''}${n}`, value: nameAsValue ? n : enumType[n] }));
+    }
+    /**
+     * Returns array of type EnumValue for provided values in enum.
+     * @param enumType Enum object.
+     * @param nameAsValue If use name of constant as value (optional, default: false).
+     * @param titlePath Base path for title to use as translation (optional).
+     */
+    static fromValuesAsEnumValueArray(enumType, values, nameAsValue = false, titlePath) {
+        return values.map(v => {
+            const k = EnumUtil.getConstantName(enumType, v);
+            return { name: k, title: `${titlePath ? `${titlePath}.` : ''}${k}`, value: nameAsValue ? k : v };
+        });
+    }
+    /**
+     * Gets constant name for value.
+     * @param enumType Enum object.
+     * @param value Value of enum constant.
+     */
+    static getConstantName(enumType, value) {
+        var _a;
+        if (typeof value === 'string') {
+            return (_a = this.getConstantNames(enumType).find(c => enumType[c] === value)) !== null && _a !== void 0 ? _a : null;
+        }
+        else {
+            return typeof enumType[value] !== 'undefined' ? enumType[value] : null;
+        }
+    }
+    /**
+     * Gets constant name for value.
+     * @param enumObj Enum object.
+     * @param value Value of enum constant.
+     */
+    static getConstantNameFromEnumObject(enumObj, value) {
+        var _a;
+        const enumObjAny = enumObj;
+        if (typeof value === 'string') {
+            return (_a = this.getConstantNamesFromEnumObject(enumObj).find(c => enumObjAny[c] === value)) !== null && _a !== void 0 ? _a : null;
+        }
+        else {
+            return typeof enumObjAny[value] !== 'undefined' ? enumObjAny[value] : null;
+        }
+    }
+}
+
 class I18nUtil {
     static instantModelTranslation(translate, model, keyPath, customKey, item, fallbackKey, i18nParams) {
         const keys = I18nUtil.getModelKeysByPriority(model, keyPath, customKey, fallbackKey);
@@ -2216,6 +2441,15 @@ class I18nUtil {
         const i18n = translate.instant(keys, I18nUtil.getModelI18nParams(model, item, i18nModelName !== null && i18nModelName !== void 0 ? i18nModelName : undefined, i18nParams));
         return I18nUtil.selectKeyByPriority(keys, i18n);
     }
+    static getModelTabKey(model, tab) {
+        return I18nUtil.getModelKeyPath(model, `tabs.${tab}`);
+    }
+    static getModelGroupKey(model, group) {
+        return I18nUtil.getModelKeyPath(model, `groups.${group}`);
+    }
+    static getModelPropertyKey(model, property) {
+        return I18nUtil.getModelKeyPath(model, `properties.${property}`);
+    }
     static instantActionTranslation(translate, action, keyPath, customKey, item, fallbackKey, functionNameKey, i18nParams) {
         const keys = I18nUtil.getActionKeysByPriority(action, keyPath, customKey, fallbackKey);
         const i18nModelName = I18nUtil.instantModelName(translate, action === null || action === void 0 ? void 0 : action.model, true);
@@ -2230,31 +2464,6 @@ class I18nUtil {
         const keys = I18nUtil.getActionKeysByPriority(action, keyPath, customKey, fallbackKey);
         return I18nUtil.getModelName(translate, action === null || action === void 0 ? void 0 : action.model, oneTime, true).pipe(mergeMap(i18nModelName => translate.get(keys, I18nUtil.getActionI18nParams(action, item, i18nModelName !== null && i18nModelName !== void 0 ? i18nModelName : undefined))), map(i18n => I18nUtil.selectKeyByPriority(keys, i18n)));
     }
-    static getModelKeysByPriority(model, keyPath, customKey, fallbackKey) {
-        const keys = [];
-        if (customKey) {
-            keys.push(customKey);
-        }
-        const modelActionKey = `${model.typeName}.${keyPath}`;
-        keys.push(modelActionKey);
-        if (fallbackKey) {
-            keys.push(fallbackKey);
-        }
-        return keys;
-    }
-    static getActionKeysByPriority(action, keyPath, customKey, fallbackKey) {
-        const keys = [];
-        if (customKey) {
-            keys.push(customKey);
-        }
-        const modelActionKey = `${action.i18nModelActionBaseKey}.${keyPath}`;
-        const actionKey = `${action.actionName}.${keyPath}`;
-        keys.push(modelActionKey, actionKey);
-        if (fallbackKey) {
-            keys.push(fallbackKey);
-        }
-        return keys;
-    }
     static getModelI18nParams(model, item, i18nModelName, i18nParameters = {}) {
         i18nParameters.itemId = '';
         i18nParameters.itemTitle = '';
@@ -2311,6 +2520,34 @@ class I18nUtil {
         keys.push(`${model === null || model === void 0 ? void 0 : model.typeName}.name`);
         return keys;
     }
+    static getModelKeysByPriority(model, keyPath, customKey, fallbackKey) {
+        const keys = [];
+        if (customKey) {
+            keys.push(customKey);
+        }
+        const modelActionKey = I18nUtil.getModelKeyPath(model, keyPath);
+        keys.push(modelActionKey);
+        if (fallbackKey) {
+            keys.push(fallbackKey);
+        }
+        return keys;
+    }
+    static getModelKeyPath(model, keyPath) {
+        return `${model.typeName}.${keyPath}`;
+    }
+    static getActionKeysByPriority(action, keyPath, customKey, fallbackKey) {
+        const keys = [];
+        if (customKey) {
+            keys.push(customKey);
+        }
+        const modelActionKey = `${action.i18nModelActionBaseKey}.${keyPath}`;
+        const actionKey = `${action.actionName}.${keyPath}`;
+        keys.push(modelActionKey, actionKey);
+        if (fallbackKey) {
+            keys.push(fallbackKey);
+        }
+        return keys;
+    }
     static selectKeyByPriority(keys, i18n) {
         for (const key of keys) {
             if (key !== i18n[key]) {
@@ -2440,8 +2677,19 @@ function TypeName(typeName) {
         target[typeNameDecoratorPropertyName] = typeName;
     };
 }
+const enumNameDecoratorPropertyName = 'enumName';
+function EnumName(typeName) {
+    return function (target) {
+        target[enumNameDecoratorPropertyName] = typeName;
+    };
+}
 
 class TypeUtil {
+    /**
+     * Defines type name decorator.
+     * @param targetType class.
+     * @param typeName Name of the type.
+     */
     static defineReflectTypeName(targetType, typeName) {
         if (!typeName) {
             typeName = TypeUtil.getDecoratorTypeName(targetType);
@@ -2454,6 +2702,16 @@ class TypeUtil {
             Reflect.defineMetadata(typeNameDecoratorPropertyName, typeName, targetType);
         }
     }
+    /**
+     * Defines enum name decorator.
+     * @param targetType enum object.
+     * @param enumName Name of the enum.
+     */
+    static defineReflectEnumName(targetType, enumName) {
+        if (!Reflect.hasOwnMetadata(enumNameDecoratorPropertyName, targetType)) {
+            Reflect.defineMetadata(enumNameDecoratorPropertyName, enumName, targetType);
+        }
+    }
     /**
      * Gets type name from either decorator or reflect metadata.
      * @param type Class.
@@ -2469,6 +2727,21 @@ class TypeUtil {
         }
         return type.name;
     }
+    /**
+     * Gets enum name from either decorator or reflect metadata.
+     * @param enumType Class.
+     */
+    static findEnumName(enumType) {
+        let decoratorName = TypeUtil.getDecoratorEnumName(enumType);
+        if (decoratorName) {
+            return decoratorName;
+        }
+        decoratorName = Reflect.getMetadata(enumNameDecoratorPropertyName, enumType);
+        if (decoratorName) {
+            return decoratorName;
+        }
+        throw new Error('Could not fined enum name');
+    }
     /**
      * Get value from decorator defined property name
      * @param type Class.
@@ -2477,6 +2750,13 @@ class TypeUtil {
     static getDecoratorTypeName(type) {
         return type[typeNameDecoratorPropertyName];
     }
+    /**
+     * Get value from decorator defined property name
+     * @param type Enum object.
+     */
+    static getDecoratorEnumName(type) {
+        return type[enumNameDecoratorPropertyName];
+    }
 }
 
 class ObjectSerializer {
@@ -2560,12 +2840,17 @@ class ObjectSerializer {
     }
     registerEnums(enums) {
         for (const key in enums) {
-            if (typeof this._enumMap[key] !== 'undefined') {
-                console.warn(`Registering enum ${key} skipped, because enum already exists.`);
-            }
-            else {
-                this._enumMap[key] = enums[key];
-            }
+            this.registerEnum(enums[key], key);
+        }
+    }
+    registerEnum(enumType, enumName) {
+        // try to find name from decorator
+        if (typeof this._enumMap[enumName] !== 'undefined') {
+            console.warn(`Registering enum ${enumName} skipped, because enum already exists.`);
+        }
+        else {
+            TypeUtil.defineReflectEnumName(enumType, enumName);
+            this._enumMap[enumName] = enumType;
         }
     }
     findCorrectType(data, expectedType) {
@@ -4193,10 +4478,9 @@ class MngDropdownComponent {
         }
     }
     writeValue(obj) {
+        var _a;
         this.dropdownFormControl.setValue(obj, { emitEvent: false });
-        if (this.primeDropdown) {
-            this.primeDropdown.writeValue(obj);
-        }
+        (_a = this.primeDropdown) === null || _a === void 0 ? void 0 : _a.writeValue(obj);
     }
 }
 MngDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngDropdownComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
@@ -4390,10 +4674,10 @@ class MngFormlyFieldInputComponent extends FieldType {
     }
 }
 MngFormlyFieldInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngFormlyFieldInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MngFormlyFieldInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", 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        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\"> </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 category of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"p-field-radiobutton\">\n            <p-radioButton [name]=\"$any(key)\" [value]=\"category\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\"></p-radioButton>\n            <label [for]=\"category\" class=\"mng-radio-button-label\">{{ category }}</label>\n        </div>\n    </ng-container>\n\n    <textarea *ngSwitchCase=\"'textarea'\" [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [rows]=\"descriptor.rows ?? 3\" pInputTextarea> </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"$any(descriptor.datePickerFormat)\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showIcon]=\"true\">\n    </p-calendar>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", components: [{ type: i1$3.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$5.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabelledBy"], outputs: ["onChange"] }, { type: i3.ɵ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.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"] }], directives: [{ type: i4$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i4$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$3.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: i8$1.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { type: i4$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i9$1.InputText, selector: "[pInputText]" }], pipes: { "translate": i2$2.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngFormlyFieldInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", 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        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\"></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 [name]=\"$any(key)\" [value]=\"option.value\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\"></p-radioButton>\n            <label [for]=\"option.value\" class=\"mng-radio-button-label\">{{ option.title | translate }}</label>\n        </div>\n    </ng-container>\n\n    <textarea *ngSwitchCase=\"'textarea'\" [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [rows]=\"descriptor.rows ?? 3\" pInputTextarea> </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"$any(descriptor.datePickerFormat)\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showIcon]=\"true\">\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    </p-inputMask>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", components: [{ type: i1$3.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$5.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabelledBy"], outputs: ["onChange"] }, { type: i3.ɵ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.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"] }], directives: [{ type: i4$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i4$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$3.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: i9$1.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { type: i4$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i10$1.InputText, selector: "[pInputText]" }], pipes: { "translate": i2$2.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", 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        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\"> </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 category of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"p-field-radiobutton\">\n            <p-radioButton [name]=\"$any(key)\" [value]=\"category\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\"></p-radioButton>\n            <label [for]=\"category\" class=\"mng-radio-button-label\">{{ category }}</label>\n        </div>\n    </ng-container>\n\n    <textarea *ngSwitchCase=\"'textarea'\" [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [rows]=\"descriptor.rows ?? 3\" pInputTextarea> </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"$any(descriptor.datePickerFormat)\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showIcon]=\"true\">\n    </p-calendar>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n" }]
+            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        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"flex flex-column\">\n        <label [for]=\"key\">{{ to?.label! | translate }} <span *ngIf=\"to.required && to['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\"></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 [name]=\"$any(key)\" [value]=\"option.value\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\"></p-radioButton>\n            <label [for]=\"option.value\" class=\"mng-radio-button-label\">{{ option.title | translate }}</label>\n        </div>\n    </ng-container>\n\n    <textarea *ngSwitchCase=\"'textarea'\" [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [rows]=\"descriptor.rows ?? 3\" pInputTextarea> </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"$any(descriptor.datePickerFormat)\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showIcon]=\"true\">\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    </p-inputMask>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"to.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n" }]
         }] });
 
 class MngFormlyFieldDropdownComponent extends FieldType {
@@ -4403,10 +4687,10 @@ class MngFormlyFieldDropdownComponent extends FieldType {
     }
 }
 MngFormlyFieldDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngFormlyFieldDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MngFormlyFieldDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngFormlyFieldDropdownComponent, selector: "mng-formly-field-dropdown", usesInheritance: true, ngImport: i0, template: "<mng-dropdown\n    [id]=\"$any(key)\"\n    [formControl]=\"dFormControl\"\n    [formlyAttributes]=\"field\"\n    [placeholder]=\"$any(descriptor.placeholder)\"\n    [itemsLabelProperty]=\"$any(descriptor.itemsLabelProperty)\"\n    [itemsValueProperty]=\"$any(descriptor.itemsValueProperty)\"\n    [showClear]=\"!this.to.required\"\n    [dataKeyProperty]=\"$any(descriptor.dataKeyProperty)\">\n</mng-dropdown>\n", components: [{ type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsValueProperty", "multiselect", "placeholder", "showClear", "className", "dropdownClassName"], outputs: ["valueChange"] }], directives: [{ type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngFormlyFieldDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngFormlyFieldDropdownComponent, selector: "mng-formly-field-dropdown", usesInheritance: true, ngImport: i0, template: "<mng-dropdown\n    [id]=\"$any(key)\"\n    [formControl]=\"dFormControl\"\n    [formlyAttributes]=\"field\"\n    [placeholder]=\"$any(descriptor.placeholder)\"\n    [dataProvider]=\"descriptor.dataProvider\"\n    [itemsLabelProperty]=\"$any(descriptor.itemsLabelProperty)\"\n    [itemsValueProperty]=\"$any(descriptor.itemsValueProperty)\"\n    [showClear]=\"!this.to.required\"\n    [dataKeyProperty]=\"$any(descriptor.dataKeyProperty)\">\n</mng-dropdown>\n", components: [{ type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsValueProperty", "multiselect", "placeholder", "showClear", "className", "dropdownClassName"], outputs: ["valueChange"] }], directives: [{ type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngFormlyFieldDropdownComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-formly-field-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-dropdown\n    [id]=\"$any(key)\"\n    [formControl]=\"dFormControl\"\n    [formlyAttributes]=\"field\"\n    [placeholder]=\"$any(descriptor.placeholder)\"\n    [itemsLabelProperty]=\"$any(descriptor.itemsLabelProperty)\"\n    [itemsValueProperty]=\"$any(descriptor.itemsValueProperty)\"\n    [showClear]=\"!this.to.required\"\n    [dataKeyProperty]=\"$any(descriptor.dataKeyProperty)\">\n</mng-dropdown>\n" }]
+            args: [{ selector: 'mng-formly-field-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-dropdown\n    [id]=\"$any(key)\"\n    [formControl]=\"dFormControl\"\n    [formlyAttributes]=\"field\"\n    [placeholder]=\"$any(descriptor.placeholder)\"\n    [dataProvider]=\"descriptor.dataProvider\"\n    [itemsLabelProperty]=\"$any(descriptor.itemsLabelProperty)\"\n    [itemsValueProperty]=\"$any(descriptor.itemsValueProperty)\"\n    [showClear]=\"!this.to.required\"\n    [dataKeyProperty]=\"$any(descriptor.dataKeyProperty)\">\n</mng-dropdown>\n" }]
         }] });
 
 class MngTableLoadEvent {
@@ -4491,10 +4775,10 @@ class MngTableColumnFilterComponent {
     }
 }
 MngTableColumnFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngTableColumnFilterComponent, deps: [{ token: i2$1.PrimeNGConfig }], target: i0.ɵɵFactoryTarget.Component });
-MngTableColumnFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", 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    <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                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\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                [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                [showClear]=\"true\"\n                (change)=\"filterCallback($event)\">\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: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "multiselect", "placeholder", "className", "dropdownClassName"], outputs: ["valueChange"] }, { type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsValueProperty", "multiselect", "placeholder", "showClear", "className", "dropdownClassName"], outputs: ["valueChange"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i4$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i4$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i2$2.TranslatePipe } });
+MngTableColumnFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", 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    <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                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\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                [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                [showClear]=\"true\"\n                (valueChange)=\"filterCallback($event)\">\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: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "multiselect", "placeholder", "className", "dropdownClassName"], outputs: ["valueChange"] }, { type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsValueProperty", "multiselect", "placeholder", "showClear", "className", "dropdownClassName"], outputs: ["valueChange"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i4$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i4$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i2$2.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", 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    <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                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\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                [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                [showClear]=\"true\"\n                (change)=\"filterCallback($event)\">\n            </mng-dropdown>\n        </ng-container>\n    </ng-template>\n</p-columnFilter>\n" }]
+            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    <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                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\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                [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                [showClear]=\"true\"\n                (valueChange)=\"filterCallback($event)\">\n            </mng-dropdown>\n        </ng-container>\n    </ng-template>\n</p-columnFilter>\n" }]
         }], ctorParameters: function () { return [{ type: i2$1.PrimeNGConfig }]; }, propDecorators: { descriptor: [{
                 type: Input
             }], display: [{
@@ -4561,6 +4845,7 @@ class MngTableColumnValueComponent {
         this.columnTypeNumber = ColumnDescriptor.TypeEnum.Number;
         this.columnTypeBoolean = ColumnDescriptor.TypeEnum.Boolean;
         this.columnTypeDate = ColumnDescriptor.TypeEnum.Date;
+        this.columnTypeEnum = ColumnDescriptor.TypeEnum.Enum;
     }
 }
 MngTableColumnValueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngTableColumnValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
@@ -4574,6 +4859,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImpor
                 type: Input
             }] } });
 
+class MngI18nPropertyPipe {
+    transform(property, model) {
+        return I18nUtil.getModelPropertyKey(model, property);
+    }
+}
+MngI18nPropertyPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngI18nPropertyPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+MngI18nPropertyPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngI18nPropertyPipe, name: "i18nProperty" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngI18nPropertyPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'i18nProperty',
+                    pure: true
+                }]
+        }] });
+
 var TypeEnum = FilterDescriptor.TypeEnum;
 var PaginationModeEnum = TableDescriptor.PaginationModeEnum;
 class MngTableComponent {
@@ -4827,10 +5127,10 @@ class MngTableComponent {
     }
 }
 MngTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngTableComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i2$2.TranslateService }, { token: TableviewComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MngTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngTableComponent, selector: "mng-table", inputs: { descriptor: "descriptor", items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionEnabled: "selectionEnabled" }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }], ngImport: i0, template: "<div [style.height]=\"scrollHeight === 'flex' ? 'calc(100vh - ' + descriptor.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\"\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        [rowHover]=\"true\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\"\n        sortMode=\"multiple\"\n        responsiveLayout=\"scroll\">\n        <ng-template *ngIf=\"captionTemplate || descriptor.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else defaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #defaultCaption>\n                <h5 class=\"p-m-0\">{{ descriptor.title }}</h5>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr>\n                <th *ngIf=\"selectionEnabled\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <ng-container *ngFor=\"let col of descriptor.columns\">\n                    <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\">\n                        <div class=\"flex justify-content-between align-items-center\">\n                            {{ descriptor.model.typeName + '.properties.' + col.property | 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                        {{ descriptor.model.typeName + '.properties.' + col.property | 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=\"columnActionTemplate\"></th>\n            </tr>\n            <tr *ngIf=\"descriptor.filterDisplay === filterDisplayRow\">\n                <th *ngFor=\"let col of descriptor.columns\">\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=\"columnActionTemplate\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr [style.height.px]=\"descriptor.rowHeight\">\n                <td *ngIf=\"selectionEnabled\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngFor=\"let col of descriptor.columns\" (click)=\"onCellClick(col, item, idx)\" class=\"clickable\">\n                    <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n                </td>\n                <td *ngIf=\"columnActionTemplate\" class=\"text-right\">\n                    <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"descriptor.rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (columnActionTemplate ? 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 + (columnActionTemplate ? 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: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { type: i7.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i4$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$4.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { type: i4$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "async": i4$1.AsyncPipe, "translate": i2$2.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngTableComponent, selector: "mng-table", inputs: { descriptor: "descriptor", items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionEnabled: "selectionEnabled" }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }], ngImport: i0, template: "<div [style.height]=\"scrollHeight === 'flex' ? 'calc(100vh - ' + descriptor.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\"\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        [rowHover]=\"true\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\"\n        sortMode=\"multiple\"\n        responsiveLayout=\"scroll\">\n        <ng-template *ngIf=\"captionTemplate || descriptor.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else defaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #defaultCaption>\n                <h5 class=\"p-m-0\">{{ descriptor.title }}</h5>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr *ngIf=\"!descriptor.hideHeader\">\n                <th *ngIf=\"selectionEnabled\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <ng-container *ngFor=\"let col of descriptor.columns\">\n                    <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\">\n                        <div class=\"flex justify-content-between align-items-center\">\n                            {{ 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.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=\"columnActionTemplate\"></th>\n            </tr>\n            <tr *ngIf=\"descriptor.filterDisplay === filterDisplayRow\">\n                <th *ngFor=\"let col of descriptor.columns\">\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=\"columnActionTemplate\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr [style.height.px]=\"descriptor.rowHeight\">\n                <td *ngIf=\"selectionEnabled\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngFor=\"let col of descriptor.columns\" (click)=\"onCellClick(col, item, idx)\" class=\"clickable\">\n                    <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n                </td>\n                <td *ngIf=\"columnActionTemplate\" class=\"text-right\">\n                    <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"descriptor.rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (columnActionTemplate ? 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 + (columnActionTemplate ? 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: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { type: i7.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i4$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$4.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { type: i4$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "async": i4$1.AsyncPipe, "translate": i2$2.TranslatePipe, "i18nProperty": MngI18nPropertyPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.height]=\"scrollHeight === 'flex' ? 'calc(100vh - ' + descriptor.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\"\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        [rowHover]=\"true\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\"\n        sortMode=\"multiple\"\n        responsiveLayout=\"scroll\">\n        <ng-template *ngIf=\"captionTemplate || descriptor.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else defaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #defaultCaption>\n                <h5 class=\"p-m-0\">{{ descriptor.title }}</h5>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr>\n                <th *ngIf=\"selectionEnabled\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <ng-container *ngFor=\"let col of descriptor.columns\">\n                    <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\">\n                        <div class=\"flex justify-content-between align-items-center\">\n                            {{ descriptor.model.typeName + '.properties.' + col.property | 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                        {{ descriptor.model.typeName + '.properties.' + col.property | 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=\"columnActionTemplate\"></th>\n            </tr>\n            <tr *ngIf=\"descriptor.filterDisplay === filterDisplayRow\">\n                <th *ngFor=\"let col of descriptor.columns\">\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=\"columnActionTemplate\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr [style.height.px]=\"descriptor.rowHeight\">\n                <td *ngIf=\"selectionEnabled\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngFor=\"let col of descriptor.columns\" (click)=\"onCellClick(col, item, idx)\" class=\"clickable\">\n                    <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n                </td>\n                <td *ngIf=\"columnActionTemplate\" class=\"text-right\">\n                    <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"descriptor.rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (columnActionTemplate ? 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 + (columnActionTemplate ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    {{ 'mngTable.noItems' | translate }}\n                </td>\n            </tr>\n        </ng-template>\n    </p-table>\n</div>\n" }]
+            args: [{ selector: 'mng-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.height]=\"scrollHeight === 'flex' ? 'calc(100vh - ' + descriptor.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\"\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        [rowHover]=\"true\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\"\n        sortMode=\"multiple\"\n        responsiveLayout=\"scroll\">\n        <ng-template *ngIf=\"captionTemplate || descriptor.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else defaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #defaultCaption>\n                <h5 class=\"p-m-0\">{{ descriptor.title }}</h5>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr *ngIf=\"!descriptor.hideHeader\">\n                <th *ngIf=\"selectionEnabled\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <ng-container *ngFor=\"let col of descriptor.columns\">\n                    <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\">\n                        <div class=\"flex justify-content-between align-items-center\">\n                            {{ 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.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=\"columnActionTemplate\"></th>\n            </tr>\n            <tr *ngIf=\"descriptor.filterDisplay === filterDisplayRow\">\n                <th *ngFor=\"let col of descriptor.columns\">\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=\"columnActionTemplate\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr [style.height.px]=\"descriptor.rowHeight\">\n                <td *ngIf=\"selectionEnabled\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngFor=\"let col of descriptor.columns\" (click)=\"onCellClick(col, item, idx)\" class=\"clickable\">\n                    <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n                </td>\n                <td *ngIf=\"columnActionTemplate\" class=\"text-right\">\n                    <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"descriptor.rowHeight\">\n                <td [attr.colspan]=\"descriptor.columns.length + (columnActionTemplate ? 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 + (columnActionTemplate ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    {{ 'mngTable.noItems' | translate }}\n                </td>\n            </tr>\n        </ng-template>\n    </p-table>\n</div>\n" }]
         }], ctorParameters: function () {
         return [{ type: i0.Injector }, { type: i1.Router }, { type: i1.ActivatedRoute }, { type: i2$2.TranslateService }, { type: TableviewComponentService, decorators: [{
                         type: Optional
@@ -5075,10 +5375,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImpor
 class MngFormlyFieldTabsComponent extends FieldType {
 }
 MngFormlyFieldTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngFormlyFieldTabsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MngFormlyFieldTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngFormlyFieldTabsComponent, selector: "mng-formly-field-tabs", usesInheritance: true, ngImport: i0, template: "<p-tabView>\n    <p-tabPanel\n        *ngFor=\"let tab of field.fieldGroup; let i = index; let last = last\"\n        [header]=\"tab.templateOptions?.label!\"\n        [headerStyleClass]=\"$any(formControl!.valid ? 'p-tabview-title' : null)\">\n        <ng-template pTemplate=\"header\">\n            <span\n                class=\"p-tabview-title\"\n                [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.templateOptions?.label!) + '_invalid']\"\n                >{{ tab.templateOptions?.label! | translate }}</span\n            >\n        </ng-template>\n        <formly-field [field]=\"tab\"></formly-field>\n    </p-tabPanel>\n</p-tabView>\n", components: [{ type: i1$4.TabView, selector: "p-tabView", inputs: ["orientation", "style", "styleClass", "controlClose", "scrollable", "activeIndex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { type: i1$4.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { type: i3.FormlyField, selector: "formly-field", inputs: ["field"] }], directives: [{ type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }], pipes: { "translate": i2$2.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MngFormlyFieldTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngFormlyFieldTabsComponent, selector: "mng-formly-field-tabs", usesInheritance: true, ngImport: i0, template: "<p-tabView>\n    <p-tabPanel\n        *ngFor=\"let tab of field.fieldGroup; let i = index; let last = last\"\n        [header]=\"tab.templateOptions?.label! | translate\"\n        [headerStyleClass]=\"$any(formControl!.valid ? 'p-tabview-title' : null)\">\n        <ng-template pTemplate=\"header\">\n            <span\n                class=\"p-tabview-title\"\n                [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.templateOptions?.label!) + '_invalid']\"\n                >{{ tab.templateOptions?.label! | translate }}</span\n            >\n        </ng-template>\n        <formly-field [field]=\"tab\"></formly-field>\n    </p-tabPanel>\n</p-tabView>\n", components: [{ type: i1$4.TabView, selector: "p-tabView", inputs: ["orientation", "style", "styleClass", "controlClose", "scrollable", "activeIndex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { type: i1$4.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { type: i3.FormlyField, selector: "formly-field", inputs: ["field"] }], directives: [{ type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }], pipes: { "translate": i2$2.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngFormlyFieldTabsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mng-formly-field-tabs', changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-tabView>\n    <p-tabPanel\n        *ngFor=\"let tab of field.fieldGroup; let i = index; let last = last\"\n        [header]=\"tab.templateOptions?.label!\"\n        [headerStyleClass]=\"$any(formControl!.valid ? 'p-tabview-title' : null)\">\n        <ng-template pTemplate=\"header\">\n            <span\n                class=\"p-tabview-title\"\n                [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.templateOptions?.label!) + '_invalid']\"\n                >{{ tab.templateOptions?.label! | translate }}</span\n            >\n        </ng-template>\n        <formly-field [field]=\"tab\"></formly-field>\n    </p-tabPanel>\n</p-tabView>\n" }]
+            args: [{ selector: 'mng-formly-field-tabs', changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-tabView>\n    <p-tabPanel\n        *ngFor=\"let tab of field.fieldGroup; let i = index; let last = last\"\n        [header]=\"tab.templateOptions?.label! | translate\"\n        [headerStyleClass]=\"$any(formControl!.valid ? 'p-tabview-title' : null)\">\n        <ng-template pTemplate=\"header\">\n            <span\n                class=\"p-tabview-title\"\n                [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.templateOptions?.label!) + '_invalid']\"\n                >{{ tab.templateOptions?.label! | translate }}</span\n            >\n        </ng-template>\n        <formly-field [field]=\"tab\"></formly-field>\n    </p-tabPanel>\n</p-tabView>\n" }]
         }] });
 
 class MngFormlyFieldFieldsetComponent extends FieldType {
@@ -5322,8 +5622,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImpor
         }], ctorParameters: function () { return [{ type: MngCommonsService }]; } });
 
 class MngMenuItemComponent {
-    constructor(router, mngCommons, mainLayoutService) {
+    constructor(injector, router, route, mngCommons, mainLayoutService) {
+        this.injector = injector;
         this.router = router;
+        this.route = route;
         this.mngCommons = mngCommons;
         this.mainLayoutService = mainLayoutService;
         this.index = 0;
@@ -5332,6 +5634,8 @@ class MngMenuItemComponent {
         this.key = '';
         this.active = false;
         this.hover = false;
+        this.isAllowedSubject = new BehaviorSubject(true);
+        this.isAllowed$ = this.isAllowedSubject.asObservable().pipe(distinctUntilChanged());
     }
     ngOnInit() {
         if (!this.mngCommons.menuModeIsSlim && this.item.routerLink) {
@@ -5355,14 +5659,20 @@ class MngMenuItemComponent {
         this.menuResetSubscription = this.mngCommons.menuReset$.subscribe(() => {
             this.active = false;
         });
-        this.routerEventsSubscription = this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe(() => {
-            if (this.mngCommons.menuModeIsSlim && !this.mainLayoutService.isMobile()) {
-                this.active = false;
+        this.routerEventsSubscription = this.router.events.subscribe(next => {
+            if (next instanceof GuardsCheckEnd && next.shouldActivate) {
+                this.checkIfMenuItemIsAllowedFromGuard(next.state);
             }
-            else {
-                this.updateActiveStateFromRoute();
+            else if (next instanceof NavigationEnd) {
+                if (this.mngCommons.menuModeIsSlim && !this.mainLayoutService.isMobile()) {
+                    this.active = false;
+                }
+                else {
+                    this.updateActiveStateFromRoute();
+                }
             }
         });
+        this.checkIfMenuItemIsAllowedFromGuard(this.router.routerState.snapshot);
     }
     updateActiveStateFromRoute() {
         if (this.itemUrl) {
@@ -5384,10 +5694,6 @@ class MngMenuItemComponent {
         }
         // notify other items
         this.mngCommons.menuChangeActiveKey(this.key);
-        // execute command
-        if (this.item.command) {
-            this.item.command({ originalEvent: event, item: this.item });
-        }
         // toggle active state
         if (this.item.items) {
             this.active = !this.active;
@@ -5416,14 +5722,50 @@ class MngMenuItemComponent {
         }
     }
     ngOnDestroy() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d;
         (_a = this.menuSourceSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
         (_b = this.menuResetSubscription) === null || _b === void 0 ? void 0 : _b.unsubscribe();
         (_c = this.routerEventsSubscription) === null || _c === void 0 ? void 0 : _c.unsubscribe();
+        (_d = this.guardsSubscription) === null || _d === void 0 ? void 0 : _d.unsubscribe();
+    }
+    checkIfMenuItemIsAllowedFromGuard(routerState) {
+        var _a, _b;
+        (_a = this.guardsSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
+        if ((_b = this.item.guards) === null || _b === void 0 ? void 0 : _b.length) {
+            const obs = [];
+            for (const guard of this.item.guards) {
+                const tokenInjectedInstance = this.injector.get(guard);
+                if (tokenInjectedInstance && 'canActivate' in tokenInjectedInstance) {
+                    const guardInstance = tokenInjectedInstance;
+                    const canActivateRes = guardInstance.canActivate(this.route.snapshot, routerState);
+                    let canActivateObs;
+                    if (canActivateRes instanceof Observable) {
+                        canActivateObs = canActivateRes;
+                    }
+                    else if (canActivateRes instanceof Promise) {
+                        canActivateObs = from(canActivateRes);
+                    }
+                    else {
+                        canActivateObs = of(canActivateRes);
+                    }
+                    obs.push(canActivateObs.pipe(first(), map(res => res === true) // if url tree is present, that means redirect and implies not allowed
+                    ));
+                }
+            }
+            this.guardsSubscription = combineLatest(obs)
+                .pipe(first())
+                .subscribe(next => {
+                const result = next.every(n => n === true);
+                this.isAllowedSubject.next(result);
+            });
+        }
+        else {
+            this.isAllowedSubject.next(true);
+        }
     }
 }
-MngMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngMenuItemComponent, deps: [{ token: i1.Router }, { token: MngCommonsService }, { token: MngMainLayoutComponentService }], target: i0.ɵɵFactoryTarget.Component });
-MngMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: { item: "item", index: "index", root: "root", parentKey: "parentKey" }, host: { properties: { "class.layout-root-menuitem": "root", "class.active-menuitem": "active" } }, ngImport: i0, template: "<ng-container>\n    <div *ngIf=\"root && item.visible !== false\" class=\"layout-menuitem-root-text\">{{ item.label | translate }}</div>\n    <a\n        *ngIf=\"(!item.routerLink || item.items) && item.visible !== false\"\n        [attr.href]=\"item.url\"\n        (click)=\"itemClick($event)\"\n        (mouseenter)=\"onMouseEnter()\"\n        (keydown.enter)=\"itemClick($event)\"\n        [routerLink]=\"item.routerLink\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.class\"\n        pRipple>\n        <i [ngClass]=\"item.icon\" class=\"layout-menuitem-icon\"></i>\n        <span class=\"layout-menuitem-text\">{{ item.label | translate }}</span>\n        <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <a\n        *ngIf=\"item.routerLink && !item.items && item.visible !== false\"\n        (click)=\"itemClick($event)\"\n        (mouseenter)=\"hover = true\"\n        (mouseleave)=\"hover = false\"\n        [routerLink]=\"item.routerLink\"\n        routerLinkActive=\"active-menuitem-routerlink\"\n        [routerLinkActiveOptions]=\"{exact: true}\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.class\"\n        pRipple>\n        <i [ngClass]=\"item.icon\" class=\"layout-menuitem-icon\"></i>\n        <span class=\"layout-menuitem-text\">{{ item.label | translate }}</span>\n        <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <ul\n        *ngIf=\"((item.items && active) || (item.items && (mngCommons.menuModeIsStatic$ | async) && (root || active))) && item.visible !== false\"\n        [@children]=\"\n            (mngCommons.menuModeIsSlim$ | async) && (mainLayoutService.isMobile$ | async) === false && root\n                ? active\n                    ? 'visible'\n                    : 'hidden'\n                : (mngCommons.menuModeIsStatic$ | async) && root && (mainLayoutService.isMobile$ | async) === false\n                ? 'visible'\n                : active\n                ? 'visibleAnimated'\n                : 'hiddenAnimated'\n        \">\n        <ng-template ngFor let-child let-i=\"index\" [ngForOf]=\"item.items\">\n            <li mng-menuitem [item]=\"child\" [index]=\"i\" [parentKey]=\"key\" [class]=\"child.badgeClass\"></li>\n        </ng-template>\n    </ul>\n</ng-container>\n", components: [{ type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: ["item", "index", "root", "parentKey"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i9.Ripple, selector: "[pRipple]" }, { type: i4$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i2$2.TranslatePipe, "async": i4$1.AsyncPipe }, animations: [
+MngMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngMenuItemComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: MngCommonsService }, { token: MngMainLayoutComponentService }], target: i0.ɵɵFactoryTarget.Component });
+MngMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: { item: "item", index: "index", root: "root", parentKey: "parentKey" }, host: { properties: { "class.layout-root-menuitem": "root", "class.active-menuitem": "active" } }, ngImport: i0, template: "<ng-container>\n    <div *ngIf=\"root && item.visible !== false && (isAllowed$ | async) === true\" class=\"layout-menuitem-root-text\">{{ item.label! | translate }}</div>\n    <a\n        *ngIf=\"(!item.routerLink || item.items) && item.visible !== false && (isAllowed$ | async) === true\"\n        [attr.href]=\"item.href\"\n        (click)=\"itemClick($event)\"\n        (mouseenter)=\"onMouseEnter()\"\n        (keydown.enter)=\"itemClick($event)\"\n        [routerLink]=\"item.routerLink\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.className ?? ''\"\n        pRipple>\n        <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n        <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n        <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <a\n        *ngIf=\"item.routerLink && !item.items && item.visible !== false && (isAllowed$ | async) === true\"\n        (click)=\"itemClick($event)\"\n        (mouseenter)=\"hover = true\"\n        (mouseleave)=\"hover = false\"\n        [routerLink]=\"item.routerLink\"\n        routerLinkActive=\"active-menuitem-routerlink\"\n        [routerLinkActiveOptions]=\"{exact: true}\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.className ?? ''\"\n        pRipple>\n        <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n        <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n        <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <ul\n        *ngIf=\"((item.items && active) || (item.items && (mngCommons.menuModeIsStatic$ | async) && (root || active))) && item.visible !== false && (isAllowed$ | async) === true\"\n        [@children]=\"\n            (mngCommons.menuModeIsSlim$ | async) && (mainLayoutService.isMobile$ | async) === false && root\n                ? active\n                    ? 'visible'\n                    : 'hidden'\n                : (mngCommons.menuModeIsStatic$ | async) && root && (mainLayoutService.isMobile$ | async) === false\n                ? 'visible'\n                : active\n                ? 'visibleAnimated'\n                : 'hiddenAnimated'\n        \">\n        <ng-template ngFor let-child let-i=\"index\" [ngForOf]=\"item.items\">\n            <li mng-menuitem [item]=\"child\" [index]=\"i\" [parentKey]=\"key\" [class]=\"child.badgeClassName\"></li>\n        </ng-template>\n    </ul>\n</ng-container>\n", components: [{ type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: ["item", "index", "root", "parentKey"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i9.Ripple, selector: "[pRipple]" }, { type: i4$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i4$1.AsyncPipe, "translate": i2$2.TranslatePipe }, animations: [
         trigger('children', [
             state('void', style({
                 height: '0px'
@@ -5475,8 +5817,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImpor
                             transition('hiddenAnimated => visibleAnimated', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)')),
                             transition('void => visibleAnimated, visibleAnimated => void', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
                         ])
-                    ], template: "<ng-container>\n    <div *ngIf=\"root && item.visible !== false\" class=\"layout-menuitem-root-text\">{{ item.label | translate }}</div>\n    <a\n        *ngIf=\"(!item.routerLink || item.items) && item.visible !== false\"\n        [attr.href]=\"item.url\"\n        (click)=\"itemClick($event)\"\n        (mouseenter)=\"onMouseEnter()\"\n        (keydown.enter)=\"itemClick($event)\"\n        [routerLink]=\"item.routerLink\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.class\"\n        pRipple>\n        <i [ngClass]=\"item.icon\" class=\"layout-menuitem-icon\"></i>\n        <span class=\"layout-menuitem-text\">{{ item.label | translate }}</span>\n        <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <a\n        *ngIf=\"item.routerLink && !item.items && item.visible !== false\"\n        (click)=\"itemClick($event)\"\n        (mouseenter)=\"hover = true\"\n        (mouseleave)=\"hover = false\"\n        [routerLink]=\"item.routerLink\"\n        routerLinkActive=\"active-menuitem-routerlink\"\n        [routerLinkActiveOptions]=\"{exact: true}\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.class\"\n        pRipple>\n        <i [ngClass]=\"item.icon\" class=\"layout-menuitem-icon\"></i>\n        <span class=\"layout-menuitem-text\">{{ item.label | translate }}</span>\n        <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <ul\n        *ngIf=\"((item.items && active) || (item.items && (mngCommons.menuModeIsStatic$ | async) && (root || active))) && item.visible !== false\"\n        [@children]=\"\n            (mngCommons.menuModeIsSlim$ | async) && (mainLayoutService.isMobile$ | async) === false && root\n                ? active\n                    ? 'visible'\n                    : 'hidden'\n                : (mngCommons.menuModeIsStatic$ | async) && root && (mainLayoutService.isMobile$ | async) === false\n                ? 'visible'\n                : active\n                ? 'visibleAnimated'\n                : 'hiddenAnimated'\n        \">\n        <ng-template ngFor let-child let-i=\"index\" [ngForOf]=\"item.items\">\n            <li mng-menuitem [item]=\"child\" [index]=\"i\" [parentKey]=\"key\" [class]=\"child.badgeClass\"></li>\n        </ng-template>\n    </ul>\n</ng-container>\n" }]
-        }], ctorParameters: function () { return [{ type: i1.Router }, { type: MngCommonsService }, { type: MngMainLayoutComponentService }]; }, propDecorators: { item: [{
+                    ], template: "<ng-container>\n    <div *ngIf=\"root && item.visible !== false && (isAllowed$ | async) === true\" class=\"layout-menuitem-root-text\">{{ item.label! | translate }}</div>\n    <a\n        *ngIf=\"(!item.routerLink || item.items) && item.visible !== false && (isAllowed$ | async) === true\"\n        [attr.href]=\"item.href\"\n        (click)=\"itemClick($event)\"\n        (mouseenter)=\"onMouseEnter()\"\n        (keydown.enter)=\"itemClick($event)\"\n        [routerLink]=\"item.routerLink\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.className ?? ''\"\n        pRipple>\n        <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n        <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n        <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <a\n        *ngIf=\"item.routerLink && !item.items && item.visible !== false && (isAllowed$ | async) === true\"\n        (click)=\"itemClick($event)\"\n        (mouseenter)=\"hover = true\"\n        (mouseleave)=\"hover = false\"\n        [routerLink]=\"item.routerLink\"\n        routerLinkActive=\"active-menuitem-routerlink\"\n        [routerLinkActiveOptions]=\"{exact: true}\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.className ?? ''\"\n        pRipple>\n        <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n        <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n        <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <ul\n        *ngIf=\"((item.items && active) || (item.items && (mngCommons.menuModeIsStatic$ | async) && (root || active))) && item.visible !== false && (isAllowed$ | async) === true\"\n        [@children]=\"\n            (mngCommons.menuModeIsSlim$ | async) && (mainLayoutService.isMobile$ | async) === false && root\n                ? active\n                    ? 'visible'\n                    : 'hidden'\n                : (mngCommons.menuModeIsStatic$ | async) && root && (mainLayoutService.isMobile$ | async) === false\n                ? 'visible'\n                : active\n                ? 'visibleAnimated'\n                : 'hiddenAnimated'\n        \">\n        <ng-template ngFor let-child let-i=\"index\" [ngForOf]=\"item.items\">\n            <li mng-menuitem [item]=\"child\" [index]=\"i\" [parentKey]=\"key\" [class]=\"child.badgeClassName\"></li>\n        </ng-template>\n    </ul>\n</ng-container>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.Router }, { type: i1.ActivatedRoute }, { type: MngCommonsService }, { type: MngMainLayoutComponentService }]; }, propDecorators: { item: [{
                 type: Input
             }], index: [{
                 type: Input
@@ -5647,7 +5989,7 @@ class MngTableviewComponent {
     }
 }
 MngTableviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngTableviewComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2$1.MessageService }, { token: i2$2.TranslateService }, { token: i2.DialogService }, { token: i2$1.ConfirmationService }, { token: MngActionService }, { token: TableviewComponentService }], target: i0.ɵɵFactoryTarget.Component });
-MngTableviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngTableviewComponent, selector: "mng-tableview", inputs: { descriptor: "descriptor", dataProvider: "dataProvider", actions: "actions" }, providers: [MessageService, ConfirmationService, TableviewComponentService], 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\"> </mng-action>\n            </ng-template>\n\n            <ng-template pTemplate=\"right\">\n                <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\"> </mng-action>\n            </ng-template>\n        </p-toolbar>\n\n        <mng-table [descriptor]=\"descriptor.table\" [dataProvider]=\"dataProvider\" [useQueryParams]=\"true\" (cellClick)=\"onTableCellClick($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-m-0\">{{ descriptor.tableTitle | translate }}</h5>\n                </div>\n            </ng-template>\n            <ng-template mngTemplate=\"columnAction\" let-item=\"rowItem\">\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                </mng-action>\n            </ng-template>\n        </mng-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n", components: [{ type: i7$1.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { type: i8$2.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass"] }, { type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData"] }, { type: MngTableComponent, selector: "mng-table", inputs: ["descriptor", "items", "queryResult", "loading", "dataProvider", "useQueryParams", "selectionEnabled"], outputs: ["tableLoad", "cellClick", "selectionChange"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i4$1.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": i2$2.TranslatePipe } });
+MngTableviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: MngTableviewComponent, selector: "mng-tableview", inputs: { descriptor: "descriptor", dataProvider: "dataProvider", actions: "actions" }, providers: [MessageService, ConfirmationService, TableviewComponentService], 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\"> </mng-action>\n            </ng-template>\n\n            <ng-template pTemplate=\"right\">\n                <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\"> </mng-action>\n            </ng-template>\n        </p-toolbar>\n\n        <mng-table [descriptor]=\"descriptor.table\" [dataProvider]=\"dataProvider\" [useQueryParams]=\"true\" (cellClick)=\"onTableCellClick($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-m-0\">{{ descriptor.tableTitle | translate }}</h5>\n                </div>\n            </ng-template>\n            <ng-template mngTemplate=\"columnAction\" let-item=\"rowItem\">\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                </mng-action>\n            </ng-template>\n        </mng-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n", components: [{ type: i7$1.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { type: i8$1.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass"] }, { type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData"] }, { type: MngTableComponent, selector: "mng-table", inputs: ["descriptor", "items", "queryResult", "loading", "dataProvider", "useQueryParams", "selectionEnabled"], outputs: ["tableLoad", "cellClick", "selectionChange"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i4$1.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": i2$2.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngTableviewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mng-tableview', providers: [MessageService, ConfirmationService, TableviewComponentService], 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\"> </mng-action>\n            </ng-template>\n\n            <ng-template pTemplate=\"right\">\n                <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\"> </mng-action>\n            </ng-template>\n        </p-toolbar>\n\n        <mng-table [descriptor]=\"descriptor.table\" [dataProvider]=\"dataProvider\" [useQueryParams]=\"true\" (cellClick)=\"onTableCellClick($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-m-0\">{{ descriptor.tableTitle | translate }}</h5>\n                </div>\n            </ng-template>\n            <ng-template mngTemplate=\"columnAction\" let-item=\"rowItem\">\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                </mng-action>\n            </ng-template>\n        </mng-table>\n    </div>\n\n    <router-outlet></router-outlet>\n</div>\n" }]
@@ -5712,6 +6054,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImpor
             args: [{ selector: 'mng-tableview-route', template: "<div class=\"grid\">\n    <div class=\"col-12\">\n        <mng-tableview [descriptor]=\"descriptor\" [dataProvider]=\"dataProvider\" [actions]=\"actions\"></mng-tableview>\n    </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1.ActivatedRoute }]; } });
 
+class MngEnumPipe {
+    transform(value, enumObj, i18nPath, nameAsValue = false) {
+        const enumConstantName = nameAsValue ? value : EnumUtil.getConstantNameFromEnumObject(enumObj, value);
+        if (typeof i18nPath === 'undefined') {
+            i18nPath = TypeUtil.findEnumName(enumObj);
+        }
+        return i18nPath ? `${i18nPath}.${enumConstantName}` : enumConstantName;
+    }
+}
+MngEnumPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngEnumPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+MngEnumPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngEnumPipe, name: "enum" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: MngEnumPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'enum',
+                    pure: true
+                }]
+        }] });
+
 function mngCommonsInitializerProvider(mngCommons) {
     return () => mngCommons.initialize();
 }
@@ -5801,6 +6162,15 @@ const formlyTypesConfig = [
             }
         }
     },
+    {
+        name: 'mask',
+        extends: 'input',
+        defaultOptions: {
+            templateOptions: {
+                type: 'mask'
+            }
+        }
+    },
     {
         name: 'dropdown',
         component: MngFormlyFieldDropdownComponent,
@@ -5957,7 +6327,9 @@ const declarations = [
     MngTemplateDirective,
     // pipes
     MngPropertyPathPipe,
+    MngEnumPipe,
     MngBooleanPipe,
+    MngI18nPropertyPipe,
     // layout components
     MngBreadcrumbComponent,
     MngFooterComponent,
@@ -6048,7 +6420,9 @@ MngCommonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versio
         MngTemplateDirective,
         // pipes
         MngPropertyPathPipe,
+        MngEnumPipe,
         MngBooleanPipe,
+        MngI18nPropertyPipe,
         // layout components
         MngBreadcrumbComponent,
         MngFooterComponent,
@@ -6159,7 +6533,9 @@ MngCommonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versio
         MngTemplateDirective,
         // pipes
         MngPropertyPathPipe,
+        MngEnumPipe,
         MngBooleanPipe,
+        MngI18nPropertyPipe,
         // layout components
         MngBreadcrumbComponent,
         MngFooterComponent,
@@ -6378,8 +6754,12 @@ class RoutesBuilder {
     addRouteRedirect(path, redirectTo, pathMatch = 'prefix') {
         return this.addRouteBuilder(RouteBuilder.createRedirect(path, redirectTo, pathMatch));
     }
-    addLazyRoute(path, loadChildren) {
-        return this.addRouteBuilder(RouteBuilder.createFromRoute({ path: path, loadChildren: loadChildren }));
+    addLazyRoute(path, loadChildren, canLoad) {
+        const route = { path: path, loadChildren: loadChildren };
+        if (canLoad === null || canLoad === void 0 ? void 0 : canLoad.length) {
+            route.canLoad = canLoad;
+        }
+        return this.addRouteBuilder(RouteBuilder.createFromRoute(route));
     }
     addRoute(path, component) {
         return this.addRouteBuilder(RouteBuilder.create(path, component));
@@ -6520,11 +6900,32 @@ class RouteBuilder {
         this.withBreadcrumb(title);
         return this;
     }
+    withCanActivate(diToken) {
+        if (!this.route.canActivate) {
+            this.route.canActivate = [];
+        }
+        this.route.canActivate.push(diToken);
+        return this;
+    }
+    withCanDeactivate(diToken) {
+        if (!this.route.canDeactivate) {
+            this.route.canDeactivate = [];
+        }
+        this.route.canDeactivate.push(diToken);
+        return this;
+    }
+    withResolver(diToken, name) {
+        if (!this.route.resolve) {
+            this.route.resolve = {};
+        }
+        this.route.resolve[name] = diToken;
+        return this;
+    }
     withData(data) {
         this.route.data = data;
         return this;
     }
-    withPrimeMenuItem(menuItem) {
+    withMngMenuItem(menuItem) {
         this.menuItem = menuItem;
         return this;
     }
@@ -6595,35 +6996,62 @@ class RouteBuilder {
                 }
             }
         }
+        if (this.route.canActivate) {
+            angularRoute.canActivate = [...this.route.canActivate];
+        }
+        if (this.route.canActivateChild) {
+            angularRoute.canActivateChild = [...this.route.canActivateChild];
+        }
+        if (this.route.canLoad) {
+            angularRoute.canLoad = [...this.route.canLoad];
+        }
+        if (this.route.canDeactivate) {
+            angularRoute.canDeactivate = [...this.route.canDeactivate];
+        }
+        if (this.route.resolve) {
+            angularRoute.resolve = Object.assign({}, this.route.resolve);
+        }
         return angularRoute;
     }
     buildMenu() {
         var _a, _b;
-        const menuItem = this.menuItem ? Object.assign({}, this.menuItem) : null;
+        const menuItemBuild = this.menuItem ? Object.assign({}, this.menuItem) : null;
         const routeChildrenMenuItems = this.children.flatMap(child => child.buildMenu());
         const menuItemChildren = [];
-        const finalMenuItemChildren = [];
-        if (menuItem === null || menuItem === void 0 ? void 0 : menuItem.items) {
-            finalMenuItemChildren.push(...menuItem.items);
+        const menuItemChildrenBuild = [];
+        if (menuItemBuild === null || menuItemBuild === void 0 ? void 0 : menuItemBuild.items) {
+            menuItemChildrenBuild.push(...menuItemBuild.items);
         }
         for (const menuItemChild of this.menuItemChildren) {
             const finalMenuItemChild = Object.assign({}, menuItemChild);
             if (!finalMenuItemChild.routerLink) {
                 finalMenuItemChild.routerLink = this.routePath;
             }
+            if (typeof finalMenuItemChild.routerLink === 'string') {
+                finalMenuItemChild.routerLink = [finalMenuItemChild.routerLink];
+            }
             finalMenuItemChild.routerLink = RouteUtil.removeEmptyPathSegments(finalMenuItemChild.routerLink);
             menuItemChildren.push(finalMenuItemChild);
         }
-        finalMenuItemChildren.push(...menuItemChildren, ...routeChildrenMenuItems);
-        if (!menuItem) {
-            return finalMenuItemChildren;
+        menuItemChildrenBuild.push(...menuItemChildren, ...routeChildrenMenuItems);
+        if (!menuItemBuild) {
+            return menuItemChildrenBuild;
+        }
+        menuItemBuild.label = (_a = menuItemBuild.label) !== null && _a !== void 0 ? _a : this.pageTitle;
+        if (typeof menuItemBuild.routerLink === 'string') {
+            menuItemBuild.routerLink = [menuItemBuild.routerLink];
+        }
+        menuItemBuild.routerLink = RouteUtil.removeEmptyPathSegments((_b = menuItemBuild.routerLink) !== null && _b !== void 0 ? _b : this.routePath);
+        if (menuItemChildrenBuild.length > 0) {
+            menuItemBuild.items = menuItemChildrenBuild;
         }
-        menuItem.label = (_a = menuItem.label) !== null && _a !== void 0 ? _a : this.pageTitle;
-        menuItem.routerLink = RouteUtil.removeEmptyPathSegments((_b = menuItem.routerLink) !== null && _b !== void 0 ? _b : this.routePath);
-        if (finalMenuItemChildren.length > 0) {
-            menuItem.items = finalMenuItemChildren;
+        if (!menuItemBuild.guards) {
+            const guards = this.findMenuItemGuards();
+            if (guards.length > 0) {
+                menuItemBuild.guards = guards;
+            }
         }
-        return [menuItem];
+        return [menuItemBuild];
     }
     createMenuItem(icon, label, routerLink) {
         const menuItem = {};
@@ -6641,13 +7069,31 @@ class RouteBuilder {
     adjustMenuRouterLinksFromBuilder(menuItems) {
         for (const menuItem of menuItems) {
             if (menuItem.routerLink) {
-                menuItem.routerLink = RouteUtil.appendPathToBasePath(this.routePath, menuItem.routerLink);
+                menuItem.routerLink = RouteUtil.appendPathToBasePath(this.routePath, typeof menuItem.routerLink === 'string' ? [menuItem.routerLink] : menuItem.routerLink);
             }
             if (Array.isArray(menuItem.items)) {
                 this.adjustMenuRouterLinksFromBuilder(menuItem.items);
             }
         }
     }
+    findMenuItemGuards() {
+        var _a;
+        const guards = [];
+        if ((_a = this.route.canActivate) === null || _a === void 0 ? void 0 : _a.length) {
+            guards.push(...this.route.canActivate);
+        }
+        if (this.parent) {
+            // Check for parent guards that should be included in decision to hide menu item!
+            // Some parent routes might have guards, but no menu items, so this guards must be taken into account here,
+            // because there is no parent menu item to hide.
+            this.parent.findMenuItemGuards().forEach(g => {
+                if (guards.indexOf(g) < 0) {
+                    guards.push(g);
+                }
+            });
+        }
+        return guards;
+    }
 }
 
 /*
@@ -6658,5 +7104,5 @@ class RouteBuilder {
  * Generated bundle index. Do not edit.
  */
 
-export { AFieldDescriptor, AFieldGroupDescriptor, AGenericFieldDescriptor, AMngCrudApiService, AMngTableviewRouteComponent, ActionActivationResult, ActionActivationTriggerEnum, ActionDeleteDescriptor, ActionDescriptor, ActionEditorAddDescriptor, ActionEditorDescriptor, ActionEditorDetailsDescriptor, ActionEditorEditDescriptor, ActionError, ActionExecContext, ActionLevelEnum, ActionPositionEnum, ActionRunResult, ActionTriggerResult, ActionTypeEnum, ColumnDescriptor, DataProvider, EditorDataProvider, EditorDescriptor, EditorFormlyUtil, FieldGroupDescriptor, FieldInputDescriptor, FieldLookupDescriptor, FieldLookupEnumDescriptor, FieldManyEditorDescriptor, FieldManyToManyEditorDescriptor, FieldTabGroupDescriptor, FieldValidator, FilterDescriptor, FilterLookupDescriptor, I18nUtil, LookupDataProvider, MNG_AUTOCOMPLETE_VALUE_ACCESSOR, MNG_DROPDOWN_VALUE_ACCESSOR, MediusFilterMatchType, MediusFilterParam, MediusQueryMode, MediusQueryParam, MediusQueryParamBuilder, MediusQueryResult, MediusQueryResultBase, MediusQueryResultWithObject, MediusRestUtil, MngActionComponent, MngActionDialogComponent, MngActionRouteComponent, MngActionService, MngAutocompleteComponent, MngBooleanPipe, MngBreadcrumbComponent, MngCommonsModule, MngCommonsService, MngComponentDirective, MngConfigurationService, MngDropdownComponent, MngFooterComponent, MngFormEditorComponent, MngFormEditorSubmitEvent, MngFormlyFieldAutocompleteComponent, MngFormlyFieldDropdownComponent, MngFormlyFieldFieldsetComponent, MngFormlyFieldInputComponent, MngFormlyFieldTableDialogFormComponent, MngFormlyFieldTableDialogMultiselectComponent, MngFormlyFieldTabsComponent, MngFormlyFieldWrapperComponent, MngFormlyTableWrapperComponent, MngMainLayoutComponent, MngMainLayoutComponentService, MngMenuComponent, MngMenuItemComponent, MngNavigationService, MngPropertyPathPipe, MngTableColumnFilterComponent, MngTableColumnValueComponent, MngTableComponent, MngTableviewComponent, MngTableviewRouteComponent, MngTemplateDirective, MngTopbarComponent, ModelDescriptor, ModelUtil, ObjectSerializer, RouteBuilder, RoutesBuilder, TableDescriptor, TableviewComponentService, TableviewDataProvider, TableviewDescriptor, ToastUtil, TypeName, TypeUtil, enumsMapBase, formlyTypesConfig, formlyWrappersConfig, getEmailValidationMessage, getFormlyValidationMessages, getMaxLengthValidationMessage, getMinLengthValidationMessage, getRequiredValidationMessage, getTextPatternValidationMessage, mngCommonsInitializerProvider, mngConfigJsonAppInitializerProvider, mngConfigurationServiceProvider, mngFormlyConfigProvider, primeNgModules, typeMapBase, typeNameDecoratorPropertyName };
+export { AFieldDescriptor, AFieldGroupDescriptor, AGenericFieldDescriptor, AMngCrudApiService, AMngTableviewRouteComponent, ActionActivationResult, ActionActivationTriggerEnum, ActionDeleteDescriptor, ActionDescriptor, ActionEditorAddDescriptor, ActionEditorDescriptor, ActionEditorDetailsDescriptor, ActionEditorEditDescriptor, ActionError, ActionExecContext, ActionLevelEnum, ActionPositionEnum, ActionRunResult, ActionTriggerResult, ActionTypeEnum, ColumnDescriptor, DataProvider, EditorDataProvider, EditorDescriptor, EditorFormlyUtil, EnumName, EnumUtil, FieldGroupDescriptor, FieldInputDescriptor, FieldLookupDescriptor, FieldLookupEnumDescriptor, FieldManyEditorDescriptor, FieldManyToManyEditorDescriptor, FieldTabGroupDescriptor, FieldValidator, FilterDescriptor, FilterLookupDescriptor, FilterLookupEnumDescriptor, I18nUtil, LookupDataProvider, MNG_AUTOCOMPLETE_VALUE_ACCESSOR, MNG_DROPDOWN_VALUE_ACCESSOR, MediusFilterMatchType, MediusFilterParam, MediusQueryMode, MediusQueryParam, MediusQueryParamBuilder, MediusQueryResult, MediusQueryResultBase, MediusQueryResultWithObject, MediusRestUtil, MngActionComponent, MngActionDialogComponent, MngActionRouteComponent, MngActionService, MngAutocompleteComponent, MngBooleanPipe, MngBreadcrumbComponent, MngCommonsModule, MngCommonsService, MngComponentDirective, MngConfigurationService, MngDropdownComponent, MngEnumPipe, MngFooterComponent, MngFormEditorComponent, MngFormEditorSubmitEvent, MngFormlyFieldAutocompleteComponent, MngFormlyFieldDropdownComponent, MngFormlyFieldFieldsetComponent, MngFormlyFieldInputComponent, MngFormlyFieldTableDialogFormComponent, MngFormlyFieldTableDialogMultiselectComponent, MngFormlyFieldTabsComponent, MngFormlyFieldWrapperComponent, MngFormlyTableWrapperComponent, MngI18nPropertyPipe, MngMainLayoutComponent, MngMainLayoutComponentService, MngMenuComponent, MngMenuItemComponent, MngNavigationService, MngPropertyPathPipe, MngTableColumnFilterComponent, MngTableColumnValueComponent, MngTableComponent, MngTableviewComponent, MngTableviewRouteComponent, MngTemplateDirective, MngTopbarComponent, ModelDescriptor, ModelUtil, ObjectSerializer, RouteBuilder, RoutesBuilder, TableDescriptor, TableviewComponentService, TableviewDataProvider, TableviewDescriptor, ToastUtil, TypeName, TypeUtil, enumNameDecoratorPropertyName, enumsMapBase, formlyTypesConfig, formlyWrappersConfig, getEmailValidationMessage, getFormlyValidationMessages, getMaxLengthValidationMessage, getMinLengthValidationMessage, getRequiredValidationMessage, getTextPatternValidationMessage, mngCommonsInitializerProvider, mngConfigJsonAppInitializerProvider, mngConfigurationServiceProvider, mngFormlyConfigProvider, primeNgModules, typeMapBase, typeNameDecoratorPropertyName };
 //# sourceMappingURL=mediusinc-mng-commons.mjs.map