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

package/fesm2022/mediusinc-mng-commons.mjs

@@ -1,9 +1,9 @@
 import * as i2$1 from '@angular/common';
-import { DatePipe, AsyncPipe, NgIf, NgForOf, NgSwitch, NgSwitchCase, NgSwitchDefault, NgClass, DecimalPipe, CurrencyPipe, NgStyle, NgTemplateOutlet, JsonPipe, CommonModule } from '@angular/common';
+import { DatePipe, AsyncPipe, NgIf, NgForOf, NgSwitch, NgSwitchCase, NgSwitchDefault, NgClass, DecimalPipe, CurrencyPipe, NgStyle, NgTemplateOutlet, JsonPipe, CommonModule, NgOptimizedImage } from '@angular/common';
 import * as i1$1 from '@angular/common/http';
 import { HttpErrorResponse, HttpClient, HttpClientModule, HttpParams } from '@angular/common/http';
 import * as i0 from '@angular/core';
-import { Pipe, InjectionToken, inject, Injectable, Inject, booleanAttribute, EventEmitter, createComponent, Directive, Input, Output, Component, ChangeDetectionStrategy, Optional, HostBinding, ViewChild, ContentChildren, forwardRef, HostListener, LOCALE_ID, ElementRef, Renderer2, ChangeDetectorRef, signal, computed, ViewEncapsulation, ViewChildren, runInInjectionContext, APP_INITIALIZER, ErrorHandler, NgModule } from '@angular/core';
+import { Pipe, InjectionToken, inject, Injectable, Inject, booleanAttribute, EventEmitter, createComponent, Directive, Input, Output, Component, ChangeDetectionStrategy, Optional, HostBinding, ViewChild, ContentChildren, forwardRef, HostListener, LOCALE_ID, ElementRef, Renderer2, ChangeDetectorRef, signal, computed, ViewEncapsulation, ViewChildren, runInInjectionContext, APP_INITIALIZER, ErrorHandler, NgModule, Injector, DestroyRef } from '@angular/core';
 import * as i1$3 from '@angular/forms';
 import { Validators, FormGroup, FormArray, ReactiveFormsModule, NG_VALUE_ACCESSOR, FormControl, FormsModule } from '@angular/forms';
 import * as i1 from '@angular/router';
@@ -83,7 +83,6 @@ import * as i11 from 'primeng/menu';
 import { MenuModule } from 'primeng/menu';
 import { isObservable, throwError, BehaviorSubject, Subject, ReplaySubject, distinctUntilChanged, take, mergeMap, of, combineLatest, switchMap, from, timeout, tap, Observable, debounceTime, merge, filter as filter$1 } from 'rxjs';
 import { filter, map, startWith, catchError, first, mergeMap as mergeMap$1, take as take$1 } from 'rxjs/operators';
-import { logger } from 'nx/src/utils/logger';
 import 'reflect-metadata';
 import { Title, DomSanitizer } from '@angular/platform-browser';
 import { ZIndexUtils } from 'primeng/utils';
@@ -97,6 +96,8 @@ import * as i4$3 from 'primeng/tristatecheckbox';
 import { TriStateCheckboxModule } from 'primeng/tristatecheckbox';
 import * as i5$1 from 'primeng/message';
 import { MessageModule } from 'primeng/message';
+import * as i3$4 from 'primeng/styleclass';
+import { StyleClassModule } from 'primeng/styleclass';
 
 /**
  * Generated API
@@ -2783,11 +2784,11 @@ class MngActionExecutorService {
         }
         // finish related actions
         if (instance.nextActionInstance) {
-            logger.debug(`Finishing instance ${instance.instanceLongName} related next action instance: ${instance.nextActionInstance.instanceLongName}`);
+            this.logger.debug(`Finishing instance ${instance.instanceLongName} related next action instance: ${instance.nextActionInstance.instanceLongName}`);
             this.finishAction(instance.nextActionInstance, onDestroy);
         }
         if (instance.errorActionInstance) {
-            logger.debug(`Finishing instance ${instance.instanceLongName} related error action instance: ${instance.errorActionInstance.instanceLongName}`);
+            this.logger.debug(`Finishing instance ${instance.instanceLongName} related error action instance: ${instance.errorActionInstance.instanceLongName}`);
             this.finishAction(instance.errorActionInstance, onDestroy);
         }
     }
@@ -10627,11 +10628,11 @@ class MngActionComponent {
         this.viewContainer = this.viewContainerInit ?? this.viewContainerService ?? undefined;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngActionComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2.TranslateService }, { token: MngAuthorizationService }, { token: MngActionExecutorService }, { token: i1$2.ConfirmationService }, { token: MngViewContainerComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "16.2.6", type: MngActionComponent, isStandalone: true, selector: "mng-action", inputs: { action: "action", item: "item", itemId: "itemId", actionData: "actionData", queryParam: "queryParam", dataProvider: "dataProvider", hostComponent: "hostComponent", routeInit: ["route", "routeInit"], inputDisabled: ["disabled", "inputDisabled", booleanObsAttribute], inputLoading: ["loading", "inputLoading"], viewContainerInit: ["viewContainer", "viewContainerInit"], selectedItems: "selectedItems" }, outputs: { finishEventEmitter: "finish" }, host: { properties: { "class": "this.hostClass", "class.m-0": "this.isHostHidden" } }, providers: [ConfirmationService], viewQueries: [{ propertyName: "subactionsMenu", first: true, predicate: ["subactionsMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n    <a\n        *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n        pButton\n        pRipple\n        [label]=\"($label | async) ?? ''\"\n        [icon]=\"$any(action.button.icon)\"\n        [iconPos]=\"action.button.iconPosition\"\n        [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize : itemId : item : actionData)\"\n        [target]=\"actionLink.target\"\n        [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n        [pTooltip]=\"($tooltip | async) ?? undefined\"\n        [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n        [class]=\"buttonClass\"></a>\n    <ng-template #routerLink>\n        <a\n            *ngIf=\"actionLink; else customComponent\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize : itemId : item : actionData)\"\n            [relativeTo]=\"route\"\n            [queryParams]=\"actionLink.queryParams | parametrize : itemId : item : actionData\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    </ng-template>\n    <ng-template #customComponent>\n        <ng-container\n            *ngIf=\"action.component; else splitButton\"\n            [mngComponent]=\"action.component\"\n            [inputs]=\"{\n                action: action,\n                item: item,\n                itemId: itemId,\n                actionData: actionData,\n                enabled: $isEnabled,\n                loading: $loading,\n                viewContainer: viewContainer\n            }\"\n            (instanceCreated)=\"onCustomActionCmpInst($event)\">\n        </ng-container>\n    </ng-template>\n    <ng-template #splitButton>\n        <p-splitButton\n            *ngIf=\"action.subactions.length > 0 && !action.subactionsAsMenu; else button\"\n            [icon]=\"action.button.icon ?? undefined\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (onClick)=\"triggerAction(action)\"\n            [class]=\"buttonClass\"\n            [model]=\"subactions\">\n        </p-splitButton>\n    </ng-template>\n    <ng-template #button>\n        <button\n            pButton\n            pRipple\n            type=\"button\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            loadingIcon=\"pi pi-spin pi-spinner\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction(action, undefined, $event)\"\n            [class]=\"buttonClass\"></button>\n        <p-menu #subactionsMenu [model]=\"subactions\" [popup]=\"true\" styleClass=\"mng-action-menu\"></p-menu>\n    </ng-template>\n    <p-confirmDialog\n        *ngIf=\"actionOrSubactionHasRunConfirmation\"\n        [key]=\"action.actionName + '_' + cmpId\"\n        [baseZIndex]=\"50\"\n        appendTo=\"body\"\n        [closable]=\"action.runConfirmationDialogDescriptor?.closable ?? true\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["id", "tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "pipe", type: MngParametrizePipe, name: "parametrize" }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i9.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "ngmodule", type: SplitButtonModule }, { kind: "component", type: i10.SplitButton, selector: "p-splitButton", inputs: ["model", "icon", "iconPos", "label", "style", "styleClass", "menuStyle", "menuStyleClass", "disabled", "tabindex", "appendTo", "dir", "expandAriaLabel", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onClick", "onDropdownClick"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i11.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "16.2.6", type: MngActionComponent, isStandalone: true, selector: "mng-action", inputs: { action: "action", item: "item", itemId: "itemId", actionData: "actionData", queryParam: "queryParam", dataProvider: "dataProvider", hostComponent: "hostComponent", routeInit: ["route", "routeInit"], inputDisabled: ["disabled", "inputDisabled", booleanObsAttribute], inputLoading: ["loading", "inputLoading"], viewContainerInit: ["viewContainer", "viewContainerInit"], selectedItems: "selectedItems" }, outputs: { finishEventEmitter: "finish" }, host: { properties: { "class": "this.hostClass", "class.m-0": "this.isHostHidden" } }, providers: [ConfirmationService], viewQueries: [{ propertyName: "subactionsMenu", first: true, predicate: ["subactionsMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n    <a\n        *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n        pButton\n        pRipple\n        [label]=\"($label | async) ?? ''\"\n        [icon]=\"$any(action.button.icon)\"\n        [iconPos]=\"action.button.iconPosition\"\n        [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize : itemId : item : actionData)\"\n        [target]=\"actionLink.target\"\n        [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n        [pTooltip]=\"($tooltip | async) ?? undefined\"\n        [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n        [class]=\"buttonClass\"></a>\n    <ng-template #routerLink>\n        <a\n            *ngIf=\"actionLink; else customComponent\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize : itemId : item : actionData)\"\n            [relativeTo]=\"route\"\n            [queryParams]=\"actionLink.queryParams | parametrize : itemId : item : actionData\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    </ng-template>\n    <ng-template #customComponent>\n        <ng-container\n            *ngIf=\"action.component; else splitButton\"\n            [mngComponent]=\"action.component\"\n            [inputs]=\"{\n                action: action,\n                item: item,\n                itemId: itemId,\n                actionData: actionData,\n                enabled: $isEnabled,\n                loading: $loading,\n                viewContainer: viewContainer\n            }\"\n            (instanceCreated)=\"onCustomActionCmpInst($event)\">\n        </ng-container>\n    </ng-template>\n    <ng-template #splitButton>\n        <p-splitButton\n            *ngIf=\"action.subactions.length > 0 && !action.subactionsAsMenu; else button\"\n            [icon]=\"action.button.icon ?? undefined\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (onClick)=\"triggerAction(action)\"\n            [class]=\"buttonClass\"\n            [model]=\"subactions\">\n        </p-splitButton>\n    </ng-template>\n    <ng-template #button>\n        <button\n            pButton\n            pRipple\n            type=\"button\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            loadingIcon=\"pi pi-spin pi-spinner\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction(action, undefined, $event)\"\n            [class]=\"buttonClass\"></button>\n        <p-menu #subactionsMenu [model]=\"subactions\" [popup]=\"true\" appendTo=\"body\" styleClass=\"mng-action-menu\"></p-menu>\n    </ng-template>\n    <p-confirmDialog\n        *ngIf=\"actionOrSubactionHasRunConfirmation\"\n        [key]=\"action.actionName + '_' + cmpId\"\n        [baseZIndex]=\"50\"\n        appendTo=\"body\"\n        [closable]=\"action.runConfirmationDialogDescriptor?.closable ?? true\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "pipe", type: MngParametrizePipe, name: "parametrize" }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i9.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "ngmodule", type: SplitButtonModule }, { kind: "component", type: i10.SplitButton, selector: "p-splitButton", inputs: ["model", "icon", "iconPos", "label", "style", "styleClass", "menuStyle", "menuStyleClass", "disabled", "tabindex", "appendTo", "dir", "expandAriaLabel", "showTransitionOptions", "hideTransitionOptions", "buttonProps", "menuButtonProps"], outputs: ["onClick", "onDropdownClick"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i11.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngActionComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-action', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AsyncPipe, NgIf, ButtonModule, RippleModule, TooltipModule, MngParametrizePipe, MngComponentDirective, ConfirmDialogModule, SplitButtonModule, MenuModule], providers: [ConfirmationService], template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n    <a\n        *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n        pButton\n        pRipple\n        [label]=\"($label | async) ?? ''\"\n        [icon]=\"$any(action.button.icon)\"\n        [iconPos]=\"action.button.iconPosition\"\n        [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize : itemId : item : actionData)\"\n        [target]=\"actionLink.target\"\n        [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n        [pTooltip]=\"($tooltip | async) ?? undefined\"\n        [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n        [class]=\"buttonClass\"></a>\n    <ng-template #routerLink>\n        <a\n            *ngIf=\"actionLink; else customComponent\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize : itemId : item : actionData)\"\n            [relativeTo]=\"route\"\n            [queryParams]=\"actionLink.queryParams | parametrize : itemId : item : actionData\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    </ng-template>\n    <ng-template #customComponent>\n        <ng-container\n            *ngIf=\"action.component; else splitButton\"\n            [mngComponent]=\"action.component\"\n            [inputs]=\"{\n                action: action,\n                item: item,\n                itemId: itemId,\n                actionData: actionData,\n                enabled: $isEnabled,\n                loading: $loading,\n                viewContainer: viewContainer\n            }\"\n            (instanceCreated)=\"onCustomActionCmpInst($event)\">\n        </ng-container>\n    </ng-template>\n    <ng-template #splitButton>\n        <p-splitButton\n            *ngIf=\"action.subactions.length > 0 && !action.subactionsAsMenu; else button\"\n            [icon]=\"action.button.icon ?? undefined\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (onClick)=\"triggerAction(action)\"\n            [class]=\"buttonClass\"\n            [model]=\"subactions\">\n        </p-splitButton>\n    </ng-template>\n    <ng-template #button>\n        <button\n            pButton\n            pRipple\n            type=\"button\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            loadingIcon=\"pi pi-spin pi-spinner\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction(action, undefined, $event)\"\n            [class]=\"buttonClass\"></button>\n        <p-menu #subactionsMenu [model]=\"subactions\" [popup]=\"true\" styleClass=\"mng-action-menu\"></p-menu>\n    </ng-template>\n    <p-confirmDialog\n        *ngIf=\"actionOrSubactionHasRunConfirmation\"\n        [key]=\"action.actionName + '_' + cmpId\"\n        [baseZIndex]=\"50\"\n        appendTo=\"body\"\n        [closable]=\"action.runConfirmationDialogDescriptor?.closable ?? true\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"] }]
+            args: [{ standalone: true, selector: 'mng-action', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AsyncPipe, NgIf, ButtonModule, RippleModule, TooltipModule, MngParametrizePipe, MngComponentDirective, ConfirmDialogModule, SplitButtonModule, MenuModule], providers: [ConfirmationService], template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n    <a\n        *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n        pButton\n        pRipple\n        [label]=\"($label | async) ?? ''\"\n        [icon]=\"$any(action.button.icon)\"\n        [iconPos]=\"action.button.iconPosition\"\n        [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize : itemId : item : actionData)\"\n        [target]=\"actionLink.target\"\n        [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n        [pTooltip]=\"($tooltip | async) ?? undefined\"\n        [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n        [class]=\"buttonClass\"></a>\n    <ng-template #routerLink>\n        <a\n            *ngIf=\"actionLink; else customComponent\"\n            pButton\n            pRipple\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [target]=\"actionLink.target\"\n            [replaceUrl]=\"actionLink.replaceUrl\"\n            [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize : itemId : item : actionData)\"\n            [relativeTo]=\"route\"\n            [queryParams]=\"actionLink.queryParams | parametrize : itemId : item : actionData\"\n            [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n            [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [class]=\"buttonClass\"></a>\n    </ng-template>\n    <ng-template #customComponent>\n        <ng-container\n            *ngIf=\"action.component; else splitButton\"\n            [mngComponent]=\"action.component\"\n            [inputs]=\"{\n                action: action,\n                item: item,\n                itemId: itemId,\n                actionData: actionData,\n                enabled: $isEnabled,\n                loading: $loading,\n                viewContainer: viewContainer\n            }\"\n            (instanceCreated)=\"onCustomActionCmpInst($event)\">\n        </ng-container>\n    </ng-template>\n    <ng-template #splitButton>\n        <p-splitButton\n            *ngIf=\"action.subactions.length > 0 && !action.subactionsAsMenu; else button\"\n            [icon]=\"action.button.icon ?? undefined\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (onClick)=\"triggerAction(action)\"\n            [class]=\"buttonClass\"\n            [model]=\"subactions\">\n        </p-splitButton>\n    </ng-template>\n    <ng-template #button>\n        <button\n            pButton\n            pRipple\n            type=\"button\"\n            [icon]=\"$any(action.button.icon)\"\n            [iconPos]=\"action.button.iconPosition\"\n            [label]=\"($label | async) ?? ''\"\n            [pTooltip]=\"($tooltip | async) ?? undefined\"\n            [tooltipPosition]=\"action.button.tooltipPosition ?? undefined\"\n            [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n            loadingIcon=\"pi pi-spin pi-spinner\"\n            [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n            (click)=\"triggerAction(action, undefined, $event)\"\n            [class]=\"buttonClass\"></button>\n        <p-menu #subactionsMenu [model]=\"subactions\" [popup]=\"true\" appendTo=\"body\" styleClass=\"mng-action-menu\"></p-menu>\n    </ng-template>\n    <p-confirmDialog\n        *ngIf=\"actionOrSubactionHasRunConfirmation\"\n        [key]=\"action.actionName + '_' + cmpId\"\n        [baseZIndex]=\"50\"\n        appendTo=\"body\"\n        [closable]=\"action.runConfirmationDialogDescriptor?.closable ?? true\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ActivatedRoute }, { type: i2.TranslateService }, { type: MngAuthorizationService }, { type: MngActionExecutorService }, { type: i1$2.ConfirmationService }, { type: MngViewContainerComponentService, decorators: [{
                     type: Optional
                 }] }]; }, propDecorators: { hostClass: [{
@@ -11287,8 +11288,8 @@ class MngAutocompleteComponent {
     /**
      * Triggered by user when selecting an item from an autocomplete suggestion list.
      */
-    onSelect(value) {
-        this.setValue(value, true);
+    onSelect(event) {
+        this.setValue(event.value, true);
     }
     /**
      * Selects and sets new value
@@ -11512,11 +11513,11 @@ class MngAutocompleteComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngAutocompleteComponent, deps: [{ token: i0.Injector }, { token: i2.TranslateService }, { token: MngFormlyFieldWrapperComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngAutocompleteComponent, isStandalone: true, selector: "mng-autocomplete", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", inlineSearch: "inlineSearch", openOnFocus: "openOnFocus", multiselect: "multiselect", placeholder: "placeholder", className: "className", dropdownClassName: "dropdownClassName", showClear: "showClear", autoClear: "autoClear", selectFirst: "selectFirst" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_AUTOCOMPLETE_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeAutocomplete", first: true, predicate: AutoComplete, descendants: true }], ngImport: i0, template: "<p-autoComplete\n    (onFocus)=\"onFocus($event)\"\n    [formControl]=\"autocompleteFormControl\"\n    [placeholder]=\"placeholder\"\n    [dropdown]=\"true\"\n    [dataKey]=\"dataKeyProperty\"\n    [field]=\"itemsLabelProperty\"\n    [suggestions]=\"(suggestions$ | async) ?? []\"\n    [multiple]=\"multiselect\"\n    [showEmptyMessage]=\"true\"\n    [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n    [styleClass]=\"className\"\n    [panelStyleClass]=\"dropdownClassName\"\n    [minLength]=\"openOnFocus ? 0 : 1\"\n    [showClear]=\"showClear\"\n    [forceSelection]=\"autoClear\"\n    (completeMethod)=\"onSearch($event)\"\n    (onSelect)=\"onSelect($event)\"\n    (onBlur)=\"onBlur($event)\"\n    (onClear)=\"onClear()\"\n    (onShow)=\"onShow()\"\n    (onHide)=\"onHide()\"\n    appendTo=\"body\"\n    dropdownMode=\"current\">\n</p-autoComplete>\n", dependencies: [{ kind: "ngmodule", type: AutoCompleteModule }, { kind: "component", type: i3.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngAutocompleteComponent, isStandalone: true, selector: "mng-autocomplete", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", inlineSearch: "inlineSearch", openOnFocus: "openOnFocus", multiselect: "multiselect", placeholder: "placeholder", className: "className", dropdownClassName: "dropdownClassName", showClear: "showClear", autoClear: "autoClear", selectFirst: "selectFirst" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_AUTOCOMPLETE_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeAutocomplete", first: true, predicate: AutoComplete, descendants: true }], ngImport: i0, template: "<p-autoComplete\n    (onFocus)=\"onFocus($event)\"\n    [formControl]=\"autocompleteFormControl\"\n    [placeholder]=\"placeholder\"\n    [dropdown]=\"true\"\n    [dataKey]=\"dataKeyProperty\"\n    [optionLabel]=\"itemsLabelProperty\"\n    [suggestions]=\"(suggestions$ | async) ?? []\"\n    [multiple]=\"multiselect\"\n    [showEmptyMessage]=\"true\"\n    [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n    [styleClass]=\"className\"\n    [panelStyleClass]=\"dropdownClassName\"\n    [minLength]=\"openOnFocus ? 0 : 1\"\n    [showClear]=\"showClear\"\n    [forceSelection]=\"autoClear\"\n    (completeMethod)=\"onSearch($event)\"\n    (onSelect)=\"onSelect($event)\"\n    (onBlur)=\"onBlur($event)\"\n    (onClear)=\"onClear()\"\n    (onShow)=\"onShow()\"\n    (onHide)=\"onHide()\"\n    appendTo=\"body\"\n    dropdownMode=\"current\">\n</p-autoComplete>\n", dependencies: [{ kind: "ngmodule", type: AutoCompleteModule }, { kind: "component", type: i3.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngAutocompleteComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-autocomplete', providers: [MNG_AUTOCOMPLETE_VALUE_ACCESSOR], imports: [AutoCompleteModule, ReactiveFormsModule, AsyncPipe, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-autoComplete\n    (onFocus)=\"onFocus($event)\"\n    [formControl]=\"autocompleteFormControl\"\n    [placeholder]=\"placeholder\"\n    [dropdown]=\"true\"\n    [dataKey]=\"dataKeyProperty\"\n    [field]=\"itemsLabelProperty\"\n    [suggestions]=\"(suggestions$ | async) ?? []\"\n    [multiple]=\"multiselect\"\n    [showEmptyMessage]=\"true\"\n    [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n    [styleClass]=\"className\"\n    [panelStyleClass]=\"dropdownClassName\"\n    [minLength]=\"openOnFocus ? 0 : 1\"\n    [showClear]=\"showClear\"\n    [forceSelection]=\"autoClear\"\n    (completeMethod)=\"onSearch($event)\"\n    (onSelect)=\"onSelect($event)\"\n    (onBlur)=\"onBlur($event)\"\n    (onClear)=\"onClear()\"\n    (onShow)=\"onShow()\"\n    (onHide)=\"onHide()\"\n    appendTo=\"body\"\n    dropdownMode=\"current\">\n</p-autoComplete>\n" }]
+            args: [{ standalone: true, selector: 'mng-autocomplete', providers: [MNG_AUTOCOMPLETE_VALUE_ACCESSOR], imports: [AutoCompleteModule, ReactiveFormsModule, AsyncPipe, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-autoComplete\n    (onFocus)=\"onFocus($event)\"\n    [formControl]=\"autocompleteFormControl\"\n    [placeholder]=\"placeholder\"\n    [dropdown]=\"true\"\n    [dataKey]=\"dataKeyProperty\"\n    [optionLabel]=\"itemsLabelProperty\"\n    [suggestions]=\"(suggestions$ | async) ?? []\"\n    [multiple]=\"multiselect\"\n    [showEmptyMessage]=\"true\"\n    [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n    [styleClass]=\"className\"\n    [panelStyleClass]=\"dropdownClassName\"\n    [minLength]=\"openOnFocus ? 0 : 1\"\n    [showClear]=\"showClear\"\n    [forceSelection]=\"autoClear\"\n    (completeMethod)=\"onSearch($event)\"\n    (onSelect)=\"onSelect($event)\"\n    (onBlur)=\"onBlur($event)\"\n    (onClear)=\"onClear()\"\n    (onShow)=\"onShow()\"\n    (onHide)=\"onHide()\"\n    appendTo=\"body\"\n    dropdownMode=\"current\">\n</p-autoComplete>\n" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i2.TranslateService }, { type: MngFormlyFieldWrapperComponent, decorators: [{
                     type: Optional
                 }] }]; }, propDecorators: { dataProvider: [{
@@ -11720,7 +11721,7 @@ class MngDropdownComponent {
         return typeof this.onChangeFn !== 'undefined';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngDropdownComponent, deps: [{ token: i0.Injector }, { token: i2.TranslateService }, { token: MngFormlyFieldWrapperComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngDropdownComponent, isStandalone: true, selector: "mng-dropdown", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsDisabledProperty: "itemsDisabledProperty", multiselect: "multiselect", placeholder: "placeholder", showClear: "showClear", selectFirstItem: "selectFirstItem", className: "className", dropdownClassName: "dropdownClassName", changeValueOnBlur: "changeValueOnBlur" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_DROPDOWN_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeDropdown", first: true, predicate: Dropdown, descendants: true }], ngImport: i0, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"placeholder\"\n    [dataKey]=\"dataKeyProperty\"\n    [optionLabel]=\"itemsLabelProperty\"\n    [optionValue]=\"itemsValueProperty\"\n    [optionDisabled]=\"itemsDisabledProperty\"\n    [options]=\"(items$ | async) ?? undefined\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"className\"\n    [panelStyleClass]=\"dropdownClassName\"\n    (onBlur)=\"onDropdownBlur($event)\"\n    [dropdownIcon]=\"($loading | async) ?? false ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        [maxSelectedLabels]=\"1\"\n        [selectedItemsLabel]=\"'mngDropdown.multiselectOverMaxDisplayLimit' | translate\"\n        [formControl]=\"dropdownFormControl\"\n        [placeholder]=\"placeholder\"\n        [dataKey]=\"dataKeyProperty\"\n        [optionLabel]=\"itemsLabelProperty\"\n        [optionValue]=\"itemsValueProperty\"\n        [optionDisabled]=\"itemsDisabledProperty\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"className\"\n        [panelStyleClass]=\"dropdownClassName\"\n        [filter]=\"true\"\n        [showToggleAll]=\"false\"\n        (onPanelHide)=\"onPanelHide($event)\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i3$1.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i4$2.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "label", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectionLimit"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngDropdownComponent, isStandalone: true, selector: "mng-dropdown", inputs: { dataProvider: "dataProvider", dataKeyProperty: "dataKeyProperty", itemsLabelPropertyInit: ["itemsLabelProperty", "itemsLabelPropertyInit"], itemsLabelTranslate: "itemsLabelTranslate", itemsValuePropertyInit: ["itemsValueProperty", "itemsValuePropertyInit"], itemsDisabledProperty: "itemsDisabledProperty", multiselect: "multiselect", placeholder: "placeholder", showClear: "showClear", selectFirstItem: "selectFirstItem", className: "className", dropdownClassName: "dropdownClassName", changeValueOnBlur: "changeValueOnBlur" }, outputs: { valueChangeEventEmitter: "valueChange" }, providers: [MNG_DROPDOWN_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeDropdown", first: true, predicate: Dropdown, descendants: true }], ngImport: i0, template: "<p-dropdown\n    *ngIf=\"!multiselect; else pMultiselect\"\n    [formControl]=\"dropdownFormControl\"\n    [placeholder]=\"placeholder\"\n    [dataKey]=\"dataKeyProperty\"\n    [optionLabel]=\"itemsLabelProperty\"\n    [optionValue]=\"itemsValueProperty\"\n    [optionDisabled]=\"itemsDisabledProperty\"\n    [options]=\"(items$ | async) ?? undefined\"\n    [showClear]=\"showClear\"\n    [autoDisplayFirst]=\"false\"\n    [styleClass]=\"className\"\n    [panelStyleClass]=\"dropdownClassName\"\n    (onBlur)=\"onDropdownBlur($event)\"\n    [dropdownIcon]=\"($loading | async) ?? false ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\n    appendTo=\"body\">\n</p-dropdown>\n<ng-template #pMultiselect>\n    <p-multiSelect\n        [maxSelectedLabels]=\"1\"\n        [selectedItemsLabel]=\"'mngDropdown.multiselectOverMaxDisplayLimit' | translate\"\n        [formControl]=\"dropdownFormControl\"\n        [placeholder]=\"placeholder\"\n        [dataKey]=\"dataKeyProperty\"\n        [optionLabel]=\"itemsLabelProperty\"\n        [optionValue]=\"itemsValueProperty\"\n        [optionDisabled]=\"itemsDisabledProperty\"\n        [options]=\"(items$ | async) ?? []\"\n        [styleClass]=\"className\"\n        [panelStyleClass]=\"dropdownClassName\"\n        [filter]=\"true\"\n        [showToggleAll]=\"false\"\n        (onPanelHide)=\"onPanelHide($event)\"\n        appendTo=\"body\">\n    </p-multiSelect>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i3$1.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i4$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngDropdownComponent, decorators: [{
             type: Component,
@@ -11773,7 +11774,7 @@ class MngDateRangeComponent {
         this.formBuilder = formBuilder;
         this.showTime = false;
         this.showSeconds = false;
-        this.disabled = false;
+        this._disabled = false;
         // eslint-disable-next-line @typescript-eslint/no-empty-function
         this.onChangeFn = () => { };
         // eslint-disable-next-line @typescript-eslint/no-empty-function
@@ -11789,12 +11790,17 @@ class MngDateRangeComponent {
     get dateRangeCtrl() {
         return this.fromToFormControl.get('dateRange');
     }
+    set disabled(isDisabled) {
+        this._disabled = isDisabled;
+        this.setDisabledState(isDisabled);
+    }
     ngOnInit() {
         this.fromToFormControl = this.formBuilder.group({
             from: [],
             to: [],
             dateRange: []
         });
+        this.setDisabledState(this._disabled);
         this.subscriptions.push(merge(this.fromCtrl.valueChanges, this.toCtrl.valueChanges, this.dateRangeCtrl.valueChanges).subscribe(() => this.onValueChange()));
     }
     ngOnDestroy() {
@@ -11807,10 +11813,10 @@ class MngDateRangeComponent {
         this.onTouchedFn = fn;
     }
     setDisabledState(isDisabled) {
-        if (isDisabled) {
+        if (isDisabled && this.fromToFormControl.enabled) {
             this.fromToFormControl.disable();
         }
-        else {
+        else if (!isDisabled && this.fromToFormControl.disabled) {
             this.fromToFormControl.enable();
         }
     }
@@ -11851,11 +11857,11 @@ class MngDateRangeComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngDateRangeComponent, deps: [{ token: i1$3.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "16.2.6", type: MngDateRangeComponent, isStandalone: true, selector: "mng-date-range", inputs: { placeholder: "placeholder", showTime: "showTime", showSeconds: "showSeconds", dateFormat: "dateFormat", disabled: ["disabled", "disabled", booleanAttribute] }, providers: [MNG_DATE_RANGE_VALUE_ACCESSOR], ngImport: i0, template: "<ng-container *ngIf=\"showTime; else defaultRange\">\n    <div class=\"flex gap-2\">\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"fromCtrl\"\n            [maxDate]=\"toCtrl.value\"\n            [placeholder]=\"placeholder\"\n            [dateFormat]=\"dateFormat\"\n            [showTime]=\"showTime\"\n            [showSeconds]=\"showSeconds\"\n            [showIcon]=\"true\"\n            [firstDayOfWeek]=\"1\"\n            [disabled]=\"disabled\"\n            (onFocus)=\"onTouchedFn()\"></p-calendar>\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"toCtrl\"\n            [minDate]=\"fromCtrl.value\"\n            [placeholder]=\"placeholder\"\n            [dateFormat]=\"dateFormat\"\n            [showTime]=\"showTime\"\n            [showSeconds]=\"showSeconds\"\n            [showIcon]=\"true\"\n            [firstDayOfWeek]=\"1\"\n            [disabled]=\"disabled\"\n            (onFocus)=\"onTouchedFn()\"></p-calendar>\n    </div>\n</ng-container>\n<ng-template #defaultRange>\n    <p-calendar\n        appendTo=\"body\"\n        [formControl]=\"dateRangeCtrl\"\n        [placeholder]=\"placeholder\"\n        [dateFormat]=\"dateFormat\"\n        selectionMode=\"range\"\n        [showIcon]=\"true\"\n        [firstDayOfWeek]=\"1\"\n        [disabled]=\"disabled\"\n        (onFocus)=\"onTouchedFn()\"></p-calendar>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i2$3.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", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "16.2.6", type: MngDateRangeComponent, isStandalone: true, selector: "mng-date-range", inputs: { placeholder: "placeholder", showTime: "showTime", showSeconds: "showSeconds", dateFormat: "dateFormat", disabled: ["disabled", "disabled", booleanAttribute] }, providers: [MNG_DATE_RANGE_VALUE_ACCESSOR], ngImport: i0, template: "<ng-container *ngIf=\"showTime; else defaultRange\">\n    <div class=\"flex gap-2\">\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"fromCtrl\"\n            [maxDate]=\"toCtrl.value\"\n            [placeholder]=\"placeholder\"\n            [dateFormat]=\"dateFormat\"\n            [showTime]=\"showTime\"\n            [showSeconds]=\"showSeconds\"\n            [showIcon]=\"true\"\n            [firstDayOfWeek]=\"1\"\n            (onFocus)=\"onTouchedFn()\"></p-calendar>\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"toCtrl\"\n            [minDate]=\"fromCtrl.value\"\n            [placeholder]=\"placeholder\"\n            [dateFormat]=\"dateFormat\"\n            [showTime]=\"showTime\"\n            [showSeconds]=\"showSeconds\"\n            [showIcon]=\"true\"\n            [firstDayOfWeek]=\"1\"\n            (onFocus)=\"onTouchedFn()\"></p-calendar>\n    </div>\n</ng-container>\n<ng-template #defaultRange>\n    <p-calendar\n        appendTo=\"body\"\n        [formControl]=\"dateRangeCtrl\"\n        [placeholder]=\"placeholder\"\n        [dateFormat]=\"dateFormat\"\n        selectionMode=\"range\"\n        [showIcon]=\"true\"\n        [firstDayOfWeek]=\"1\"\n        (onFocus)=\"onTouchedFn()\"></p-calendar>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i2$3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngDateRangeComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-date-range', providers: [MNG_DATE_RANGE_VALUE_ACCESSOR], imports: [CalendarModule, ReactiveFormsModule, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"showTime; else defaultRange\">\n    <div class=\"flex gap-2\">\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"fromCtrl\"\n            [maxDate]=\"toCtrl.value\"\n            [placeholder]=\"placeholder\"\n            [dateFormat]=\"dateFormat\"\n            [showTime]=\"showTime\"\n            [showSeconds]=\"showSeconds\"\n            [showIcon]=\"true\"\n            [firstDayOfWeek]=\"1\"\n            [disabled]=\"disabled\"\n            (onFocus)=\"onTouchedFn()\"></p-calendar>\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"toCtrl\"\n            [minDate]=\"fromCtrl.value\"\n            [placeholder]=\"placeholder\"\n            [dateFormat]=\"dateFormat\"\n            [showTime]=\"showTime\"\n            [showSeconds]=\"showSeconds\"\n            [showIcon]=\"true\"\n            [firstDayOfWeek]=\"1\"\n            [disabled]=\"disabled\"\n            (onFocus)=\"onTouchedFn()\"></p-calendar>\n    </div>\n</ng-container>\n<ng-template #defaultRange>\n    <p-calendar\n        appendTo=\"body\"\n        [formControl]=\"dateRangeCtrl\"\n        [placeholder]=\"placeholder\"\n        [dateFormat]=\"dateFormat\"\n        selectionMode=\"range\"\n        [showIcon]=\"true\"\n        [firstDayOfWeek]=\"1\"\n        [disabled]=\"disabled\"\n        (onFocus)=\"onTouchedFn()\"></p-calendar>\n</ng-template>\n" }]
+            args: [{ standalone: true, selector: 'mng-date-range', providers: [MNG_DATE_RANGE_VALUE_ACCESSOR], imports: [CalendarModule, ReactiveFormsModule, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"showTime; else defaultRange\">\n    <div class=\"flex gap-2\">\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"fromCtrl\"\n            [maxDate]=\"toCtrl.value\"\n            [placeholder]=\"placeholder\"\n            [dateFormat]=\"dateFormat\"\n            [showTime]=\"showTime\"\n            [showSeconds]=\"showSeconds\"\n            [showIcon]=\"true\"\n            [firstDayOfWeek]=\"1\"\n            (onFocus)=\"onTouchedFn()\"></p-calendar>\n        <p-calendar\n            appendTo=\"body\"\n            [formControl]=\"toCtrl\"\n            [minDate]=\"fromCtrl.value\"\n            [placeholder]=\"placeholder\"\n            [dateFormat]=\"dateFormat\"\n            [showTime]=\"showTime\"\n            [showSeconds]=\"showSeconds\"\n            [showIcon]=\"true\"\n            [firstDayOfWeek]=\"1\"\n            (onFocus)=\"onTouchedFn()\"></p-calendar>\n    </div>\n</ng-container>\n<ng-template #defaultRange>\n    <p-calendar\n        appendTo=\"body\"\n        [formControl]=\"dateRangeCtrl\"\n        [placeholder]=\"placeholder\"\n        [dateFormat]=\"dateFormat\"\n        selectionMode=\"range\"\n        [showIcon]=\"true\"\n        [firstDayOfWeek]=\"1\"\n        (onFocus)=\"onTouchedFn()\"></p-calendar>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: i1$3.FormBuilder }]; }, propDecorators: { placeholder: [{
                 type: Input
             }], showTime: [{
@@ -12554,7 +12560,7 @@ class MngFormlyFieldInputComponent extends FieldType {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFormlyFieldInputComponent, deps: [{ token: LOCALE_ID }, { token: i1$3.FormBuilder }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngFormlyFieldInputComponent, isStandalone: true, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"props.type\">\n    <p-inputNumber\n        *ngSwitchCase=\"'number'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [min]=\"descriptor.numberAutoCorrect ? descriptor.numberMin : undefined\"\n        [max]=\"descriptor.numberAutoCorrect ? descriptor.numberMax : undefined\"\n        [step]=\"$any(descriptor.numberStep)\"\n        [useGrouping]=\"descriptor.numberUseGrouping\"\n        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [locale]=\"descriptor.locale ?? applicationLocale\"\n        [mode]=\"numberFieldMode\"\n        [currency]=\"currency\"\n        [currencyDisplay]=\"descriptor.currencyDisplay\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"field flex flex-column\">\n        <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ props.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n        <small *ngIf=\"showError\" class=\"p-error\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    </div>\n\n    <ng-container *ngSwitchCase=\"'radio'\">\n        <div *ngFor=\"let option of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"field-radiobutton\">\n            <p-radioButton\n                [name]=\"$any(key)\"\n                [value]=\"option.value\"\n                [formControl]=\"iFormControl\"\n                [formlyAttributes]=\"field\"\n                [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n            <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n        </div>\n    </ng-container>\n\n    <textarea\n        *ngSwitchCase=\"'textarea'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [rows]=\"descriptor.rows ?? 3\"\n        pInputTextarea\n        [class]=\"descriptor.inputClassName\">\n    </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        appendTo=\"body\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showSeconds]=\"descriptor.datePickerShowSeconds\"\n        [showIcon]=\"true\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [firstDayOfWeek]=\"1\">\n    </p-calendar>\n\n    <p-inputMask\n        *ngSwitchCase=\"'mask'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [mask]=\"descriptor.mask\"\n        [placeholder]=\"descriptor.placeholder\"\n        [slotChar]=\"$any(descriptor.slotChar)\"\n        [styleClass]=\"descriptor.inputClassName\">\n    </p-inputMask>\n\n    <p-fileUpload\n        #fileUploadInput\n        *ngSwitchCase=\"'file'\"\n        [disabled]=\"iFormControl.disabled\"\n        [multiple]=\"descriptor.fileMultiple\"\n        [accept]=\"descriptor.fileAccept\"\n        [maxFileSize]=\"descriptor.fileMaxFileSize\"\n        [showUploadButton]=\"false\"\n        (onSelect)=\"onFileSelect($event)\"\n        (onRemove)=\"onFileRemove($event)\"\n        (onClear)=\"onFileClear($event)\">\n        <ng-template let-file let-idx=\"index\" pTemplate=\"file\">\n            <div class=\"p-fileupload-row\">\n                <div>\n                    <ng-container *ngIf=\"fileUploadInput.isImage(file); else fileInputDocument\">\n                        <span *ngIf=\"isFileImageSvg(file); else fileInputImageDefault\" class=\"flex align-items-center justify-content-center\">\n                            <i class=\"pi pi-image text-2xl\"></i>\n                        </span>\n                        <ng-template #fileInputImageDefault>\n                            <img [src]=\"file.objectURL\" [width]=\"fileUploadInput.previewWidth\" (error)=\"fileUploadInput.imageError($event)\" />\n                        </ng-template>\n                    </ng-container>\n                    <ng-template #fileInputDocument>\n                        <span class=\"flex align-items-center justify-content-center\">\n                            <i [class]=\"'pi ' + getFileDocumentTypeIcon(file) + ' text-2xl'\"></i>\n                        </span>\n                    </ng-template>\n                </div>\n                <div class=\"p-fileupload-filename\">{{ file.name }}</div>\n                <div>{{ fileUploadInput.formatSize(file.size) }}</div>\n                <div>\n                    <button\n                        type=\"button\"\n                        pButton\n                        (click)=\"fileUploadInput.remove($event, idx)\"\n                        [disabled]=\"fileUploadInput.uploading\"\n                        class=\"p-button-icon-only\"\n                        [class]=\"fileUploadInput.removeStyleClass\">\n                        <TimesIcon *ngIf=\"!fileUploadInput.cancelIconTemplate\" />\n                    </button>\n                </div>\n            </div>\n        </ng-template>\n        <ng-template pTemplate=\"content\" let-files>\n            <div *ngIf=\"files.length === 0\" class=\"text-gray-300 dropdown-area\">\n                <span><i class=\"pi pi-file-import mr-2\"></i>{{ 'fileUpload.dragAndDrop' | translate }}</span>\n            </div>\n        </ng-template>\n    </p-fileUpload>\n\n    <div *ngSwitchCase=\"'imageUrl'\">\n        <div *ngIf=\"descriptor.imagePreview\" class=\"flex flex-wrap justify-content-start\">\n            <ng-container *ngFor=\"let image of imageFormArray.controls; let idx = index\">\n                <p-image\n                    *ngIf=\"imageFormArray.at(idx).valid && imageFormArray.at(idx).value; else noImage\"\n                    [src]=\"imageFormArray.at(idx).value\"\n                    [preview]=\"true\"\n                    (onImageError)=\"onImageUrlLoadError()\"\n                    styleClass=\"mng-image m-2\"></p-image>\n            </ng-container>\n            <ng-template #noImage>\n                <span class=\"mng-image m-2 p-image-preview-container no-image\">\n                    <div class=\"p-image-preview-indicator\">\n                        <i class=\"p-image-preview-icon pi pi-ban\"></i>\n                    </div>\n                </span>\n            </ng-template>\n        </div>\n        <ng-container *ngIf=\"!descriptor.imagePreview || descriptor.imageUrlInputVisibleOnDisabled || !iFormControl.disabled\">\n            <div *ngFor=\"let imageCtrlName of imageFormArray.controls; let idx = index\" class=\"p-inputgroup mt-1\">\n                <input\n                    pInputText\n                    [placeholder]=\"'mngEditor.imageUrlPlaceholder' | translate\"\n                    [id]=\"$any(key)\"\n                    type=\"text\"\n                    [formControl]=\"$any(imageFormArray.at(idx))\"\n                    [formlyAttributes]=\"field\" />\n                <button *ngIf=\"descriptor.fileMultiple && !iFormControl.disabled\" type=\"button\" pButton pRipple icon=\"pi pi-minus\" (click)=\"removeImageUrlAt(idx)\"></button>\n            </div>\n            <button\n                *ngIf=\"descriptor.fileMultiple && !iFormControl.disabled\"\n                type=\"button\"\n                pButton\n                pRipple\n                icon=\"pi pi-plus\"\n                class=\"p-button-primary w-auto mt-1\"\n                [label]=\"'mngEditor.imageUrlAdd' | translate\"\n                (click)=\"addImageUrl()\"></button>\n        </ng-container>\n    </div>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i3$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$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]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: i2$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i6$3.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy"], outputs: ["onChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i7$1.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i2$3.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", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: InputMaskModule }, { kind: "component", type: i10$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i11$1.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError"] }, { kind: "ngmodule", type: ImageModule }, { kind: "component", type: i12.Image, selector: "p-image", inputs: ["imageClass", "imageStyle", "styleClass", "style", "src", "srcSet", "sizes", "previewImageSrc", "previewImageSrcSet", "previewImageSizes", "alt", "width", "height", "appendTo", "preview", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide", "onImageError"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: InputTextareaModule }, { kind: "directive", type: i13.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6$4.InputText, selector: "[pInputText]" }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "component", type: TimesIcon, selector: "TimesIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngFormlyFieldInputComponent, isStandalone: true, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"props.type\">\n    <p-inputNumber\n        *ngSwitchCase=\"'number'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [min]=\"descriptor.numberAutoCorrect ? descriptor.numberMin : undefined\"\n        [max]=\"descriptor.numberAutoCorrect ? descriptor.numberMax : undefined\"\n        [step]=\"$any(descriptor.numberStep)\"\n        [useGrouping]=\"descriptor.numberUseGrouping\"\n        [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n        [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [locale]=\"descriptor.locale ?? applicationLocale\"\n        [mode]=\"numberFieldMode\"\n        [currency]=\"currency\"\n        [currencyDisplay]=\"descriptor.currencyDisplay\">\n    </p-inputNumber>\n\n    <div *ngSwitchCase=\"'switch'\" class=\"field flex flex-column\">\n        <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ props.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label>\n        <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n        <small *ngIf=\"showError\" class=\"p-error\">\n            <formly-validation-message [field]=\"field\"></formly-validation-message>\n        </small>\n    </div>\n\n    <ng-container *ngSwitchCase=\"'radio'\">\n        <div *ngFor=\"let option of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"field-radiobutton\">\n            <p-radioButton\n                [name]=\"$any(key)\"\n                [value]=\"option.value\"\n                [formControl]=\"iFormControl\"\n                [formlyAttributes]=\"field\"\n                [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n            <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n        </div>\n    </ng-container>\n\n    <textarea\n        *ngSwitchCase=\"'textarea'\"\n        [id]=\"$any(key)\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [rows]=\"descriptor.rows ?? 3\"\n        pInputTextarea\n        [class]=\"descriptor.inputClassName\">\n    </textarea>\n\n    <p-calendar\n        *ngSwitchCase=\"'datepicker'\"\n        appendTo=\"body\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n        [minDate]=\"$any(descriptor.datePickerMin)\"\n        [maxDate]=\"$any(descriptor.datePickerMax)\"\n        [showTime]=\"descriptor.datePickerShowTime\"\n        [showSeconds]=\"descriptor.datePickerShowSeconds\"\n        [showIcon]=\"true\"\n        [inputStyleClass]=\"descriptor.inputClassName\"\n        [firstDayOfWeek]=\"1\">\n    </p-calendar>\n\n    <p-inputMask\n        *ngSwitchCase=\"'mask'\"\n        [formControl]=\"iFormControl\"\n        [formlyAttributes]=\"field\"\n        [mask]=\"descriptor.mask\"\n        [placeholder]=\"descriptor.placeholder\"\n        [slotChar]=\"$any(descriptor.slotChar)\"\n        [styleClass]=\"descriptor.inputClassName\">\n    </p-inputMask>\n\n    <p-fileUpload\n        #fileUploadInput\n        *ngSwitchCase=\"'file'\"\n        [disabled]=\"iFormControl.disabled\"\n        [multiple]=\"descriptor.fileMultiple\"\n        [accept]=\"descriptor.fileAccept\"\n        [maxFileSize]=\"descriptor.fileMaxFileSize\"\n        [showUploadButton]=\"false\"\n        (onSelect)=\"onFileSelect($event)\"\n        (onRemove)=\"onFileRemove($event)\"\n        (onClear)=\"onFileClear($event)\">\n        <ng-template let-file let-idx=\"index\" pTemplate=\"file\">\n            <div class=\"p-fileupload-row\">\n                <div>\n                    <ng-container *ngIf=\"fileUploadInput.isImage(file); else fileInputDocument\">\n                        <span *ngIf=\"isFileImageSvg(file); else fileInputImageDefault\" class=\"flex align-items-center justify-content-center\">\n                            <i class=\"pi pi-image text-2xl\"></i>\n                        </span>\n                        <ng-template #fileInputImageDefault>\n                            <img [src]=\"file.objectURL\" [width]=\"fileUploadInput.previewWidth\" (error)=\"fileUploadInput.imageError($event)\" />\n                        </ng-template>\n                    </ng-container>\n                    <ng-template #fileInputDocument>\n                        <span class=\"flex align-items-center justify-content-center\">\n                            <i [class]=\"'pi ' + getFileDocumentTypeIcon(file) + ' text-2xl'\"></i>\n                        </span>\n                    </ng-template>\n                </div>\n                <div class=\"p-fileupload-filename\">{{ file.name }}</div>\n                <div>{{ fileUploadInput.formatSize(file.size) }}</div>\n                <div>\n                    <button\n                        type=\"button\"\n                        pButton\n                        (click)=\"fileUploadInput.remove($event, idx)\"\n                        [disabled]=\"fileUploadInput.uploading\"\n                        class=\"p-button-icon-only\"\n                        [class]=\"fileUploadInput.removeStyleClass\">\n                        <TimesIcon *ngIf=\"!fileUploadInput.cancelIconTemplate\" />\n                    </button>\n                </div>\n            </div>\n        </ng-template>\n        <ng-template pTemplate=\"content\" let-files>\n            <div *ngIf=\"files.length === 0\" class=\"text-gray-300 dropdown-area\">\n                <span><i class=\"pi pi-file-import mr-2\"></i>{{ 'fileUpload.dragAndDrop' | translate }}</span>\n            </div>\n        </ng-template>\n    </p-fileUpload>\n\n    <div *ngSwitchCase=\"'imageUrl'\">\n        <div *ngIf=\"descriptor.imagePreview\" class=\"flex flex-wrap justify-content-start\">\n            <ng-container *ngFor=\"let image of imageFormArray.controls; let idx = index\">\n                <p-image\n                    *ngIf=\"imageFormArray.at(idx).valid && imageFormArray.at(idx).value; else noImage\"\n                    [src]=\"imageFormArray.at(idx).value\"\n                    [preview]=\"true\"\n                    (onImageError)=\"onImageUrlLoadError()\"\n                    styleClass=\"mng-image m-2\"></p-image>\n            </ng-container>\n            <ng-template #noImage>\n                <span class=\"mng-image m-2 p-image-preview-container no-image\">\n                    <div class=\"p-image-preview-indicator\">\n                        <i class=\"p-image-preview-icon pi pi-ban\"></i>\n                    </div>\n                </span>\n            </ng-template>\n        </div>\n        <ng-container *ngIf=\"!descriptor.imagePreview || descriptor.imageUrlInputVisibleOnDisabled || !iFormControl.disabled\">\n            <div *ngFor=\"let imageCtrlName of imageFormArray.controls; let idx = index\" class=\"p-inputgroup mt-1\">\n                <input\n                    pInputText\n                    [placeholder]=\"'mngEditor.imageUrlPlaceholder' | translate\"\n                    [id]=\"$any(key)\"\n                    type=\"text\"\n                    [formControl]=\"$any(imageFormArray.at(idx))\"\n                    [formlyAttributes]=\"field\" />\n                <button *ngIf=\"descriptor.fileMultiple && !iFormControl.disabled\" type=\"button\" pButton pRipple icon=\"pi pi-minus\" (click)=\"removeImageUrlAt(idx)\"></button>\n            </div>\n            <button\n                *ngIf=\"descriptor.fileMultiple && !iFormControl.disabled\"\n                type=\"button\"\n                pButton\n                pRipple\n                icon=\"pi pi-plus\"\n                class=\"p-button-primary w-auto mt-1\"\n                [label]=\"'mngEditor.imageUrlAdd' | translate\"\n                (click)=\"addImageUrl()\"></button>\n        </ng-container>\n    </div>\n\n    <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i3$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$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]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$2.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: i2$2.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i6$3.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy"], outputs: ["onChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i7$1.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i2$3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: InputMaskModule }, { kind: "component", type: i10$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i11$1.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError"] }, { kind: "ngmodule", type: ImageModule }, { kind: "component", type: i12.Image, selector: "p-image", inputs: ["imageClass", "imageStyle", "styleClass", "style", "src", "srcSet", "sizes", "previewImageSrc", "previewImageSrcSet", "previewImageSizes", "alt", "width", "height", "loading", "appendTo", "preview", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide", "onImageError"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: InputTextareaModule }, { kind: "directive", type: i13.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6$4.InputText, selector: "[pInputText]" }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "component", type: TimesIcon, selector: "TimesIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFormlyFieldInputComponent, decorators: [{
             type: Component,
@@ -13059,7 +13065,7 @@ class MngTableColumnFilterFullComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTableColumnFilterFullComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTableColumnFilterFullComponent, isStandalone: true, selector: "mng-table-column-filter-full", inputs: { descriptor: "descriptor" }, viewQueries: [{ propertyName: "icon", first: true, predicate: ["icon"], descendants: true }], ngImport: i0, template: "<div class=\"p-column-filter p-column-filter-row\">\n    <ng-container [ngSwitch]=\"primeType\">\n        <input\n            *ngSwitchCase=\"'text'\"\n            type=\"text\"\n            pInputText\n            [value]=\"filterConstraint()?.value\"\n            [disabled]=\"isInputDisabled()\"\n            (input)=\"onTextModelChange($event)\"\n            (keydown.enter)=\"onTextInputEnterKeyDown($event)\"\n            [attr.placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\" />\n        <p-inputNumber\n            *ngSwitchCase=\"'numeric'\"\n            [ngModel]=\"filterConstraint()?.value\"\n            (ngModelChange)=\"onNumericModelChange($event)\"\n            (onKeyDown)=\"onNumericInputKeyDown($event)\"\n            [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n            [useGrouping]=\"descriptor.numberUseGrouping\"\n            [minFractionDigits]=\"descriptor.numberMinFractionDigits\"\n            [maxFractionDigits]=\"descriptor.numberMaxFractionDigits\"\n            [disabled]=\"isInputDisabled()\"></p-inputNumber>\n        <p-triStateCheckbox *ngSwitchCase=\"'boolean'\" [ngModel]=\"filterConstraint()?.value\" (ngModelChange)=\"onTristateModelChange($event)\"></p-triStateCheckbox>\n        <ng-container *ngSwitchCase=\"'date'\">\n            <ng-container *ngIf=\"activeMatchMode === 'between'; else datePicker\">\n                <mng-date-range\n                    [ngModel]=\"filterConstraint()?.value\"\n                    (ngModelChange)=\"dateFilter($event)\"\n                    [showTime]=\"descriptor.datePickerShowTime\"\n                    [dateFormat]=\"descriptor.datePickerFormat\"\n                    [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n                    [disabled]=\"isInputDisabled()\"></mng-date-range>\n            </ng-container>\n            <ng-template #datePicker>\n                <p-calendar\n                    appendTo=\"body\"\n                    [ngModel]=\"filterConstraint()?.value\"\n                    (ngModelChange)=\"dateFilter($event)\"\n                    [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n                    [showIcon]=\"true\"\n                    [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n                    [showTime]=\"descriptor.datePickerShowTime\"\n                    [firstDayOfWeek]=\"1\">\n                </p-calendar>\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'lookup'\">\n            <ng-container *ngIf=\"lookupDescriptor\" [ngSwitch]=\"lookupDescriptor.lookupType\">\n                <mng-autocomplete\n                    *ngSwitchCase=\"lookupTypeAutocomplete\"\n                    [ngModel]=\"filterConstraint()?.value\"\n                    [dataProvider]=\"lookupDescriptor.dataProvider\"\n                    [dataKeyProperty]=\"lookupDescriptor.itemsValueProperty\"\n                    [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                    [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                    [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                    [multiselect]=\"lookupDescriptor.multiselect\"\n                    [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n                    [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n                    [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n                    [className]=\"lookupDescriptor.className\"\n                    [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                    [disabled]=\"isInputDisabled()\"\n                    (valueChange)=\"autocompleteFilter($event)\">\n                </mng-autocomplete>\n                <mng-dropdown\n                    *ngSwitchCase=\"lookupTypeDropdown\"\n                    [ngModel]=\"filterConstraint()?.value\"\n                    [dataProvider]=\"lookupDescriptor.dataProvider\"\n                    [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                    [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                    [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                    [multiselect]=\"lookupDescriptor.multiselect\"\n                    [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                    [className]=\"lookupDescriptor.className\"\n                    [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                    [showClear]=\"false\"\n                    [changeValueOnBlur]=\"lookupDescriptor.multiselect\"\n                    [disabled]=\"isInputDisabled()\"\n                    (valueChange)=\"dropdownFilter($event)\">\n                </mng-dropdown>\n            </ng-container>\n        </ng-container>\n    </ng-container>\n\n    <button\n        *ngIf=\"matchModes().length > 1\"\n        #icon\n        type=\"button\"\n        class=\"p-column-filter-menu-button p-link\"\n        aria-haspopup=\"true\"\n        [attr.aria-expanded]=\"overlayVisible()\"\n        [ngClass]=\"{'p-column-filter-menu-button-open': overlayVisible(), 'p-column-filter-menu-button-active': isFilterSet()}\"\n        (click)=\"toggleMenu($event)\"\n        (keydown)=\"onToggleButtonKeyDown($event)\">\n        <FilterIcon [styleClass]=\"'pi-filter-icon'\" />\n    </button>\n    <button #icon [ngClass]=\"{'p-hidden-space': !isFilterSet()}\" type=\"button\" class=\"p-column-filter-clear-button p-link\" (click)=\"clearFilter()\">\n        <FilterSlashIcon />\n    </button>\n    <div\n        *ngIf=\"overlayVisible()\"\n        class=\"p-column-filter-overlay p-component p-fluid\"\n        (click)=\"onContentClick()\"\n        [@overlayAnimation]=\"'visible'\"\n        (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\n        (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\n        (keydown.escape)=\"onEscape()\">\n        <ul class=\"p-column-filter-row-items\">\n            <li\n                class=\"p-column-filter-row-item\"\n                *ngFor=\"let matchMode of matchModes(); let i = index\"\n                (click)=\"onMatchModeChange(matchMode.value)\"\n                (keydown)=\"onMatchModeKeyDown($event)\"\n                (keydown.enter)=\"this.onMatchModeChange(matchMode.value)\"\n                [ngClass]=\"{'p-highlight': matchMode.value === filterConstraint()?.matchMode}\"\n                [attr.tabindex]=\"i === 0 ? '0' : null\">\n                {{ matchMode.label }}\n            </li>\n            <li class=\"p-column-filter-separator\"></li>\n            <li class=\"p-column-filter-row-item\" (click)=\"onRowClearItemClick()\" (keydown)=\"onMatchModeKeyDown($event)\" (keydown.enter)=\"onRowClearItemClick()\">\n                {{ noFilterLabel }}\n            </li>\n        </ul>\n    </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: MngDateRangeComponent, selector: "mng-date-range", inputs: ["placeholder", "showTime", "showSeconds", "dateFormat", "disabled"] }, { kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i2$3.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", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "component", type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName", "showClear", "autoClear", "selectFirst"], outputs: ["valueChange"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsLabelTranslate", "itemsValueProperty", "itemsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TriStateCheckboxModule }, { kind: "component", type: i4$3.TriStateCheckbox, selector: "p-triStateCheckbox", inputs: ["disabled", "name", "ariaLabelledBy", "tabindex", "inputId", "style", "styleClass", "label", "readonly", "checkboxTrueIcon", "checkboxFalseIcon"], outputs: ["onChange"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i3$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6$4.InputText, selector: "[pInputText]" }, { kind: "component", type: FilterIcon, selector: "FilterIcon" }, { kind: "component", type: FilterSlashIcon, selector: "FilterSlashIcon" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTableColumnFilterFullComponent, isStandalone: true, selector: "mng-table-column-filter-full", inputs: { descriptor: "descriptor" }, viewQueries: [{ propertyName: "icon", first: true, predicate: ["icon"], descendants: true }], ngImport: i0, template: "<div class=\"p-column-filter p-column-filter-row\">\n    <ng-container [ngSwitch]=\"primeType\">\n        <input\n            *ngSwitchCase=\"'text'\"\n            type=\"text\"\n            pInputText\n            [value]=\"filterConstraint()?.value\"\n            [disabled]=\"isInputDisabled()\"\n            (input)=\"onTextModelChange($event)\"\n            (keydown.enter)=\"onTextInputEnterKeyDown($event)\"\n            [attr.placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\" />\n        <p-inputNumber\n            *ngSwitchCase=\"'numeric'\"\n            [ngModel]=\"filterConstraint()?.value\"\n            (ngModelChange)=\"onNumericModelChange($event)\"\n            (onKeyDown)=\"onNumericInputKeyDown($event)\"\n            [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n            [useGrouping]=\"descriptor.numberUseGrouping\"\n            [minFractionDigits]=\"descriptor.numberMinFractionDigits\"\n            [maxFractionDigits]=\"descriptor.numberMaxFractionDigits\"\n            [disabled]=\"isInputDisabled()\"></p-inputNumber>\n        <p-triStateCheckbox *ngSwitchCase=\"'boolean'\" [ngModel]=\"filterConstraint()?.value\" (ngModelChange)=\"onTristateModelChange($event)\"></p-triStateCheckbox>\n        <ng-container *ngSwitchCase=\"'date'\">\n            <ng-container *ngIf=\"activeMatchMode === 'between'; else datePicker\">\n                <mng-date-range\n                    [ngModel]=\"filterConstraint()?.value\"\n                    (ngModelChange)=\"dateFilter($event)\"\n                    [showTime]=\"descriptor.datePickerShowTime\"\n                    [dateFormat]=\"descriptor.datePickerFormat\"\n                    [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n                    [disabled]=\"isInputDisabled()\"></mng-date-range>\n            </ng-container>\n            <ng-template #datePicker>\n                <p-calendar\n                    appendTo=\"body\"\n                    [ngModel]=\"filterConstraint()?.value\"\n                    (ngModelChange)=\"dateFilter($event)\"\n                    [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n                    [showIcon]=\"true\"\n                    [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n                    [showTime]=\"descriptor.datePickerShowTime\"\n                    [firstDayOfWeek]=\"1\">\n                </p-calendar>\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'lookup'\">\n            <ng-container *ngIf=\"lookupDescriptor\" [ngSwitch]=\"lookupDescriptor.lookupType\">\n                <mng-autocomplete\n                    *ngSwitchCase=\"lookupTypeAutocomplete\"\n                    [ngModel]=\"filterConstraint()?.value\"\n                    [dataProvider]=\"lookupDescriptor.dataProvider\"\n                    [dataKeyProperty]=\"lookupDescriptor.itemsValueProperty\"\n                    [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                    [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                    [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                    [multiselect]=\"lookupDescriptor.multiselect\"\n                    [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n                    [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n                    [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n                    [className]=\"lookupDescriptor.className\"\n                    [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                    [disabled]=\"isInputDisabled()\"\n                    (valueChange)=\"autocompleteFilter($event)\">\n                </mng-autocomplete>\n                <mng-dropdown\n                    *ngSwitchCase=\"lookupTypeDropdown\"\n                    [ngModel]=\"filterConstraint()?.value\"\n                    [dataProvider]=\"lookupDescriptor.dataProvider\"\n                    [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                    [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                    [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                    [multiselect]=\"lookupDescriptor.multiselect\"\n                    [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                    [className]=\"lookupDescriptor.className\"\n                    [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                    [showClear]=\"false\"\n                    [changeValueOnBlur]=\"lookupDescriptor.multiselect\"\n                    [disabled]=\"isInputDisabled()\"\n                    (valueChange)=\"dropdownFilter($event)\">\n                </mng-dropdown>\n            </ng-container>\n        </ng-container>\n    </ng-container>\n\n    <button\n        *ngIf=\"matchModes().length > 1\"\n        #icon\n        type=\"button\"\n        class=\"p-column-filter-menu-button p-link\"\n        aria-haspopup=\"true\"\n        [attr.aria-expanded]=\"overlayVisible()\"\n        [ngClass]=\"{'p-column-filter-menu-button-open': overlayVisible(), 'p-column-filter-menu-button-active': isFilterSet()}\"\n        (click)=\"toggleMenu($event)\"\n        (keydown)=\"onToggleButtonKeyDown($event)\">\n        <FilterIcon [styleClass]=\"'pi-filter-icon'\" />\n    </button>\n    <button #icon [ngClass]=\"{'p-hidden-space': !isFilterSet()}\" type=\"button\" class=\"p-column-filter-clear-button p-link\" (click)=\"clearFilter()\">\n        <FilterSlashIcon />\n    </button>\n    <div\n        *ngIf=\"overlayVisible()\"\n        class=\"p-column-filter-overlay p-component p-fluid\"\n        (click)=\"onContentClick()\"\n        [@overlayAnimation]=\"'visible'\"\n        (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\n        (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\n        (keydown.escape)=\"onEscape()\">\n        <ul class=\"p-column-filter-row-items\">\n            <li\n                class=\"p-column-filter-row-item\"\n                *ngFor=\"let matchMode of matchModes(); let i = index\"\n                (click)=\"onMatchModeChange(matchMode.value)\"\n                (keydown)=\"onMatchModeKeyDown($event)\"\n                (keydown.enter)=\"this.onMatchModeChange(matchMode.value)\"\n                [ngClass]=\"{'p-highlight': matchMode.value === filterConstraint()?.matchMode}\"\n                [attr.tabindex]=\"i === 0 ? '0' : null\">\n                {{ matchMode.label }}\n            </li>\n            <li class=\"p-column-filter-separator\"></li>\n            <li class=\"p-column-filter-row-item\" (click)=\"onRowClearItemClick()\" (keydown)=\"onMatchModeKeyDown($event)\" (keydown.enter)=\"onRowClearItemClick()\">\n                {{ noFilterLabel }}\n            </li>\n        </ul>\n    </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: MngDateRangeComponent, selector: "mng-date-range", inputs: ["placeholder", "showTime", "showSeconds", "dateFormat", "disabled"] }, { kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i2$3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "component", type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName", "showClear", "autoClear", "selectFirst"], outputs: ["valueChange"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsLabelTranslate", "itemsValueProperty", "itemsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TriStateCheckboxModule }, { kind: "component", type: i4$3.TriStateCheckbox, selector: "p-triStateCheckbox", inputs: ["disabled", "name", "ariaLabel", "ariaLabelledBy", "tabindex", "inputId", "style", "styleClass", "label", "readonly", "checkboxTrueIcon", "checkboxFalseIcon"], outputs: ["onChange"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i3$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6$4.InputText, selector: "[pInputText]" }, { kind: "component", type: FilterIcon, selector: "FilterIcon" }, { kind: "component", type: FilterSlashIcon, selector: "FilterSlashIcon" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], animations: [
             trigger('overlayAnimation', [
                 transition(':enter', [style({ opacity: 0, transform: 'scaleY(0.8)' }), animate('.12s cubic-bezier(0, 0, 0.2, 1)')]),
                 transition(':leave', [animate('.1s linear', style({ opacity: 0 }))])
@@ -13192,7 +13198,7 @@ class MngTableColumnFilterComponent {
         filterCallback(value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTableColumnFilterComponent, deps: [{ token: i1$2.PrimeNGConfig }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTableColumnFilterComponent, isStandalone: true, selector: "mng-table-column-filter", inputs: { descriptor: "descriptor" }, viewQueries: [{ propertyName: "primeColumnFilter", first: true, predicate: ColumnFilter, descendants: true }], ngImport: i0, template: "<p-columnFilter\n    class=\"ml-auto\"\n    [type]=\"primeType\"\n    [field]=\"descriptor.property\"\n    [display]=\"primeDisplay\"\n    [matchMode]=\"primeDefaultMatchMode\"\n    [matchModeOptions]=\"primeMatchModeCustomOptions\"\n    [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n    [showMatchModes]=\"true\"\n    [showOperator]=\"false\"\n    [showAddButton]=\"false\"\n    [hideOnClear]=\"true\"\n    [showMenu]=\"primeShowMatchMode\"\n    [minFractionDigits]=\"descriptor.numberMinFractionDigits\"\n    [maxFractionDigits]=\"descriptor.numberMaxFractionDigits\"\n    [useGrouping]=\"descriptor.numberUseGrouping\">\n    <ng-template *ngIf=\"primeType === 'date'\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <ng-container *ngIf=\"activeMatchMode === 'between'; else datePicker\">\n            <mng-date-range\n                [ngModel]=\"value\"\n                (ngModelChange)=\"dateFilter($event, filterCallback)\"\n                [showTime]=\"descriptor.datePickerShowTime\"\n                [dateFormat]=\"descriptor.datePickerFormat\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"></mng-date-range>\n        </ng-container>\n        <ng-template #datePicker>\n            <p-calendar\n                appendTo=\"body\"\n                [ngModel]=\"value\"\n                (ngModelChange)=\"dateFilter($event, filterCallback)\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n                [showIcon]=\"true\"\n                [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n                [showTime]=\"descriptor.datePickerShowTime\"\n                [firstDayOfWeek]=\"1\">\n            </p-calendar>\n        </ng-template>\n    </ng-template>\n    <ng-template *ngIf=\"lookupDescriptor\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <ng-container [ngSwitch]=\"lookupDescriptor.lookupType\">\n            <mng-autocomplete\n                *ngSwitchCase=\"lookupTypeAutocomplete\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [dataKeyProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n                [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                (valueChange)=\"autocompleteFilter($event, filterCallback)\">\n            </mng-autocomplete>\n            <mng-dropdown\n                *ngSwitchCase=\"lookupTypeDropdown\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                [showClear]=\"false\"\n                [changeValueOnBlur]=\"lookupDescriptor.multiselect\"\n                (valueChange)=\"dropdownFilter($event, filterCallback)\">\n            </mng-dropdown>\n        </ng-container>\n    </ng-template>\n</p-columnFilter>\n", dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", 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", "showButtons"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: MngDateRangeComponent, selector: "mng-date-range", inputs: ["placeholder", "showTime", "showSeconds", "dateFormat", "disabled"] }, { kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i2$3.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", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "component", type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName", "showClear", "autoClear", "selectFirst"], outputs: ["valueChange"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsLabelTranslate", "itemsValueProperty", "itemsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTableColumnFilterComponent, isStandalone: true, selector: "mng-table-column-filter", inputs: { descriptor: "descriptor" }, viewQueries: [{ propertyName: "primeColumnFilter", first: true, predicate: ColumnFilter, descendants: true }], ngImport: i0, template: "<p-columnFilter\n    class=\"ml-auto\"\n    [type]=\"primeType\"\n    [field]=\"descriptor.property\"\n    [display]=\"primeDisplay\"\n    [matchMode]=\"primeDefaultMatchMode\"\n    [matchModeOptions]=\"primeMatchModeCustomOptions\"\n    [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n    [showMatchModes]=\"true\"\n    [showOperator]=\"false\"\n    [showAddButton]=\"false\"\n    [hideOnClear]=\"true\"\n    [showMenu]=\"primeShowMatchMode\"\n    [minFractionDigits]=\"descriptor.numberMinFractionDigits\"\n    [maxFractionDigits]=\"descriptor.numberMaxFractionDigits\"\n    [useGrouping]=\"descriptor.numberUseGrouping\">\n    <ng-template *ngIf=\"primeType === 'date'\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <ng-container *ngIf=\"activeMatchMode === 'between'; else datePicker\">\n            <mng-date-range\n                [ngModel]=\"value\"\n                (ngModelChange)=\"dateFilter($event, filterCallback)\"\n                [showTime]=\"descriptor.datePickerShowTime\"\n                [dateFormat]=\"descriptor.datePickerFormat\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"></mng-date-range>\n        </ng-container>\n        <ng-template #datePicker>\n            <p-calendar\n                appendTo=\"body\"\n                [ngModel]=\"value\"\n                (ngModelChange)=\"dateFilter($event, filterCallback)\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n                [showIcon]=\"true\"\n                [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n                [showTime]=\"descriptor.datePickerShowTime\"\n                [firstDayOfWeek]=\"1\">\n            </p-calendar>\n        </ng-template>\n    </ng-template>\n    <ng-template *ngIf=\"lookupDescriptor\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n        <ng-container [ngSwitch]=\"lookupDescriptor.lookupType\">\n            <mng-autocomplete\n                *ngSwitchCase=\"lookupTypeAutocomplete\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [dataKeyProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n                [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                (valueChange)=\"autocompleteFilter($event, filterCallback)\">\n            </mng-autocomplete>\n            <mng-dropdown\n                *ngSwitchCase=\"lookupTypeDropdown\"\n                [ngModel]=\"value\"\n                [dataProvider]=\"lookupDescriptor.dataProvider\"\n                [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n                [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n                [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n                [multiselect]=\"lookupDescriptor.multiselect\"\n                [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n                [className]=\"lookupDescriptor.className\"\n                [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n                [showClear]=\"false\"\n                [changeValueOnBlur]=\"lookupDescriptor.multiselect\"\n                (valueChange)=\"dropdownFilter($event, filterCallback)\">\n            </mng-dropdown>\n        </ng-container>\n    </ng-template>\n</p-columnFilter>\n", dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", 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", "showButtons"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: MngDateRangeComponent, selector: "mng-date-range", inputs: ["placeholder", "showTime", "showSeconds", "dateFormat", "disabled"] }, { kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i2$3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "component", type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName", "showClear", "autoClear", "selectFirst"], outputs: ["valueChange"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsLabelTranslate", "itemsValueProperty", "itemsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTableColumnFilterComponent, decorators: [{
             type: Component,
@@ -13264,7 +13270,7 @@ class MngTableColumnValueComponent {
         this.messageService.add({ severity: 'info', summary: title, detail: message });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTableColumnValueComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.MessageService }, { token: i2.TranslateService }, { token: JsonPathPipe }, { token: MngGetterPipe }, { token: MngTemplatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTableColumnValueComponent, isStandalone: true, selector: "mng-table-column-value", inputs: { descriptor: "descriptor", item: "item" }, host: { properties: { "style.max-width.px": "this.styleMaxWidth", "class": "this.className" } }, ngImport: i0, template: "<ng-container [ngSwitch]=\"descriptor.columnDisplayType\">\n    <i\n        *ngIf=\"descriptor.localizationExistsProperty && !item[descriptor.localizationExistsProperty]\"\n        class=\"pi pi-exclamation-circle\"\n        [pTooltip]=\"'mngTable.translationMissing' | translate\"></i>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeString\">\n        <span *ngIf=\"descriptor.hasValueAsTooltip\" [pTooltip]=\"value\" tooltipPosition=\"left\">{{ value }}</span>\n        <ng-container *ngIf=\"!descriptor.hasValueAsTooltip\">{{ value }}</ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeHtml\">\n        <span [innerHTML]=\"value\"></span>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeNumber\">\n        {{ value | number : descriptor.displayFormat : descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeCurrency\">\n        {{ value | currency : currency : descriptor.currencyDisplay : descriptor.displayFormat : descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeDate\">\n        {{ value | date : descriptor.displayFormat }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeBoolean\">\n        <ng-container *ngIf=\"descriptor.booleanAsIcon; else booleanText\">\n            <i [class]=\"value | boolean : descriptor.booleanYes : descriptor.booleanNo : true\"></i>\n        </ng-container>\n        <ng-template #booleanText>\n            {{ value | boolean : descriptor.booleanYes : descriptor.booleanNo | translate }}\n        </ng-template>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeEnum\">\n        {{ value | enum : descriptor.enumType : descriptor.enumTitlePath : descriptor.enumNameAsValue | translate }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeComponent\">\n        <ng-container\n            [mngComponent]=\"descriptor.customComponentType!\"\n            [inputs]=\"{\n                value: value,\n                item: item,\n                descriptor: descriptor\n            }\"></ng-container>\n    </ng-container>\n</ng-container>\n<div class=\"help-buttons\" *ngIf=\"descriptor.hasCopyToClipboard\">\n    <button pButton pRipple type=\"button\" icon=\"pi pi-copy\" class=\"p-button-rounded p-button-info p-button-sm\" (click)=\"copyToClipboard($event)\"></button>\n</div>\n", styles: [":host{display:inline-block;overflow:hidden}:host.nowrap{white-space:nowrap;text-overflow:ellipsis}:host.multiline{white-space:pre-wrap;word-wrap:break-word}.help-buttons{display:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}.help-buttons .p-button{height:1.9rem;width:1.9rem;padding:0}\n"], dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["id", "tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: CurrencyPipe, name: "currency" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: MngBooleanPipe, name: "boolean" }, { kind: "pipe", type: MngEnumPipe, name: "enum" }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTableColumnValueComponent, isStandalone: true, selector: "mng-table-column-value", inputs: { descriptor: "descriptor", item: "item" }, host: { properties: { "style.max-width.px": "this.styleMaxWidth", "class": "this.className" } }, ngImport: i0, template: "<ng-container [ngSwitch]=\"descriptor.columnDisplayType\">\n    <i\n        *ngIf=\"descriptor.localizationExistsProperty && !item[descriptor.localizationExistsProperty]\"\n        class=\"pi pi-exclamation-circle\"\n        [pTooltip]=\"'mngTable.translationMissing' | translate\"></i>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeString\">\n        <span *ngIf=\"descriptor.hasValueAsTooltip\" [pTooltip]=\"value\" tooltipPosition=\"left\">{{ value }}</span>\n        <ng-container *ngIf=\"!descriptor.hasValueAsTooltip\">{{ value }}</ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeHtml\">\n        <span [innerHTML]=\"value\"></span>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeNumber\">\n        {{ value | number : descriptor.displayFormat : descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeCurrency\">\n        {{ value | currency : currency : descriptor.currencyDisplay : descriptor.displayFormat : descriptor.locale }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeDate\">\n        {{ value | date : descriptor.displayFormat }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeBoolean\">\n        <ng-container *ngIf=\"descriptor.booleanAsIcon; else booleanText\">\n            <i [class]=\"value | boolean : descriptor.booleanYes : descriptor.booleanNo : true\"></i>\n        </ng-container>\n        <ng-template #booleanText>\n            {{ value | boolean : descriptor.booleanYes : descriptor.booleanNo | translate }}\n        </ng-template>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeEnum\">\n        {{ value | enum : descriptor.enumType : descriptor.enumTitlePath : descriptor.enumNameAsValue | translate }}\n    </ng-container>\n    <ng-container *ngSwitchCase=\"columnDisplayTypeComponent\">\n        <ng-container\n            [mngComponent]=\"descriptor.customComponentType!\"\n            [inputs]=\"{\n                value: value,\n                item: item,\n                descriptor: descriptor\n            }\"></ng-container>\n    </ng-container>\n</ng-container>\n<div class=\"help-buttons\" *ngIf=\"descriptor.hasCopyToClipboard\">\n    <button pButton pRipple type=\"button\" icon=\"pi pi-copy\" class=\"p-button-rounded p-button-info p-button-sm\" (click)=\"copyToClipboard($event)\"></button>\n</div>\n", styles: [":host{display:inline-block;overflow:hidden}:host.nowrap{white-space:nowrap;text-overflow:ellipsis}:host.multiline{white-space:pre-wrap;word-wrap:break-word}.help-buttons{display:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}.help-buttons .p-button{height:1.9rem;width:1.9rem;padding:0}\n"], dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: CurrencyPipe, name: "currency" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: MngBooleanPipe, name: "boolean" }, { kind: "pipe", type: MngEnumPipe, name: "enum" }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTableColumnValueComponent, decorators: [{
             type: Component,
@@ -13926,7 +13932,7 @@ class MngTableComponent {
         this.layoutPreferences = {};
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTableComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i2.TranslateService }, { token: MngCommonsService }, { token: MngActionExecutorService }, { token: MngViewContainerComponentService, optional: true }, { token: MngLocalStorageService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTableComponent, isStandalone: true, selector: "mng-table", inputs: { initialDescriptor: ["descriptor", "initialDescriptor"], items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", actions: "actions", isColumnClickable: "isColumnClickable", viewContainerInit: ["viewContainer", "viewContainerInit"], captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth", globalFilterFieldsInit: ["globalFilterFields", "globalFilterFieldsInit"] }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }, { propertyName: "components", predicate: MngComponentDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n    <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n    <p-table\n        *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n        [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n        [dataKey]=\"descriptor?.dataKeyProperty\"\n        [lazy]=\"isLazy\"\n        [loading]=\"(loading$ | async) ?? false\"\n        [paginator]=\"isPagination && !infiniteScroll\"\n        [rows]=\"infiniteScroll ? 20 : rows\"\n        [first]=\"infiniteScroll ? 0 : offset\"\n        [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n        [rowsPerPageOptions]=\"infiniteScroll ? undefined : rowsPerPageOptions\"\n        [showCurrentPageReport]=\"!infiniteScroll\"\n        [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n        [multiSortMeta]=\"multiSortMeta\"\n        [filters]=\"filterMetadata\"\n        [globalFilterFields]=\"globalFilterFields\"\n        sortMode=\"multiple\"\n        [(selection)]=\"selection\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        [selectionMode]=\"selectionEnabled ? selectionMode : null\"\n        [scrollable]=\"true\"\n        [virtualScroll]=\"infiniteScroll\"\n        [virtualScrollItemSize]=\"rowHeight\"\n        scrollHeight=\"flex\"\n        [rowHover]=\"descriptor?.hasHover ?? true\"\n        [styleClass]=\"className\"\n        [resizableColumns]=\"descriptor?.hasResizableColumns ?? false\"\n        [columnResizeMode]=\"descriptor?.columnResizeMode ?? 'fit'\"\n        [reorderableColumns]=\"areColumnsReorderable\"\n        [columns]=\"visibleColumns\"\n        (onColResize)=\"onTableColumnResize($event)\"\n        (onColReorder)=\"onColumnReorder($event)\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\">\n        <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #componentOrDefaultCaption>\n                <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n                <ng-template #defaultCaption>\n                    <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n                </ng-template>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n                <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\"></th>\n                <ng-container *ngFor=\"let col of columns\">\n                    <ng-container *ngIf=\"col.isVisible\">\n                        <ng-template #sortableColumnTHTemplate>\n                            <div class=\"flex justify-content-between align-items-center\">\n                                {{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                                <p-sortIcon [field]=\"col.descriptor.property\"></p-sortIcon>\n                            </div>\n                        </ng-template>\n                        <ng-template #nonSortableColumnTHTemplate>\n                            {{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                        </ng-template>\n                        <th\n                            *ngIf=\"col.descriptor.isReorderable\"\n                            pResizableColumn\n                            pReorderableColumn\n                            [id]=\"col.descriptor.property\"\n                            [pSortableColumn]=\"col.descriptor.property\"\n                            [pSortableColumnDisabled]=\"!col.descriptor.isSortEnabled\"\n                            [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                            [style.min-width.px]=\"col.descriptor.minWidth\"\n                            [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\"\n                            [class]=\"\n                                col.descriptor.headerClassName +\n                                (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                            \">\n                            <ng-container *ngTemplateOutlet=\"col.descriptor.isSortEnabled ? sortableColumnTHTemplate : nonSortableColumnTHTemplate\"></ng-container>\n                        </th>\n                        <th\n                            *ngIf=\"!col.descriptor.isReorderable\"\n                            pResizableColumn\n                            [id]=\"col.descriptor.property\"\n                            [pSortableColumn]=\"col.descriptor.property\"\n                            [pSortableColumnDisabled]=\"!col.descriptor.isSortEnabled\"\n                            [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                            [style.min-width.px]=\"col.descriptor.minWidth\"\n                            [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\"\n                            [class]=\"\n                                col.descriptor.headerClassName +\n                                (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                            \">\n                            <ng-container *ngTemplateOutlet=\"col.descriptor.isSortEnabled ? sortableColumnTHTemplate : nonSortableColumnTHTemplate\"></ng-container>\n                        </th>\n                    </ng-container>\n                </ng-container>\n                <th\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\"\n                    class=\"text-right\">\n                    <p-multiSelect\n                        #columnToggleMultiselect\n                        *ngIf=\"areColumnsToggleable || areColumnsReorderable || descriptor?.hasResizableColumns\"\n                        styleClass=\"p-button-primary mng-table-columns-multiselect\"\n                        appendTo=\"body\"\n                        optionDisabled=\"disabled\"\n                        [filter]=\"false\"\n                        [options]=\"columns\"\n                        [(ngModel)]=\"visibleColumns\"\n                        [pTooltip]=\"'mngTable.adjustTable' | translate\"\n                        tooltipPosition=\"left\"\n                        defaultLabel=\"\"\n                        dropdownIcon=\"pi pi-sliders-h\"\n                        [displaySelectedLabel]=\"false\"\n                        (onChange)=\"onColumnToggle($event)\">\n                        <ng-template pTemplate=\"filter\">\n                            <div class=\"p-checkbox p-component ml-1\" [ngClass]=\"{'p-checkbox-disabled': !areColumnsToggleable}\">\n                                <div class=\"p-hidden-accessible\">\n                                    <input\n                                        type=\"checkbox\"\n                                        readonly=\"readonly\"\n                                        [checked]=\"columnToggleMultiselect.allChecked\"\n                                        (focus)=\"columnToggleMultiselect.onHeaderCheckboxFocus()\"\n                                        (blur)=\"columnToggleMultiselect.onHeaderCheckboxBlur()\"\n                                        (keydown.space)=\"columnToggleMultiselect.toggleAll($event)\"\n                                        [disabled]=\"!areColumnsToggleable\" />\n                                </div>\n                                <div\n                                    class=\"p-checkbox-box\"\n                                    role=\"checkbox\"\n                                    [attr.aria-checked]=\"columnToggleMultiselect.allChecked\"\n                                    [ngClass]=\"{\n                                        'p-highlight': columnToggleMultiselect.allChecked,\n                                        'p-focus': columnToggleMultiselect.headerCheckboxFocus,\n                                        'p-disabled': !areColumnsToggleable\n                                    }\"\n                                    (click)=\"columnToggleMultiselect.toggleAll($event)\">\n                                    <span class=\"p-checkbox-icon\" [ngClass]=\"{'pi pi-check': columnToggleMultiselect.allChecked}\"></span>\n                                </div>\n                            </div>\n                            <p-button\n                                icon=\"pi pi-replay\"\n                                styleClass=\"p-button-secondary\"\n                                [pTooltip]=\"'mngTable.resetLayout' | translate\"\n                                tooltipPosition=\"left\"\n                                (click)=\"resetDefaultLayout()\"></p-button>\n                        </ng-template>\n                        <ng-template let-item pTemplate=\"item\">\n                            {{ item.descriptor.title ?? (item.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                        </ng-template>\n                    </p-multiSelect>\n                </th>\n            </tr>\n            <tr *ngIf=\"hasColumnFilters\" class=\"mng-column-filter-row\">\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\"></th>\n                <ng-container *ngFor=\"let col of columns\">\n                    <th\n                        *ngIf=\"col.isVisible\"\n                        [class]=\"\n                            (col.descriptor.filterDescriptor ? 'mng-column-filter-' + col.descriptor.filterDescriptor.filterType + ' ' : ' ') +\n                            col.descriptor.filterDescriptor?.columnClassName\n                        \"\n                        [style.width.%]=\"col.descriptor.filterDescriptor?.columnWidth ?? col.descriptor.width\"\n                        [style.min-width.px]=\"col.descriptor.filterDescriptor?.columnMinWidth ?? col.descriptor.minWidth\"\n                        [style.max-width.px]=\"col.descriptor.maxWidth\">\n                        <div class=\"flex\" *ngIf=\"col.descriptor.filterDescriptor\">\n                            <mng-table-column-filter-full\n                                *ngIf=\"!descriptor?.deprecatedFilters; else deprecatedFilters\"\n                                [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter-full>\n                            <ng-template #deprecatedFilters>\n                                <mng-table-column-filter [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter>\n                            </ng-template>\n                        </div>\n                    </th>\n                </ng-container>\n                <th\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr\n                [style.height.px]=\"rowHeight\"\n                [ngClass]=\"descriptor?.rowClassName | mngClassMapPipe : descriptor?.rowClassNameMapFn : item | mngLocaleDefaultRowClass : descriptor : item\">\n                <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n                </td>\n                <ng-container *ngFor=\"let col of columns\">\n                    <td\n                        *ngIf=\"col.isVisible\"\n                        (click)=\"onCellClick($event, col.descriptor, item, idx)\"\n                        [class]=\"\n                            (col.descriptor.className | mngClassMapPipe : col.descriptor.classNameMapFn : item) +\n                            (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                        \"\n                        [class.clickable]=\"isColumnClickable\"\n                        [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                        [style.min-width.px]=\"col.descriptor.minWidth\"\n                        [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\">\n                        <span class=\"p-column-title\">{{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}</span>\n                        <mng-table-column-value [descriptor]=\"col.descriptor\" [item]=\"item\"></mng-table-column-value>\n                    </td>\n                </ng-container>\n                <td\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    class=\"column-action justify-content-end text-right\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\">\n                    <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n                        <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                    </ng-container>\n                    <ng-template #showColumnActionComponentOrDefault>\n                        <span\n                            *ngIf=\"columnActionComponent; else defaultColumnActions\"\n                            [mngComponent]=\"columnActionComponent!\"\n                            (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n                    </ng-template>\n                    <ng-template #defaultColumnActions>\n                        <mng-action\n                            *ngFor=\"let action of rowInlineActions\"\n                            [action]=\"action\"\n                            [item]=\"item\"\n                            [viewContainer]=\"viewContainer\"\n                            [hostComponent]=\"this\"\n                            [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n                            [actionData]=\"{itemIndex: idx}\"\n                            (finish)=\"onActionFinish($event)\">\n                        </mng-action>\n                    </ng-template>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingicon\">\n            <div class=\"flex flex-column align-items-center\">\n                <i [class]=\"'text-white text-4xl pi-spin ' + descriptor?.loadingIcon\" *ngIf=\"descriptor?.loadingIcon\"></i>\n                <div class=\"text text-white text-lg font-semibold\" [ngClass]=\"{'mt-3': descriptor?.loadingIcon}\" *ngIf=\"descriptor?.loadingText\">\n                    {{ descriptor?.loadingText ?? '' | translate }}\n                </div>\n            </div>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    <div class=\"loading-text\"></div>\n                    <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"emptymessage\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    {{ 'mngTable.noItems' | translate }}\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n            <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n        </ng-template>\n    </p-table>\n</div>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i4$4.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "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", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i4$4.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i4$4.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "directive", type: i4$4.ResizableColumn, selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "directive", type: i4$4.ReorderableColumn, selector: "[pReorderableColumn]", inputs: ["pReorderableColumnDisabled"] }, { kind: "component", type: i4$4.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i4$4.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i4$4.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i4$4.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "pipe", type: MngI18nPropertyPipe, name: "i18nProperty" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { kind: "pipe", type: MngClassMapPipe, name: "mngClassMapPipe" }, { kind: "pipe", type: MngLocaleDefaultRowClassPipe, name: "mngLocaleDefaultRowClass" }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "hostComponent", "route", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i6$5.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i4$2.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "label", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectionLimit"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i6.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "size", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["id", "tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MngTableColumnFilterFullComponent, selector: "mng-table-column-filter-full", inputs: ["descriptor"] }, { kind: "component", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTableComponent, isStandalone: true, selector: "mng-table", inputs: { initialDescriptor: ["descriptor", "initialDescriptor"], items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", actions: "actions", isColumnClickable: "isColumnClickable", viewContainerInit: ["viewContainer", "viewContainerInit"], captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth", globalFilterFieldsInit: ["globalFilterFields", "globalFilterFieldsInit"] }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }, { propertyName: "components", predicate: MngComponentDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n    <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n    <p-table\n        *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n        [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n        [dataKey]=\"descriptor?.dataKeyProperty\"\n        [lazy]=\"isLazy\"\n        [loading]=\"(loading$ | async) ?? false\"\n        [paginator]=\"isPagination && !infiniteScroll\"\n        [rows]=\"infiniteScroll ? 20 : rows\"\n        [first]=\"infiniteScroll ? 0 : offset\"\n        [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n        [rowsPerPageOptions]=\"infiniteScroll ? undefined : rowsPerPageOptions\"\n        [showCurrentPageReport]=\"!infiniteScroll\"\n        [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n        [multiSortMeta]=\"multiSortMeta\"\n        [filters]=\"filterMetadata\"\n        [globalFilterFields]=\"globalFilterFields\"\n        sortMode=\"multiple\"\n        [(selection)]=\"selection\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        [selectionMode]=\"selectionEnabled ? selectionMode : null\"\n        [scrollable]=\"true\"\n        [virtualScroll]=\"infiniteScroll\"\n        [virtualScrollItemSize]=\"rowHeight\"\n        scrollHeight=\"flex\"\n        [rowHover]=\"descriptor?.hasHover ?? true\"\n        [styleClass]=\"className\"\n        [resizableColumns]=\"descriptor?.hasResizableColumns ?? false\"\n        [columnResizeMode]=\"descriptor?.columnResizeMode ?? 'fit'\"\n        [reorderableColumns]=\"areColumnsReorderable\"\n        paginatorDropdownAppendTo=\"body\"\n        [columns]=\"visibleColumns\"\n        (onColResize)=\"onTableColumnResize($event)\"\n        (onColReorder)=\"onColumnReorder($event)\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\">\n        <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #componentOrDefaultCaption>\n                <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n                <ng-template #defaultCaption>\n                    <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n                </ng-template>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n                <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\"></th>\n                <ng-container *ngFor=\"let col of columns\">\n                    <ng-container *ngIf=\"col.isVisible\">\n                        <ng-template #sortableColumnTHTemplate>\n                            <div class=\"flex justify-content-between align-items-center\">\n                                {{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                                <p-sortIcon [field]=\"col.descriptor.property\"></p-sortIcon>\n                            </div>\n                        </ng-template>\n                        <ng-template #nonSortableColumnTHTemplate>\n                            {{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                        </ng-template>\n                        <th\n                            *ngIf=\"col.descriptor.isReorderable\"\n                            pResizableColumn\n                            pReorderableColumn\n                            [id]=\"col.descriptor.property\"\n                            [pSortableColumn]=\"col.descriptor.property\"\n                            [pSortableColumnDisabled]=\"!col.descriptor.isSortEnabled\"\n                            [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                            [style.min-width.px]=\"col.descriptor.minWidth\"\n                            [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\"\n                            [class]=\"\n                                col.descriptor.headerClassName +\n                                (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                            \">\n                            <ng-container *ngTemplateOutlet=\"col.descriptor.isSortEnabled ? sortableColumnTHTemplate : nonSortableColumnTHTemplate\"></ng-container>\n                        </th>\n                        <th\n                            *ngIf=\"!col.descriptor.isReorderable\"\n                            pResizableColumn\n                            [id]=\"col.descriptor.property\"\n                            [pSortableColumn]=\"col.descriptor.property\"\n                            [pSortableColumnDisabled]=\"!col.descriptor.isSortEnabled\"\n                            [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                            [style.min-width.px]=\"col.descriptor.minWidth\"\n                            [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\"\n                            [class]=\"\n                                col.descriptor.headerClassName +\n                                (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                            \">\n                            <ng-container *ngTemplateOutlet=\"col.descriptor.isSortEnabled ? sortableColumnTHTemplate : nonSortableColumnTHTemplate\"></ng-container>\n                        </th>\n                    </ng-container>\n                </ng-container>\n                <th\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\"\n                    class=\"text-right\">\n                    <p-multiSelect\n                        #columnToggleMultiselect\n                        *ngIf=\"areColumnsToggleable || areColumnsReorderable || descriptor?.hasResizableColumns\"\n                        styleClass=\"p-button-primary mng-table-columns-multiselect\"\n                        appendTo=\"body\"\n                        optionDisabled=\"disabled\"\n                        [filter]=\"false\"\n                        [options]=\"columns\"\n                        [(ngModel)]=\"visibleColumns\"\n                        [pTooltip]=\"'mngTable.adjustTable' | translate\"\n                        tooltipPosition=\"left\"\n                        placeholder=\"\"\n                        dropdownIcon=\"pi pi-sliders-h\"\n                        [displaySelectedLabel]=\"false\"\n                        (onChange)=\"onColumnToggle($event)\">\n                        <ng-template pTemplate=\"filter\">\n                            <div class=\"p-checkbox p-component ml-1\" [ngClass]=\"{'p-checkbox-disabled': !areColumnsToggleable}\">\n                                <div class=\"p-hidden-accessible\">\n                                    <input\n                                        type=\"checkbox\"\n                                        readonly=\"readonly\"\n                                        [checked]=\"columnToggleMultiselect.allSelected\"\n                                        (focus)=\"columnToggleMultiselect.onHeaderCheckboxFocus()\"\n                                        (blur)=\"columnToggleMultiselect.onHeaderCheckboxBlur()\"\n                                        (keydown.space)=\"columnToggleMultiselect.onToggleAll($event)\"\n                                        [disabled]=\"!areColumnsToggleable\" />\n                                </div>\n                                <div\n                                    class=\"p-checkbox-box\"\n                                    role=\"checkbox\"\n                                    [attr.aria-checked]=\"columnToggleMultiselect.allSelected\"\n                                    [ngClass]=\"{\n                                        'p-highlight': columnToggleMultiselect.allSelected,\n                                        'p-focus': columnToggleMultiselect.headerCheckboxFocus,\n                                        'p-disabled': !areColumnsToggleable\n                                    }\"\n                                    (click)=\"columnToggleMultiselect.onToggleAll($event)\">\n                                    <span class=\"p-checkbox-icon\" [ngClass]=\"{'pi pi-check': columnToggleMultiselect.allSelected}\"></span>\n                                </div>\n                            </div>\n                            <p-button\n                                icon=\"pi pi-replay\"\n                                styleClass=\"p-button-secondary\"\n                                [pTooltip]=\"'mngTable.resetLayout' | translate\"\n                                tooltipPosition=\"left\"\n                                (click)=\"resetDefaultLayout()\"></p-button>\n                        </ng-template>\n                        <ng-template let-item pTemplate=\"item\">\n                            {{ item.descriptor.title ?? (item.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                        </ng-template>\n                    </p-multiSelect>\n                </th>\n            </tr>\n            <tr *ngIf=\"hasColumnFilters\" class=\"mng-column-filter-row\">\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\"></th>\n                <ng-container *ngFor=\"let col of columns\">\n                    <th\n                        *ngIf=\"col.isVisible\"\n                        [class]=\"\n                            (col.descriptor.filterDescriptor ? 'mng-column-filter-' + col.descriptor.filterDescriptor.filterType + ' ' : ' ') +\n                            col.descriptor.filterDescriptor?.columnClassName\n                        \"\n                        [style.width.%]=\"col.descriptor.filterDescriptor?.columnWidth ?? col.descriptor.width\"\n                        [style.min-width.px]=\"col.descriptor.filterDescriptor?.columnMinWidth ?? col.descriptor.minWidth\"\n                        [style.max-width.px]=\"col.descriptor.maxWidth\">\n                        <div class=\"flex\" *ngIf=\"col.descriptor.filterDescriptor\">\n                            <mng-table-column-filter-full\n                                *ngIf=\"!descriptor?.deprecatedFilters; else deprecatedFilters\"\n                                [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter-full>\n                            <ng-template #deprecatedFilters>\n                                <mng-table-column-filter [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter>\n                            </ng-template>\n                        </div>\n                    </th>\n                </ng-container>\n                <th\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr\n                [style.height.px]=\"rowHeight\"\n                [ngClass]=\"descriptor?.rowClassName | mngClassMapPipe : descriptor?.rowClassNameMapFn : item | mngLocaleDefaultRowClass : descriptor : item\">\n                <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n                </td>\n                <ng-container *ngFor=\"let col of columns\">\n                    <td\n                        *ngIf=\"col.isVisible\"\n                        (click)=\"onCellClick($event, col.descriptor, item, idx)\"\n                        [class]=\"\n                            (col.descriptor.className | mngClassMapPipe : col.descriptor.classNameMapFn : item) +\n                            (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                        \"\n                        [class.clickable]=\"isColumnClickable\"\n                        [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                        [style.min-width.px]=\"col.descriptor.minWidth\"\n                        [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\">\n                        <span class=\"p-column-title\">{{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}</span>\n                        <mng-table-column-value [descriptor]=\"col.descriptor\" [item]=\"item\"></mng-table-column-value>\n                    </td>\n                </ng-container>\n                <td\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    class=\"column-action justify-content-end text-right\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\">\n                    <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n                        <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                    </ng-container>\n                    <ng-template #showColumnActionComponentOrDefault>\n                        <span\n                            *ngIf=\"columnActionComponent; else defaultColumnActions\"\n                            [mngComponent]=\"columnActionComponent!\"\n                            (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n                    </ng-template>\n                    <ng-template #defaultColumnActions>\n                        <mng-action\n                            *ngFor=\"let action of rowInlineActions\"\n                            [action]=\"action\"\n                            [item]=\"item\"\n                            [viewContainer]=\"viewContainer\"\n                            [hostComponent]=\"this\"\n                            [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n                            [actionData]=\"{itemIndex: idx}\"\n                            (finish)=\"onActionFinish($event)\">\n                        </mng-action>\n                    </ng-template>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingicon\">\n            <div class=\"flex flex-column align-items-center\">\n                <i [class]=\"'text-white text-4xl pi-spin ' + descriptor?.loadingIcon\" *ngIf=\"descriptor?.loadingIcon\"></i>\n                <div class=\"text text-white text-lg font-semibold\" [ngClass]=\"{'mt-3': descriptor?.loadingIcon}\" *ngIf=\"descriptor?.loadingText\">\n                    {{ descriptor?.loadingText ?? '' | translate }}\n                </div>\n            </div>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    <div class=\"loading-text\"></div>\n                    <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"emptymessage\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    {{ 'mngTable.noItems' | translate }}\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n            <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n        </ng-template>\n    </p-table>\n</div>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i4$4.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "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", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i4$4.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i4$4.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "directive", type: i4$4.ResizableColumn, selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "directive", type: i4$4.ReorderableColumn, selector: "[pReorderableColumn]", inputs: ["pReorderableColumnDisabled"] }, { kind: "component", type: i4$4.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i4$4.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i4$4.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i4$4.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "pipe", type: MngI18nPropertyPipe, name: "i18nProperty" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { kind: "pipe", type: MngClassMapPipe, name: "mngClassMapPipe" }, { kind: "pipe", type: MngLocaleDefaultRowClassPipe, name: "mngLocaleDefaultRowClass" }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "hostComponent", "route", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i6$5.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i4$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i6.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "size", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MngTableColumnFilterFullComponent, selector: "mng-table-column-filter-full", inputs: ["descriptor"] }, { kind: "component", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTableComponent, decorators: [{
             type: Component,
@@ -13952,7 +13958,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
                         FormsModule,
                         MngTableColumnFilterFullComponent,
                         MngTableColumnFilterComponent
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n    <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n    <p-table\n        *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n        [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n        [dataKey]=\"descriptor?.dataKeyProperty\"\n        [lazy]=\"isLazy\"\n        [loading]=\"(loading$ | async) ?? false\"\n        [paginator]=\"isPagination && !infiniteScroll\"\n        [rows]=\"infiniteScroll ? 20 : rows\"\n        [first]=\"infiniteScroll ? 0 : offset\"\n        [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n        [rowsPerPageOptions]=\"infiniteScroll ? undefined : rowsPerPageOptions\"\n        [showCurrentPageReport]=\"!infiniteScroll\"\n        [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n        [multiSortMeta]=\"multiSortMeta\"\n        [filters]=\"filterMetadata\"\n        [globalFilterFields]=\"globalFilterFields\"\n        sortMode=\"multiple\"\n        [(selection)]=\"selection\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        [selectionMode]=\"selectionEnabled ? selectionMode : null\"\n        [scrollable]=\"true\"\n        [virtualScroll]=\"infiniteScroll\"\n        [virtualScrollItemSize]=\"rowHeight\"\n        scrollHeight=\"flex\"\n        [rowHover]=\"descriptor?.hasHover ?? true\"\n        [styleClass]=\"className\"\n        [resizableColumns]=\"descriptor?.hasResizableColumns ?? false\"\n        [columnResizeMode]=\"descriptor?.columnResizeMode ?? 'fit'\"\n        [reorderableColumns]=\"areColumnsReorderable\"\n        [columns]=\"visibleColumns\"\n        (onColResize)=\"onTableColumnResize($event)\"\n        (onColReorder)=\"onColumnReorder($event)\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\">\n        <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #componentOrDefaultCaption>\n                <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n                <ng-template #defaultCaption>\n                    <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n                </ng-template>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n                <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\"></th>\n                <ng-container *ngFor=\"let col of columns\">\n                    <ng-container *ngIf=\"col.isVisible\">\n                        <ng-template #sortableColumnTHTemplate>\n                            <div class=\"flex justify-content-between align-items-center\">\n                                {{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                                <p-sortIcon [field]=\"col.descriptor.property\"></p-sortIcon>\n                            </div>\n                        </ng-template>\n                        <ng-template #nonSortableColumnTHTemplate>\n                            {{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                        </ng-template>\n                        <th\n                            *ngIf=\"col.descriptor.isReorderable\"\n                            pResizableColumn\n                            pReorderableColumn\n                            [id]=\"col.descriptor.property\"\n                            [pSortableColumn]=\"col.descriptor.property\"\n                            [pSortableColumnDisabled]=\"!col.descriptor.isSortEnabled\"\n                            [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                            [style.min-width.px]=\"col.descriptor.minWidth\"\n                            [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\"\n                            [class]=\"\n                                col.descriptor.headerClassName +\n                                (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                            \">\n                            <ng-container *ngTemplateOutlet=\"col.descriptor.isSortEnabled ? sortableColumnTHTemplate : nonSortableColumnTHTemplate\"></ng-container>\n                        </th>\n                        <th\n                            *ngIf=\"!col.descriptor.isReorderable\"\n                            pResizableColumn\n                            [id]=\"col.descriptor.property\"\n                            [pSortableColumn]=\"col.descriptor.property\"\n                            [pSortableColumnDisabled]=\"!col.descriptor.isSortEnabled\"\n                            [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                            [style.min-width.px]=\"col.descriptor.minWidth\"\n                            [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\"\n                            [class]=\"\n                                col.descriptor.headerClassName +\n                                (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                            \">\n                            <ng-container *ngTemplateOutlet=\"col.descriptor.isSortEnabled ? sortableColumnTHTemplate : nonSortableColumnTHTemplate\"></ng-container>\n                        </th>\n                    </ng-container>\n                </ng-container>\n                <th\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\"\n                    class=\"text-right\">\n                    <p-multiSelect\n                        #columnToggleMultiselect\n                        *ngIf=\"areColumnsToggleable || areColumnsReorderable || descriptor?.hasResizableColumns\"\n                        styleClass=\"p-button-primary mng-table-columns-multiselect\"\n                        appendTo=\"body\"\n                        optionDisabled=\"disabled\"\n                        [filter]=\"false\"\n                        [options]=\"columns\"\n                        [(ngModel)]=\"visibleColumns\"\n                        [pTooltip]=\"'mngTable.adjustTable' | translate\"\n                        tooltipPosition=\"left\"\n                        defaultLabel=\"\"\n                        dropdownIcon=\"pi pi-sliders-h\"\n                        [displaySelectedLabel]=\"false\"\n                        (onChange)=\"onColumnToggle($event)\">\n                        <ng-template pTemplate=\"filter\">\n                            <div class=\"p-checkbox p-component ml-1\" [ngClass]=\"{'p-checkbox-disabled': !areColumnsToggleable}\">\n                                <div class=\"p-hidden-accessible\">\n                                    <input\n                                        type=\"checkbox\"\n                                        readonly=\"readonly\"\n                                        [checked]=\"columnToggleMultiselect.allChecked\"\n                                        (focus)=\"columnToggleMultiselect.onHeaderCheckboxFocus()\"\n                                        (blur)=\"columnToggleMultiselect.onHeaderCheckboxBlur()\"\n                                        (keydown.space)=\"columnToggleMultiselect.toggleAll($event)\"\n                                        [disabled]=\"!areColumnsToggleable\" />\n                                </div>\n                                <div\n                                    class=\"p-checkbox-box\"\n                                    role=\"checkbox\"\n                                    [attr.aria-checked]=\"columnToggleMultiselect.allChecked\"\n                                    [ngClass]=\"{\n                                        'p-highlight': columnToggleMultiselect.allChecked,\n                                        'p-focus': columnToggleMultiselect.headerCheckboxFocus,\n                                        'p-disabled': !areColumnsToggleable\n                                    }\"\n                                    (click)=\"columnToggleMultiselect.toggleAll($event)\">\n                                    <span class=\"p-checkbox-icon\" [ngClass]=\"{'pi pi-check': columnToggleMultiselect.allChecked}\"></span>\n                                </div>\n                            </div>\n                            <p-button\n                                icon=\"pi pi-replay\"\n                                styleClass=\"p-button-secondary\"\n                                [pTooltip]=\"'mngTable.resetLayout' | translate\"\n                                tooltipPosition=\"left\"\n                                (click)=\"resetDefaultLayout()\"></p-button>\n                        </ng-template>\n                        <ng-template let-item pTemplate=\"item\">\n                            {{ item.descriptor.title ?? (item.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                        </ng-template>\n                    </p-multiSelect>\n                </th>\n            </tr>\n            <tr *ngIf=\"hasColumnFilters\" class=\"mng-column-filter-row\">\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\"></th>\n                <ng-container *ngFor=\"let col of columns\">\n                    <th\n                        *ngIf=\"col.isVisible\"\n                        [class]=\"\n                            (col.descriptor.filterDescriptor ? 'mng-column-filter-' + col.descriptor.filterDescriptor.filterType + ' ' : ' ') +\n                            col.descriptor.filterDescriptor?.columnClassName\n                        \"\n                        [style.width.%]=\"col.descriptor.filterDescriptor?.columnWidth ?? col.descriptor.width\"\n                        [style.min-width.px]=\"col.descriptor.filterDescriptor?.columnMinWidth ?? col.descriptor.minWidth\"\n                        [style.max-width.px]=\"col.descriptor.maxWidth\">\n                        <div class=\"flex\" *ngIf=\"col.descriptor.filterDescriptor\">\n                            <mng-table-column-filter-full\n                                *ngIf=\"!descriptor?.deprecatedFilters; else deprecatedFilters\"\n                                [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter-full>\n                            <ng-template #deprecatedFilters>\n                                <mng-table-column-filter [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter>\n                            </ng-template>\n                        </div>\n                    </th>\n                </ng-container>\n                <th\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr\n                [style.height.px]=\"rowHeight\"\n                [ngClass]=\"descriptor?.rowClassName | mngClassMapPipe : descriptor?.rowClassNameMapFn : item | mngLocaleDefaultRowClass : descriptor : item\">\n                <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n                </td>\n                <ng-container *ngFor=\"let col of columns\">\n                    <td\n                        *ngIf=\"col.isVisible\"\n                        (click)=\"onCellClick($event, col.descriptor, item, idx)\"\n                        [class]=\"\n                            (col.descriptor.className | mngClassMapPipe : col.descriptor.classNameMapFn : item) +\n                            (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                        \"\n                        [class.clickable]=\"isColumnClickable\"\n                        [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                        [style.min-width.px]=\"col.descriptor.minWidth\"\n                        [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\">\n                        <span class=\"p-column-title\">{{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}</span>\n                        <mng-table-column-value [descriptor]=\"col.descriptor\" [item]=\"item\"></mng-table-column-value>\n                    </td>\n                </ng-container>\n                <td\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    class=\"column-action justify-content-end text-right\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\">\n                    <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n                        <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                    </ng-container>\n                    <ng-template #showColumnActionComponentOrDefault>\n                        <span\n                            *ngIf=\"columnActionComponent; else defaultColumnActions\"\n                            [mngComponent]=\"columnActionComponent!\"\n                            (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n                    </ng-template>\n                    <ng-template #defaultColumnActions>\n                        <mng-action\n                            *ngFor=\"let action of rowInlineActions\"\n                            [action]=\"action\"\n                            [item]=\"item\"\n                            [viewContainer]=\"viewContainer\"\n                            [hostComponent]=\"this\"\n                            [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n                            [actionData]=\"{itemIndex: idx}\"\n                            (finish)=\"onActionFinish($event)\">\n                        </mng-action>\n                    </ng-template>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingicon\">\n            <div class=\"flex flex-column align-items-center\">\n                <i [class]=\"'text-white text-4xl pi-spin ' + descriptor?.loadingIcon\" *ngIf=\"descriptor?.loadingIcon\"></i>\n                <div class=\"text text-white text-lg font-semibold\" [ngClass]=\"{'mt-3': descriptor?.loadingIcon}\" *ngIf=\"descriptor?.loadingText\">\n                    {{ descriptor?.loadingText ?? '' | translate }}\n                </div>\n            </div>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    <div class=\"loading-text\"></div>\n                    <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"emptymessage\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    {{ 'mngTable.noItems' | translate }}\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n            <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n        </ng-template>\n    </p-table>\n</div>\n" }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n    <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n    <p-table\n        *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n        [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n        [dataKey]=\"descriptor?.dataKeyProperty\"\n        [lazy]=\"isLazy\"\n        [loading]=\"(loading$ | async) ?? false\"\n        [paginator]=\"isPagination && !infiniteScroll\"\n        [rows]=\"infiniteScroll ? 20 : rows\"\n        [first]=\"infiniteScroll ? 0 : offset\"\n        [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n        [rowsPerPageOptions]=\"infiniteScroll ? undefined : rowsPerPageOptions\"\n        [showCurrentPageReport]=\"!infiniteScroll\"\n        [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n        [multiSortMeta]=\"multiSortMeta\"\n        [filters]=\"filterMetadata\"\n        [globalFilterFields]=\"globalFilterFields\"\n        sortMode=\"multiple\"\n        [(selection)]=\"selection\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        [selectionMode]=\"selectionEnabled ? selectionMode : null\"\n        [scrollable]=\"true\"\n        [virtualScroll]=\"infiniteScroll\"\n        [virtualScrollItemSize]=\"rowHeight\"\n        scrollHeight=\"flex\"\n        [rowHover]=\"descriptor?.hasHover ?? true\"\n        [styleClass]=\"className\"\n        [resizableColumns]=\"descriptor?.hasResizableColumns ?? false\"\n        [columnResizeMode]=\"descriptor?.columnResizeMode ?? 'fit'\"\n        [reorderableColumns]=\"areColumnsReorderable\"\n        paginatorDropdownAppendTo=\"body\"\n        [columns]=\"visibleColumns\"\n        (onColResize)=\"onTableColumnResize($event)\"\n        (onColReorder)=\"onColumnReorder($event)\"\n        (onLazyLoad)=\"onTableLazyLoad($event)\"\n        (onSort)=\"onTableSort($event)\"\n        (onFilter)=\"onTableFilter($event)\">\n        <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n            <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n                <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #componentOrDefaultCaption>\n                <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n                <ng-template #defaultCaption>\n                    <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n                </ng-template>\n            </ng-template>\n        </ng-template>\n\n        <ng-template pTemplate=\"header\">\n            <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n                <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n                </th>\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\"></th>\n                <ng-container *ngFor=\"let col of columns\">\n                    <ng-container *ngIf=\"col.isVisible\">\n                        <ng-template #sortableColumnTHTemplate>\n                            <div class=\"flex justify-content-between align-items-center\">\n                                {{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                                <p-sortIcon [field]=\"col.descriptor.property\"></p-sortIcon>\n                            </div>\n                        </ng-template>\n                        <ng-template #nonSortableColumnTHTemplate>\n                            {{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                        </ng-template>\n                        <th\n                            *ngIf=\"col.descriptor.isReorderable\"\n                            pResizableColumn\n                            pReorderableColumn\n                            [id]=\"col.descriptor.property\"\n                            [pSortableColumn]=\"col.descriptor.property\"\n                            [pSortableColumnDisabled]=\"!col.descriptor.isSortEnabled\"\n                            [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                            [style.min-width.px]=\"col.descriptor.minWidth\"\n                            [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\"\n                            [class]=\"\n                                col.descriptor.headerClassName +\n                                (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                            \">\n                            <ng-container *ngTemplateOutlet=\"col.descriptor.isSortEnabled ? sortableColumnTHTemplate : nonSortableColumnTHTemplate\"></ng-container>\n                        </th>\n                        <th\n                            *ngIf=\"!col.descriptor.isReorderable\"\n                            pResizableColumn\n                            [id]=\"col.descriptor.property\"\n                            [pSortableColumn]=\"col.descriptor.property\"\n                            [pSortableColumnDisabled]=\"!col.descriptor.isSortEnabled\"\n                            [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                            [style.min-width.px]=\"col.descriptor.minWidth\"\n                            [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\"\n                            [class]=\"\n                                col.descriptor.headerClassName +\n                                (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                            \">\n                            <ng-container *ngTemplateOutlet=\"col.descriptor.isSortEnabled ? sortableColumnTHTemplate : nonSortableColumnTHTemplate\"></ng-container>\n                        </th>\n                    </ng-container>\n                </ng-container>\n                <th\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\"\n                    class=\"text-right\">\n                    <p-multiSelect\n                        #columnToggleMultiselect\n                        *ngIf=\"areColumnsToggleable || areColumnsReorderable || descriptor?.hasResizableColumns\"\n                        styleClass=\"p-button-primary mng-table-columns-multiselect\"\n                        appendTo=\"body\"\n                        optionDisabled=\"disabled\"\n                        [filter]=\"false\"\n                        [options]=\"columns\"\n                        [(ngModel)]=\"visibleColumns\"\n                        [pTooltip]=\"'mngTable.adjustTable' | translate\"\n                        tooltipPosition=\"left\"\n                        placeholder=\"\"\n                        dropdownIcon=\"pi pi-sliders-h\"\n                        [displaySelectedLabel]=\"false\"\n                        (onChange)=\"onColumnToggle($event)\">\n                        <ng-template pTemplate=\"filter\">\n                            <div class=\"p-checkbox p-component ml-1\" [ngClass]=\"{'p-checkbox-disabled': !areColumnsToggleable}\">\n                                <div class=\"p-hidden-accessible\">\n                                    <input\n                                        type=\"checkbox\"\n                                        readonly=\"readonly\"\n                                        [checked]=\"columnToggleMultiselect.allSelected\"\n                                        (focus)=\"columnToggleMultiselect.onHeaderCheckboxFocus()\"\n                                        (blur)=\"columnToggleMultiselect.onHeaderCheckboxBlur()\"\n                                        (keydown.space)=\"columnToggleMultiselect.onToggleAll($event)\"\n                                        [disabled]=\"!areColumnsToggleable\" />\n                                </div>\n                                <div\n                                    class=\"p-checkbox-box\"\n                                    role=\"checkbox\"\n                                    [attr.aria-checked]=\"columnToggleMultiselect.allSelected\"\n                                    [ngClass]=\"{\n                                        'p-highlight': columnToggleMultiselect.allSelected,\n                                        'p-focus': columnToggleMultiselect.headerCheckboxFocus,\n                                        'p-disabled': !areColumnsToggleable\n                                    }\"\n                                    (click)=\"columnToggleMultiselect.onToggleAll($event)\">\n                                    <span class=\"p-checkbox-icon\" [ngClass]=\"{'pi pi-check': columnToggleMultiselect.allSelected}\"></span>\n                                </div>\n                            </div>\n                            <p-button\n                                icon=\"pi pi-replay\"\n                                styleClass=\"p-button-secondary\"\n                                [pTooltip]=\"'mngTable.resetLayout' | translate\"\n                                tooltipPosition=\"left\"\n                                (click)=\"resetDefaultLayout()\"></p-button>\n                        </ng-template>\n                        <ng-template let-item pTemplate=\"item\">\n                            {{ item.descriptor.title ?? (item.descriptor.property | i18nProperty : descriptor!.model) | translate }}\n                        </ng-template>\n                    </p-multiSelect>\n                </th>\n            </tr>\n            <tr *ngIf=\"hasColumnFilters\" class=\"mng-column-filter-row\">\n                <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n                <th *ngIf=\"selectionEnabled\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\"></th>\n                <ng-container *ngFor=\"let col of columns\">\n                    <th\n                        *ngIf=\"col.isVisible\"\n                        [class]=\"\n                            (col.descriptor.filterDescriptor ? 'mng-column-filter-' + col.descriptor.filterDescriptor.filterType + ' ' : ' ') +\n                            col.descriptor.filterDescriptor?.columnClassName\n                        \"\n                        [style.width.%]=\"col.descriptor.filterDescriptor?.columnWidth ?? col.descriptor.width\"\n                        [style.min-width.px]=\"col.descriptor.filterDescriptor?.columnMinWidth ?? col.descriptor.minWidth\"\n                        [style.max-width.px]=\"col.descriptor.maxWidth\">\n                        <div class=\"flex\" *ngIf=\"col.descriptor.filterDescriptor\">\n                            <mng-table-column-filter-full\n                                *ngIf=\"!descriptor?.deprecatedFilters; else deprecatedFilters\"\n                                [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter-full>\n                            <ng-template #deprecatedFilters>\n                                <mng-table-column-filter [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter>\n                            </ng-template>\n                        </div>\n                    </th>\n                </ng-container>\n                <th\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\"></th>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n            <tr\n                [style.height.px]=\"rowHeight\"\n                [ngClass]=\"descriptor?.rowClassName | mngClassMapPipe : descriptor?.rowClassNameMapFn : item | mngLocaleDefaultRowClass : descriptor : item\">\n                <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn [frozen]=\"descriptor?.selectionColumnFrozen ?? true\">\n                    <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n                </td>\n                <ng-container *ngFor=\"let col of columns\">\n                    <td\n                        *ngIf=\"col.isVisible\"\n                        (click)=\"onCellClick($event, col.descriptor, item, idx)\"\n                        [class]=\"\n                            (col.descriptor.className | mngClassMapPipe : col.descriptor.classNameMapFn : item) +\n                            (hasColumnFilters && col.descriptor.filterDescriptor ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType : '')\n                        \"\n                        [class.clickable]=\"isColumnClickable\"\n                        [style.width]=\"col.width ? col.width + 'px' : col.descriptor.width + '%'\"\n                        [style.min-width.px]=\"col.descriptor.minWidth\"\n                        [style.max-width.px]=\"col.width ?? col.descriptor.maxWidth\">\n                        <span class=\"p-column-title\">{{ col.descriptor.title ?? (col.descriptor.property | i18nProperty : descriptor!.model) | translate }}</span>\n                        <mng-table-column-value [descriptor]=\"col.descriptor\" [item]=\"item\"></mng-table-column-value>\n                    </td>\n                </ng-container>\n                <td\n                    *ngIf=\"showInlineActionsColumn || areColumnsToggleable || areColumnsReorderable\"\n                    class=\"column-action justify-content-end text-right\"\n                    [style.min-width.px]=\"columnActionMinWidth\"\n                    pFrozenColumn\n                    [frozen]=\"descriptor?.actionColumnFrozen ?? true\"\n                    alignFrozen=\"right\">\n                    <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n                        <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n                    </ng-container>\n                    <ng-template #showColumnActionComponentOrDefault>\n                        <span\n                            *ngIf=\"columnActionComponent; else defaultColumnActions\"\n                            [mngComponent]=\"columnActionComponent!\"\n                            (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n                    </ng-template>\n                    <ng-template #defaultColumnActions>\n                        <mng-action\n                            *ngFor=\"let action of rowInlineActions\"\n                            [action]=\"action\"\n                            [item]=\"item\"\n                            [viewContainer]=\"viewContainer\"\n                            [hostComponent]=\"this\"\n                            [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n                            [actionData]=\"{itemIndex: idx}\"\n                            (finish)=\"onActionFinish($event)\">\n                        </mng-action>\n                    </ng-template>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingicon\">\n            <div class=\"flex flex-column align-items-center\">\n                <i [class]=\"'text-white text-4xl pi-spin ' + descriptor?.loadingIcon\" *ngIf=\"descriptor?.loadingIcon\"></i>\n                <div class=\"text text-white text-lg font-semibold\" [ngClass]=\"{'mt-3': descriptor?.loadingIcon}\" *ngIf=\"descriptor?.loadingText\">\n                    {{ descriptor?.loadingText ?? '' | translate }}\n                </div>\n            </div>\n        </ng-template>\n\n        <ng-template pTemplate=\"loadingbody\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    <div class=\"loading-text\"></div>\n                    <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template pTemplate=\"emptymessage\">\n            <tr [style.height.px]=\"rowHeight\">\n                <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n                    {{ 'mngTable.noItems' | translate }}\n                </td>\n            </tr>\n        </ng-template>\n\n        <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n            <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n        </ng-template>\n    </p-table>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.Router }, { type: i1.ActivatedRoute }, { type: i2.TranslateService }, { type: MngCommonsService }, { type: MngActionExecutorService }, { type: MngViewContainerComponentService, decorators: [{
                     type: Optional
                 }] }, { type: MngLocalStorageService }]; }, propDecorators: { initialDescriptor: [{
@@ -14891,7 +14897,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
 
 class MngFormlyFieldTabsComponent extends FieldType {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFormlyFieldTabsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngFormlyFieldTabsComponent, isStandalone: true, selector: "mng-formly-field-tabs", usesInheritance: true, ngImport: i0, template: "<p-tabView [scrollable]=\"true\">\n    <p-tabPanel\n        *ngFor=\"let tab of field.fieldGroup; let i = index; let last = last\"\n        [header]=\"tab.props?.label! | translate\"\n        [headerStyleClass]=\"formControl!.valid ? 'p-tabview-title' : undefined\">\n        <ng-template pTemplate=\"header\">\n            <span class=\"p-tabview-title\" [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.props?.label!) + '_invalid']\">{{\n                tab.props?.label! | translate\n            }}</span>\n        </ng-template>\n        <formly-field [field]=\"tab\"></formly-field>\n    </p-tabPanel>\n</p-tabView>\n", dependencies: [{ kind: "ngmodule", type: TabViewModule }, { kind: "component", type: i1$4.TabView, selector: "p-tabView", inputs: ["style", "styleClass", "controlClose", "scrollable", "activeIndex", "selectOnFocus", "tabindex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i1$4.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$2.FormlyField, selector: "formly-field", inputs: ["field"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngFormlyFieldTabsComponent, isStandalone: true, selector: "mng-formly-field-tabs", usesInheritance: true, ngImport: i0, template: "<p-tabView [scrollable]=\"true\">\n    <p-tabPanel\n        *ngFor=\"let tab of field.fieldGroup; let i = index; let last = last\"\n        [header]=\"tab.props?.label! | translate\"\n        [headerStyleClass]=\"formControl!.valid ? 'p-tabview-title' : undefined\">\n        <ng-template pTemplate=\"header\">\n            <span class=\"p-tabview-title\" [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.props?.label!) + '_invalid']\">{{\n                tab.props?.label! | translate\n            }}</span>\n        </ng-template>\n        <formly-field [field]=\"tab\"></formly-field>\n    </p-tabPanel>\n</p-tabView>\n", dependencies: [{ kind: "ngmodule", type: TabViewModule }, { kind: "component", type: i1$4.TabView, selector: "p-tabView", inputs: ["style", "styleClass", "controlClose", "scrollable", "activeIndex", "selectOnFocus", "nextButtonAriaLabel", "prevButtonAriaLabel", "autoHideButtons", "tabindex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i1$4.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$2.FormlyField, selector: "formly-field", inputs: ["field"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFormlyFieldTabsComponent, decorators: [{
             type: Component,
@@ -14955,7 +14961,7 @@ class MngFormlyFieldActionComponent extends FieldType {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFormlyFieldActionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngFormlyFieldActionComponent, isStandalone: true, selector: "mng-formly-field-action", usesInheritance: true, ngImport: i0, template: "<div class=\"flex\">\n    <button\n        type=\"button\"\n        pButton\n        pRipple\n        [icon]=\"$any(descriptor.button.icon)\"\n        [label]=\"$any(descriptor.button.label === null ? null : descriptor.button.label ?? props!.label) | translate\"\n        [pTooltip]=\"$any(descriptor.button.tooltip) | translate\"\n        [disabled]=\"formControl.disabled\"\n        (click)=\"onClick()\"\n        [class]=\"buttonClass + (actionMessage ? ' mr-2' : '')\"></button>\n    <p-message *ngIf=\"actionMessage\" [text]=\"actionMessage.content\" [severity]=\"actionMessage.severity ?? 'success'\"></p-message>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["id", "tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i5$1.UIMessage, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngFormlyFieldActionComponent, isStandalone: true, selector: "mng-formly-field-action", usesInheritance: true, ngImport: i0, template: "<div class=\"flex\">\n    <button\n        type=\"button\"\n        pButton\n        pRipple\n        [icon]=\"$any(descriptor.button.icon)\"\n        [label]=\"$any(descriptor.button.label === null ? null : descriptor.button.label ?? props!.label) | translate\"\n        [pTooltip]=\"$any(descriptor.button.tooltip) | translate\"\n        [disabled]=\"formControl.disabled\"\n        (click)=\"onClick()\"\n        [class]=\"buttonClass + (actionMessage ? ' mr-2' : '')\"></button>\n    <p-message *ngIf=\"actionMessage\" [text]=\"actionMessage.content\" [severity]=\"actionMessage.severity ?? 'success'\"></p-message>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i5$1.UIMessage, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFormlyFieldActionComponent, decorators: [{
             type: Component,
@@ -15062,7 +15068,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
                 args: ['formState']
             }] } });
 
-class MngBreadcrumbComponent {
+let MngBreadcrumbComponent$1 = class MngBreadcrumbComponent {
     constructor(mngCommons) {
         this.mngCommons = mngCommons;
         this.mappedBreadcrumbHome$ = this.mngCommons.breadcrumbHome$.pipe(map((el) => {
@@ -15082,21 +15088,21 @@ class MngBreadcrumbComponent {
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngBreadcrumbComponent, deps: [{ token: MngCommonsService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngBreadcrumbComponent, isStandalone: true, selector: "mng-breadcrumb", ngImport: i0, template: "<div class=\"layout-breadcrumb-container\">\n    <div class=\"layout-breadcrumb\">\n        <p-breadcrumb [home]=\"(mappedBreadcrumbHome$ | async) ?? undefined\" [model]=\"(mappedBreadcrumbs$ | async) ?? undefined\" styleClass=\"layout-breadcrumb py-2\"></p-breadcrumb>\n    </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: BreadcrumbModule }, { kind: "component", type: i2$4.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngBreadcrumbComponent, decorators: [{
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngBreadcrumbComponent$1, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-breadcrumb', imports: [BreadcrumbModule, AsyncPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-breadcrumb-container\">\n    <div class=\"layout-breadcrumb\">\n        <p-breadcrumb [home]=\"(mappedBreadcrumbHome$ | async) ?? undefined\" [model]=\"(mappedBreadcrumbs$ | async) ?? undefined\" styleClass=\"layout-breadcrumb py-2\"></p-breadcrumb>\n    </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: MngCommonsService }]; } });
 
-class MngFooterComponent {
+let MngFooterComponent$1 = class MngFooterComponent {
     constructor(mngCommons) {
         this.mngCommons = mngCommons;
         this.currentYear = new Date().getFullYear();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFooterComponent, deps: [{ token: MngCommonsService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngFooterComponent, isStandalone: true, selector: "mng-footer", ngImport: i0, template: "<div class=\"layout-footer\">\n    <div class=\"footer-logo-container\">\n        <img id=\"footer-logo\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" alt=\"atlantis-layout\" />\n        <span class=\"app-name\">{{ mngCommons.appName | translate }}</span>\n    </div>\n    <span class=\"copyright\">&#169; {{ mngCommons.appOwner | translate }} - {{ currentYear }}</span>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFooterComponent, decorators: [{
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFooterComponent$1, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-footer', imports: [TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-footer\">\n    <div class=\"footer-logo-container\">\n        <img id=\"footer-logo\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" alt=\"atlantis-layout\" />\n        <span class=\"app-name\">{{ mngCommons.appName | translate }}</span>\n    </div>\n    <span class=\"copyright\">&#169; {{ mngCommons.appOwner | translate }} - {{ currentYear }}</span>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: MngCommonsService }]; } });
@@ -15123,6 +15129,30 @@ class RouteUtil {
             return basePath;
         }
     }
+    static doesUrlMatchRouterLink(link, url) {
+        if (typeof url === 'string' && url.startsWith('/')) {
+            url = url.substring(1);
+        }
+        else if (Array.isArray(url) && url.length > 0 && url[0].startsWith('/')) {
+            url[0] = url[0].substring(1);
+        }
+        const routeSegments = Array.isArray(link) ? link : link.split('/');
+        const urlSegments = Array.isArray(url) ? url : url.split('#')[0].split('?')[0].split('/');
+        if (routeSegments.length > 0 && urlSegments.length > 0) {
+            for (let i = 0; i < routeSegments.length; i++) {
+                if (i < urlSegments.length) {
+                    if (routeSegments[i] !== urlSegments[i]) {
+                        return false;
+                    }
+                }
+                else {
+                    break;
+                }
+            }
+            return true;
+        }
+        return false;
+    }
     static adjustMenuLazyChildrenRouterLinks(rootMenuItem, lazyChildren) {
         return lazyChildren.map(i => {
             const childMenuItem = { ...i };
@@ -15327,7 +15357,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
             type: Injectable
         }], ctorParameters: function () { return [{ type: MngCommonsService }]; } });
 
-class MngMenuItemComponent {
+let MngMenuItemComponent$1 = class MngMenuItemComponent {
     constructor(injector, router, route, mngRouter, authorization, mngCommons, mainLayoutService) {
         this.injector = injector;
         this.router = router;
@@ -15554,8 +15584,8 @@ class MngMenuItemComponent {
                 transition('void => visibleAnimated, visibleAnimated => void', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
             ])
         ] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMenuItemComponent, decorators: [{
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMenuItemComponent$1, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: '[mng-menuitem]', host: {
                         '[class.layout-root-menuitem]': 'root',
@@ -15604,7 +15634,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
                 args: ['class.hidden']
             }] } });
 
-class MngVersionComponent {
+let MngVersionComponent$1 = class MngVersionComponent {
     constructor(versionService, jsonPathPipe) {
         this.versionService = versionService;
         this.jsonPathPipe = jsonPathPipe;
@@ -15647,8 +15677,8 @@ class MngVersionComponent {
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngVersionComponent, deps: [{ token: MngVersionService }, { token: JsonPathPipe }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngVersionComponent, isStandalone: true, selector: "mng-version", inputs: { initVersion: ["version", "initVersion"] }, ngImport: i0, template: "<ng-container *ngIf=\"versions; else version\">\n    <ng-container *ngFor=\"let v of versions; let last = last\"> <mng-version [version]=\"v\"></mng-version><br *ngIf=\"!last\" /> </ng-container>\n</ng-container>\n<ng-template #version>\n    <ng-container *ngIf=\"displayName\">{{ displayName }}: </ng-container>\n    <ng-container *ngIf=\"(loading$ | async) === false\">{{ displayVersion }}</ng-container>\n</ng-template>\n", dependencies: [{ kind: "component", type: MngVersionComponent, selector: "mng-version", inputs: ["version"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngVersionComponent, decorators: [{
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngVersionComponent$1, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-version', imports: [AsyncPipe, NgForOf, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"versions; else version\">\n    <ng-container *ngFor=\"let v of versions; let last = last\"> <mng-version [version]=\"v\"></mng-version><br *ngIf=\"!last\" /> </ng-container>\n</ng-container>\n<ng-template #version>\n    <ng-container *ngIf=\"displayName\">{{ displayName }}: </ng-container>\n    <ng-container *ngIf=\"(loading$ | async) === false\">{{ displayVersion }}</ng-container>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: MngVersionService }, { type: JsonPathPipe }]; }, propDecorators: { initVersion: [{
@@ -15656,7 +15686,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
                 args: ['version']
             }] } });
 
-class MngMenuComponent {
+let MngMenuComponent$1 = class MngMenuComponent {
     constructor(route, mngCommons, mainLayoutService) {
         this.route = route;
         this.mngCommons = mngCommons;
@@ -15672,14 +15702,14 @@ class MngMenuComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMenuComponent, deps: [{ token: i1.ActivatedRoute }, { token: MngCommonsService }, { token: MngMainLayoutComponentService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngMenuComponent, isStandalone: true, selector: "mng-menu", ngImport: i0, template: "<div\n    class=\"layout-menu-wrapper\"\n    [ngClass]=\"{'layout-sidebar-active': (mainLayoutService.sidebarActive$ | async)}\"\n    (click)=\"mainLayoutService.onSidebarClick($event)\"\n    (mouseover)=\"mainLayoutService.onSidebarMouseOver($event)\"\n    (mouseleave)=\"mainLayoutService.onSidebarMouseLeave($event)\">\n    <div class=\"menu-logo\">\n        <a routerLink=\"/\" class=\"logo\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" />\n        </a>\n\n        <a routerLink=\"/\" class=\"app-name\" *ngIf=\"(mngCommons.menuModeIsSlim$ | async) === false || (mainLayoutService.isMobile$ | async)\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" />\n        </a>\n        <a *ngIf=\"mngCommons.menuPinEnabled\" class=\"menu-pin\" (click)=\"mainLayoutService.onToggleMenu($event)\">\n            <span *ngIf=\"mngCommons.menuModeIsOverlay$ | async\" class=\"pi pi-times\"></span>\n            <span\n                *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) === false && (mainLayoutService.pinActive$ | async)\"\n                class=\"pi pi-unlock\"></span>\n            <span *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) && (mainLayoutService.pinActive$ | async)\" class=\"pi pi-lock\"></span>\n        </a>\n    </div>\n\n    <div class=\"layout-menu-container\">\n        <ul class=\"layout-menu\">\n            <ng-container *ngFor=\"let item of menuItems; let i = index\">\n                <li mng-menuitem *ngIf=\"!item.separator\" [item]=\"item\" [index]=\"i\" [root]=\"true\"></li>\n                <li *ngIf=\"item.separator\" class=\"menu-separator\"></li>\n            </ng-container>\n        </ul>\n    </div>\n\n    <div class=\"menu-version\">\n        <mng-version [version]=\"mngCommons.appVersion\"></mng-version>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: ["item", "index", "root", "parentKey"], outputs: ["visibleChange"] }, { kind: "component", type: MngVersionComponent, selector: "mng-version", inputs: ["version"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMenuComponent, decorators: [{
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngMenuComponent, isStandalone: true, selector: "mng-menu", ngImport: i0, template: "<div\n    class=\"layout-menu-wrapper\"\n    [ngClass]=\"{'layout-sidebar-active': (mainLayoutService.sidebarActive$ | async)}\"\n    (click)=\"mainLayoutService.onSidebarClick($event)\"\n    (mouseover)=\"mainLayoutService.onSidebarMouseOver($event)\"\n    (mouseleave)=\"mainLayoutService.onSidebarMouseLeave($event)\">\n    <div class=\"menu-logo\">\n        <a routerLink=\"/\" class=\"logo\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" />\n        </a>\n\n        <a routerLink=\"/\" class=\"app-name\" *ngIf=\"(mngCommons.menuModeIsSlim$ | async) === false || (mainLayoutService.isMobile$ | async)\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" />\n        </a>\n        <a *ngIf=\"mngCommons.menuPinEnabled\" class=\"menu-pin\" (click)=\"mainLayoutService.onToggleMenu($event)\">\n            <span *ngIf=\"mngCommons.menuModeIsOverlay$ | async\" class=\"pi pi-times\"></span>\n            <span\n                *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) === false && (mainLayoutService.pinActive$ | async)\"\n                class=\"pi pi-unlock\"></span>\n            <span *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) && (mainLayoutService.pinActive$ | async)\" class=\"pi pi-lock\"></span>\n        </a>\n    </div>\n\n    <div class=\"layout-menu-container\">\n        <ul class=\"layout-menu\">\n            <ng-container *ngFor=\"let item of menuItems; let i = index\">\n                <li mng-menuitem *ngIf=\"!item.separator\" [item]=\"item\" [index]=\"i\" [root]=\"true\"></li>\n                <li *ngIf=\"item.separator\" class=\"menu-separator\"></li>\n            </ng-container>\n        </ul>\n    </div>\n\n    <div class=\"menu-version\">\n        <mng-version [version]=\"mngCommons.appVersion\"></mng-version>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MngMenuItemComponent$1, selector: "[mng-menuitem]", inputs: ["item", "index", "root", "parentKey"], outputs: ["visibleChange"] }, { kind: "component", type: MngVersionComponent$1, selector: "mng-version", inputs: ["version"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMenuComponent$1, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-menu', imports: [NgClass, AsyncPipe, NgIf, NgForOf, MngMenuItemComponent, MngVersionComponent, RouterLink], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    class=\"layout-menu-wrapper\"\n    [ngClass]=\"{'layout-sidebar-active': (mainLayoutService.sidebarActive$ | async)}\"\n    (click)=\"mainLayoutService.onSidebarClick($event)\"\n    (mouseover)=\"mainLayoutService.onSidebarMouseOver($event)\"\n    (mouseleave)=\"mainLayoutService.onSidebarMouseLeave($event)\">\n    <div class=\"menu-logo\">\n        <a routerLink=\"/\" class=\"logo\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" />\n        </a>\n\n        <a routerLink=\"/\" class=\"app-name\" *ngIf=\"(mngCommons.menuModeIsSlim$ | async) === false || (mainLayoutService.isMobile$ | async)\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" />\n        </a>\n        <a *ngIf=\"mngCommons.menuPinEnabled\" class=\"menu-pin\" (click)=\"mainLayoutService.onToggleMenu($event)\">\n            <span *ngIf=\"mngCommons.menuModeIsOverlay$ | async\" class=\"pi pi-times\"></span>\n            <span\n                *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) === false && (mainLayoutService.pinActive$ | async)\"\n                class=\"pi pi-unlock\"></span>\n            <span *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) && (mainLayoutService.pinActive$ | async)\" class=\"pi pi-lock\"></span>\n        </a>\n    </div>\n\n    <div class=\"layout-menu-container\">\n        <ul class=\"layout-menu\">\n            <ng-container *ngFor=\"let item of menuItems; let i = index\">\n                <li mng-menuitem *ngIf=\"!item.separator\" [item]=\"item\" [index]=\"i\" [root]=\"true\"></li>\n                <li *ngIf=\"item.separator\" class=\"menu-separator\"></li>\n            </ng-container>\n        </ul>\n    </div>\n\n    <div class=\"menu-version\">\n        <mng-version [version]=\"mngCommons.appVersion\"></mng-version>\n    </div>\n</div>\n" }]
+            args: [{ standalone: true, selector: 'mng-menu', imports: [NgClass, AsyncPipe, NgIf, NgForOf, MngMenuItemComponent$1, MngVersionComponent$1, RouterLink], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    class=\"layout-menu-wrapper\"\n    [ngClass]=\"{'layout-sidebar-active': (mainLayoutService.sidebarActive$ | async)}\"\n    (click)=\"mainLayoutService.onSidebarClick($event)\"\n    (mouseover)=\"mainLayoutService.onSidebarMouseOver($event)\"\n    (mouseleave)=\"mainLayoutService.onSidebarMouseLeave($event)\">\n    <div class=\"menu-logo\">\n        <a routerLink=\"/\" class=\"logo\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" />\n        </a>\n\n        <a routerLink=\"/\" class=\"app-name\" *ngIf=\"(mngCommons.menuModeIsSlim$ | async) === false || (mainLayoutService.isMobile$ | async)\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" />\n        </a>\n        <a *ngIf=\"mngCommons.menuPinEnabled\" class=\"menu-pin\" (click)=\"mainLayoutService.onToggleMenu($event)\">\n            <span *ngIf=\"mngCommons.menuModeIsOverlay$ | async\" class=\"pi pi-times\"></span>\n            <span\n                *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) === false && (mainLayoutService.pinActive$ | async)\"\n                class=\"pi pi-unlock\"></span>\n            <span *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) && (mainLayoutService.pinActive$ | async)\" class=\"pi pi-lock\"></span>\n        </a>\n    </div>\n\n    <div class=\"layout-menu-container\">\n        <ul class=\"layout-menu\">\n            <ng-container *ngFor=\"let item of menuItems; let i = index\">\n                <li mng-menuitem *ngIf=\"!item.separator\" [item]=\"item\" [index]=\"i\" [root]=\"true\"></li>\n                <li *ngIf=\"item.separator\" class=\"menu-separator\"></li>\n            </ng-container>\n        </ul>\n    </div>\n\n    <div class=\"menu-version\">\n        <mng-version [version]=\"mngCommons.appVersion\"></mng-version>\n    </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1.ActivatedRoute }, { type: MngCommonsService }, { type: MngMainLayoutComponentService }]; } });
 
-class MngTopbarUserComponent {
+let MngTopbarUserComponent$1 = class MngTopbarUserComponent {
     constructor(mngCommons, mainLayoutService, elementRef) {
         this.mngCommons = mngCommons;
         this.mainLayoutService = mainLayoutService;
@@ -15708,22 +15738,22 @@ class MngTopbarUserComponent {
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarUserComponent, deps: [{ token: MngCommonsService }, { token: MngMainLayoutComponentService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTopbarUserComponent, isStandalone: true, selector: "mng-topbar-user-component", ngImport: i0, template: "<a href=\"#\" class=\"user-block\" (click)=\"click($event)\">\n    <i class=\"pi pi-fw pi-user\"></i>\n    <span class=\"profile-item-username hidden sm:inline-block\">&nbsp; {{ user?.displayName ?? user?.username }}</span>\n</a>\n<ul class=\"fadeInDown dropdown-window\">\n    <li role=\"menuitem\">\n        <a>\n            <div class=\"flex\">\n                <div class=\"flex-grow-0\">\n                    <i class=\"pi pi-fw pi-user\"></i>\n                </div>\n                <div class=\"flex-grow-1\">\n                    <strong>{{ user?.displayName ?? user?.username }}</strong>\n                    <small *ngIf=\"((userRoles$ | async)?.length ?? 0) > 0\">\n                        <br />\n                        {{ userRoles$ | mgnEnumerateAsync : undefined : undefined : undefined : 'roles' | async }}\n                    </small>\n                </div>\n            </div>\n        </a>\n    </li>\n    <li role=\"menuitem\" *ngIf=\"user?.logout || user?.logoutUrl\">\n        <a [href]=\"user?.logoutUrl ?? hrefJsVoid\" (click)=\"logout(user, $event)\">\n            <i class=\"pi pi-fw pi-sign-out\"></i>\n            <span>{{ 'mngTopbar.logout' | translate }}</span>\n        </a>\n    </li>\n</ul>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: MngEnumerateAsyncPipe, name: "mgnEnumerateAsync" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarUserComponent, decorators: [{
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarUserComponent$1, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-topbar-user-component', imports: [NgClass, NgIf, AsyncPipe, TranslateModule, MngEnumerateAsyncPipe], template: "<a href=\"#\" class=\"user-block\" (click)=\"click($event)\">\n    <i class=\"pi pi-fw pi-user\"></i>\n    <span class=\"profile-item-username hidden sm:inline-block\">&nbsp; {{ user?.displayName ?? user?.username }}</span>\n</a>\n<ul class=\"fadeInDown dropdown-window\">\n    <li role=\"menuitem\">\n        <a>\n            <div class=\"flex\">\n                <div class=\"flex-grow-0\">\n                    <i class=\"pi pi-fw pi-user\"></i>\n                </div>\n                <div class=\"flex-grow-1\">\n                    <strong>{{ user?.displayName ?? user?.username }}</strong>\n                    <small *ngIf=\"((userRoles$ | async)?.length ?? 0) > 0\">\n                        <br />\n                        {{ userRoles$ | mgnEnumerateAsync : undefined : undefined : undefined : 'roles' | async }}\n                    </small>\n                </div>\n            </div>\n        </a>\n    </li>\n    <li role=\"menuitem\" *ngIf=\"user?.logout || user?.logoutUrl\">\n        <a [href]=\"user?.logoutUrl ?? hrefJsVoid\" (click)=\"logout(user, $event)\">\n            <i class=\"pi pi-fw pi-sign-out\"></i>\n            <span>{{ 'mngTopbar.logout' | translate }}</span>\n        </a>\n    </li>\n</ul>\n" }]
         }], ctorParameters: function () { return [{ type: MngCommonsService }, { type: MngMainLayoutComponentService }, { type: i0.ElementRef }]; } });
 
-class MngTopbarComponent {
+let MngTopbarComponent$1 = class MngTopbarComponent {
     constructor(applicationRef, route, mngCommons, mainLayoutService, config) {
         this.applicationRef = applicationRef;
         this.route = route;
         this.mngCommons = mngCommons;
         this.mainLayoutService = mainLayoutService;
         this.config = config;
-        this.breadcrumbComponent = MngBreadcrumbComponent;
-        this.menuComponent = MngMenuComponent;
-        this.topbarUserComponent = MngTopbarUserComponent;
+        this.breadcrumbComponent = MngBreadcrumbComponent$1;
+        this.menuComponent = MngMenuComponent$1;
+        this.topbarUserComponent = MngTopbarUserComponent$1;
         this.languages = ['en'];
         this.selectedLanguage = 'en';
     }
@@ -15744,9 +15774,9 @@ class MngTopbarComponent {
         this.mngCommons.appLanguage = language;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarComponent, deps: [{ token: i0.ApplicationRef }, { token: i1.ActivatedRoute }, { token: MngCommonsService }, { token: MngMainLayoutComponentService }, { token: MNG_MODULE_CONFIG_IT }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTopbarComponent, isStandalone: true, selector: "mng-topbar", viewQueries: [{ propertyName: "topbarInjectionRef", first: true, predicate: ["userMenuItem"], descendants: true }, { propertyName: "templates", predicate: MngTemplateDirective, descendants: true }], ngImport: i0, template: "<div class=\"layout-topbar\">\n    <div class=\"layout-topbar-left\">\n        <a\n            href=\"#\"\n            class=\"topbar-menu-button\"\n            (click)=\"mainLayoutService.onMenuButtonClick($event)\"\n            *ngIf=\"(mngCommons.menuModeIsOverlay$ | async) || (mainLayoutService.isMobile$ | async)\">\n            <i class=\"pi pi-bars\"></i>\n        </a>\n\n        <ng-container [mngComponent]=\"breadcrumbComponent\"></ng-container>\n    </div>\n\n    <ng-container [mngComponent]=\"menuComponent\"></ng-container>\n\n    <div class=\"layout-topbar-right\">\n        <ul class=\"layout-topbar-right-items\">\n            <li\n                #userMenuItem\n                class=\"profile-item profile-item-extended\"\n                [ngClass]=\"{'active-topmenuitem': (mainLayoutService.activeTopbarItem$ | async) === userMenuItem}\"\n                [mngComponent]=\"topbarUserComponent\"\n                [attachToHost]=\"true\"></li>\n            <li *ngIf=\"languages.length > 1\" class=\"profile-item\">\n                <i class=\"pi pi-fw pi-globe\"></i>\n                <p-dropdown [ngModel]=\"selectedLanguage\" [options]=\"languages\" (onChange)=\"switchLanguage($event.value)\"></p-dropdown>\n            </li>\n        </ul>\n    </div>\n</div>\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i3$1.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RouterModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarComponent, decorators: [{
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTopbarComponent, isStandalone: true, selector: "mng-topbar", viewQueries: [{ propertyName: "topbarInjectionRef", first: true, predicate: ["userMenuItem"], descendants: true }, { propertyName: "templates", predicate: MngTemplateDirective, descendants: true }], ngImport: i0, template: "<div class=\"layout-topbar\">\n    <div class=\"layout-topbar-left\">\n        <a\n            href=\"#\"\n            class=\"topbar-menu-button\"\n            (click)=\"mainLayoutService.onMenuButtonClick($event)\"\n            *ngIf=\"(mngCommons.menuModeIsOverlay$ | async) || (mainLayoutService.isMobile$ | async)\">\n            <i class=\"pi pi-bars\"></i>\n        </a>\n\n        <ng-container [mngComponent]=\"breadcrumbComponent\"></ng-container>\n    </div>\n\n    <ng-container [mngComponent]=\"menuComponent\"></ng-container>\n\n    <div class=\"layout-topbar-right\">\n        <ul class=\"layout-topbar-right-items\">\n            <li\n                #userMenuItem\n                class=\"profile-item profile-item-extended\"\n                [ngClass]=\"{'active-topmenuitem': (mainLayoutService.activeTopbarItem$ | async) === userMenuItem}\"\n                [mngComponent]=\"topbarUserComponent\"\n                [attachToHost]=\"true\"></li>\n            <li *ngIf=\"languages.length > 1\" class=\"profile-item\">\n                <i class=\"pi pi-fw pi-globe\"></i>\n                <p-dropdown [ngModel]=\"selectedLanguage\" [options]=\"languages\" (onChange)=\"switchLanguage($event.value)\"></p-dropdown>\n            </li>\n        </ul>\n    </div>\n</div>\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i3$1.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RouterModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarComponent$1, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'mng-topbar', imports: [AsyncPipe, NgClass, TranslateModule, NgIf, MngComponentDirective, MngEnumerateAsyncPipe, DropdownModule, FormsModule, RouterModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-topbar\">\n    <div class=\"layout-topbar-left\">\n        <a\n            href=\"#\"\n            class=\"topbar-menu-button\"\n            (click)=\"mainLayoutService.onMenuButtonClick($event)\"\n            *ngIf=\"(mngCommons.menuModeIsOverlay$ | async) || (mainLayoutService.isMobile$ | async)\">\n            <i class=\"pi pi-bars\"></i>\n        </a>\n\n        <ng-container [mngComponent]=\"breadcrumbComponent\"></ng-container>\n    </div>\n\n    <ng-container [mngComponent]=\"menuComponent\"></ng-container>\n\n    <div class=\"layout-topbar-right\">\n        <ul class=\"layout-topbar-right-items\">\n            <li\n                #userMenuItem\n                class=\"profile-item profile-item-extended\"\n                [ngClass]=\"{'active-topmenuitem': (mainLayoutService.activeTopbarItem$ | async) === userMenuItem}\"\n                [mngComponent]=\"topbarUserComponent\"\n                [attachToHost]=\"true\"></li>\n            <li *ngIf=\"languages.length > 1\" class=\"profile-item\">\n                <i class=\"pi pi-fw pi-globe\"></i>\n                <p-dropdown [ngModel]=\"selectedLanguage\" [options]=\"languages\" (onChange)=\"switchLanguage($event.value)\"></p-dropdown>\n            </li>\n        </ul>\n    </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ApplicationRef }, { type: i1.ActivatedRoute }, { type: MngCommonsService }, { type: MngMainLayoutComponentService }, { type: undefined, decorators: [{
@@ -15766,9 +15796,9 @@ class MngMainLayoutComponent {
         this.mngCommons = mngCommons;
         this.mainLayoutService = mainLayoutService;
         this.config = config;
-        this.topbarComponent = MngTopbarComponent;
-        this.menuComponent = MngMenuComponent;
-        this.footerComponent = MngFooterComponent;
+        this.topbarComponent = MngTopbarComponent$1;
+        this.menuComponent = MngMenuComponent$1;
+        this.footerComponent = MngFooterComponent$1;
     }
     ngOnInit() {
         if (this.config.components?.layout?.topbar) {
@@ -15808,11 +15838,11 @@ class MngErrorPageComponent {
         this.mngCommons = mngCommons;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngErrorPageComponent, deps: [{ token: MngCommonsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngErrorPageComponent, isStandalone: true, selector: "mng-error-page", ngImport: i0, template: "<div class=\"exception-body error\">\n    <div class=\"exception-panel\">\n        <h1>{{ 'pages.error.title' | translate }}</h1>\n        <h3>{{ 'pages.error.subtitle' | translate }}</h3>\n        <button type=\"button\" pButton [label]=\"'general.returnHome' | translate\" [routerLink]=\"['/']\"></button>\n    </div>\n    <div class=\"exception-footer\">\n        <img alt=\"logo\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" class=\"exception-logo\" />\n        <img alt=\"logo_appname\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" class=\"exception-appname\" />\n    </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngErrorPageComponent, isStandalone: true, selector: "mng-error-page", ngImport: i0, template: "<div [class]=\"'exception-body min-h-screen ' + (mngCommons.colorSchemeIsLight ? 'layout-light' : 'layout-dark')\">\n    <div class=\"exception-container min-h-screen flex align-items-center justify-content-center flex-column bg-auto md:bg-contain bg-no-repeat\">\n        <div class=\"exception-panel text-center flex align-items-center justify-content-center flex-column\">\n            <h1 class=\"text-red-400 mb-0\">{{ 'pages.notFound.title' | translate }}</h1>\n            <h3 class=\"text-red-300\">{{ 'pages.notFound.subtitle' | translate }}</h3>\n            <button type=\"button\" pButton [label]=\"'general.returnHome' | translate\" [routerLink]=\"['/']\"></button>\n        </div>\n        <div class=\"exception-footer align-items-center flex\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" class=\"exception-logo\" alt=\"App logo\" />\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" class=\"exception-appname ml-3\" alt=\"App name\" />\n        </div>\n    </div>\n</div>\n", styles: [".exception-body{background:var(--surface-ground)}.exception-body .exception-container{background:var(--exception-pages-image);background-repeat:no-repeat;background-size:contain;box-sizing:border-box}.exception-body .exception-container .exception-panel{box-sizing:border-box;flex-grow:1;margin-top:3rem;margin-bottom:3rem}.exception-body .exception-container .exception-panel h1{font-size:140px;font-weight:900;text-shadow:0 0 50px rgba(252,97,97,.2)}.exception-body .exception-container .exception-panel h3{font-size:80px;font-weight:900;margin-top:-90px;margin-bottom:50px}.exception-body .exception-container .exception-panel button{margin-top:50px}.exception-body .exception-container .exception-footer{margin-bottom:2rem}.exception-body .exception-container .exception-footer .exception-logo{width:34px}.exception-body .exception-container .exception-footer .exception-appname{width:72px}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngErrorPageComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-error-page', imports: [ButtonModule, TranslateModule, RouterLink], template: "<div class=\"exception-body error\">\n    <div class=\"exception-panel\">\n        <h1>{{ 'pages.error.title' | translate }}</h1>\n        <h3>{{ 'pages.error.subtitle' | translate }}</h3>\n        <button type=\"button\" pButton [label]=\"'general.returnHome' | translate\" [routerLink]=\"['/']\"></button>\n    </div>\n    <div class=\"exception-footer\">\n        <img alt=\"logo\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" class=\"exception-logo\" />\n        <img alt=\"logo_appname\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" class=\"exception-appname\" />\n    </div>\n</div>\n" }]
+            args: [{ standalone: true, selector: 'mng-error-page', imports: [ButtonModule, TranslateModule, RouterLink], template: "<div [class]=\"'exception-body min-h-screen ' + (mngCommons.colorSchemeIsLight ? 'layout-light' : 'layout-dark')\">\n    <div class=\"exception-container min-h-screen flex align-items-center justify-content-center flex-column bg-auto md:bg-contain bg-no-repeat\">\n        <div class=\"exception-panel text-center flex align-items-center justify-content-center flex-column\">\n            <h1 class=\"text-red-400 mb-0\">{{ 'pages.notFound.title' | translate }}</h1>\n            <h3 class=\"text-red-300\">{{ 'pages.notFound.subtitle' | translate }}</h3>\n            <button type=\"button\" pButton [label]=\"'general.returnHome' | translate\" [routerLink]=\"['/']\"></button>\n        </div>\n        <div class=\"exception-footer align-items-center flex\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" class=\"exception-logo\" alt=\"App logo\" />\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" class=\"exception-appname ml-3\" alt=\"App name\" />\n        </div>\n    </div>\n</div>\n", styles: [".exception-body{background:var(--surface-ground)}.exception-body .exception-container{background:var(--exception-pages-image);background-repeat:no-repeat;background-size:contain;box-sizing:border-box}.exception-body .exception-container .exception-panel{box-sizing:border-box;flex-grow:1;margin-top:3rem;margin-bottom:3rem}.exception-body .exception-container .exception-panel h1{font-size:140px;font-weight:900;text-shadow:0 0 50px rgba(252,97,97,.2)}.exception-body .exception-container .exception-panel h3{font-size:80px;font-weight:900;margin-top:-90px;margin-bottom:50px}.exception-body .exception-container .exception-panel button{margin-top:50px}.exception-body .exception-container .exception-footer{margin-bottom:2rem}.exception-body .exception-container .exception-footer .exception-logo{width:34px}.exception-body .exception-container .exception-footer .exception-appname{width:72px}\n"] }]
         }], ctorParameters: function () { return [{ type: MngCommonsService }]; } });
 
 class MngNotFoundPageComponent {
@@ -15820,11 +15850,11 @@ class MngNotFoundPageComponent {
         this.mngCommons = mngCommons;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngNotFoundPageComponent, deps: [{ token: MngCommonsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngNotFoundPageComponent, isStandalone: true, selector: "mng-not-found-page", ngImport: i0, template: "<div class=\"exception-body notfound\">\n    <div class=\"exception-panel\">\n        <h1>{{ 'pages.notFound.title' | translate }}</h1>\n        <h3>{{ 'pages.notFound.subtitle' | translate }}</h3>\n        <p>{{ 'pages.notFound.message' | translate }}</p>\n        <button type=\"button\" pButton [label]=\"'general.returnHome' | translate\" [routerLink]=\"['/']\"></button>\n    </div>\n    <div class=\"exception-footer\">\n        <img alt=\"logo\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" class=\"exception-logo\" />\n        <img alt=\"logo_appname\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" class=\"exception-appname\" />\n    </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngNotFoundPageComponent, isStandalone: true, selector: "mng-not-found-page", ngImport: i0, template: "<div [class]=\"'exception-body min-h-screen ' + (mngCommons.colorSchemeIsLight ? 'layout-light' : 'layout-dark')\">\n    <div class=\"exception-container min-h-screen flex align-items-center justify-content-center flex-column bg-auto md:bg-contain bg-no-repeat\">\n        <div class=\"exception-panel text-center flex align-items-center justify-content-center flex-column\">\n            <h1 class=\"text-red-400 mb-0\">{{ 'pages.notFound.title' | translate }}</h1>\n            <h3 class=\"text-red-300\">{{ 'pages.notFound.subtitle' | translate }}</h3>\n            <p>{{ 'pages.notFound.message' | translate }}</p>\n            <button type=\"button\" pButton [label]=\"'general.returnHome' | translate\" [routerLink]=\"['/']\"></button>\n        </div>\n        <div class=\"exception-footer align-items-center flex\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" class=\"exception-logo\" alt=\"App logo\" />\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" class=\"exception-appname ml-3\" alt=\"App name\" />\n        </div>\n    </div>\n</div>\n", styles: [".exception-body{background:var(--surface-ground)}.exception-body .exception-container{background:var(--exception-pages-image);background-repeat:no-repeat;background-size:contain;box-sizing:border-box}.exception-body .exception-container .exception-panel{box-sizing:border-box;flex-grow:1;margin-top:3rem;margin-bottom:3rem}.exception-body .exception-container .exception-panel h1{font-size:140px;font-weight:900;text-shadow:0 0 50px rgba(252,97,97,.2)}.exception-body .exception-container .exception-panel h3{font-size:80px;font-weight:900;margin-top:-90px;margin-bottom:50px}.exception-body .exception-container .exception-panel p{font-size:24px;font-weight:400;max-width:320px}.exception-body .exception-container .exception-panel button{margin-top:50px}.exception-body .exception-container .exception-footer{margin-bottom:2rem}.exception-body .exception-container .exception-footer .exception-logo{width:34px}.exception-body .exception-container .exception-footer .exception-appname{width:72px}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngNotFoundPageComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-not-found-page', imports: [ButtonModule, RouterLink, TranslateModule], template: "<div class=\"exception-body notfound\">\n    <div class=\"exception-panel\">\n        <h1>{{ 'pages.notFound.title' | translate }}</h1>\n        <h3>{{ 'pages.notFound.subtitle' | translate }}</h3>\n        <p>{{ 'pages.notFound.message' | translate }}</p>\n        <button type=\"button\" pButton [label]=\"'general.returnHome' | translate\" [routerLink]=\"['/']\"></button>\n    </div>\n    <div class=\"exception-footer\">\n        <img alt=\"logo\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" class=\"exception-logo\" />\n        <img alt=\"logo_appname\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" class=\"exception-appname\" />\n    </div>\n</div>\n" }]
+            args: [{ standalone: true, selector: 'mng-not-found-page', imports: [ButtonModule, RouterLink, TranslateModule], template: "<div [class]=\"'exception-body min-h-screen ' + (mngCommons.colorSchemeIsLight ? 'layout-light' : 'layout-dark')\">\n    <div class=\"exception-container min-h-screen flex align-items-center justify-content-center flex-column bg-auto md:bg-contain bg-no-repeat\">\n        <div class=\"exception-panel text-center flex align-items-center justify-content-center flex-column\">\n            <h1 class=\"text-red-400 mb-0\">{{ 'pages.notFound.title' | translate }}</h1>\n            <h3 class=\"text-red-300\">{{ 'pages.notFound.subtitle' | translate }}</h3>\n            <p>{{ 'pages.notFound.message' | translate }}</p>\n            <button type=\"button\" pButton [label]=\"'general.returnHome' | translate\" [routerLink]=\"['/']\"></button>\n        </div>\n        <div class=\"exception-footer align-items-center flex\">\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" class=\"exception-logo\" alt=\"App logo\" />\n            <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" class=\"exception-appname ml-3\" alt=\"App name\" />\n        </div>\n    </div>\n</div>\n", styles: [".exception-body{background:var(--surface-ground)}.exception-body .exception-container{background:var(--exception-pages-image);background-repeat:no-repeat;background-size:contain;box-sizing:border-box}.exception-body .exception-container .exception-panel{box-sizing:border-box;flex-grow:1;margin-top:3rem;margin-bottom:3rem}.exception-body .exception-container .exception-panel h1{font-size:140px;font-weight:900;text-shadow:0 0 50px rgba(252,97,97,.2)}.exception-body .exception-container .exception-panel h3{font-size:80px;font-weight:900;margin-top:-90px;margin-bottom:50px}.exception-body .exception-container .exception-panel p{font-size:24px;font-weight:400;max-width:320px}.exception-body .exception-container .exception-panel button{margin-top:50px}.exception-body .exception-container .exception-footer{margin-bottom:2rem}.exception-body .exception-container .exception-footer .exception-logo{width:34px}.exception-body .exception-container .exception-footer .exception-appname{width:72px}\n"] }]
         }], ctorParameters: function () { return [{ type: MngCommonsService }]; } });
 
 class MngErrorHandler {
@@ -16341,14 +16371,14 @@ const standalone = [
     MngEnumerateAsyncPipe,
     MngLocaleDefaultRowClassPipe,
     // layout components
-    MngBreadcrumbComponent,
-    MngFooterComponent,
+    MngBreadcrumbComponent$1,
+    MngFooterComponent$1,
     MngMainLayoutComponent,
-    MngMenuComponent,
-    MngMenuItemComponent,
-    MngTopbarComponent,
-    MngTopbarUserComponent,
-    MngVersionComponent,
+    MngMenuComponent$1,
+    MngMenuItemComponent$1,
+    MngTopbarComponent$1,
+    MngTopbarUserComponent$1,
+    MngVersionComponent$1,
     // mng fields
     MngAutocompleteComponent,
     MngDropdownComponent,
@@ -16451,14 +16481,14 @@ class MngCommonsModule {
             MngEnumerateAsyncPipe,
             MngLocaleDefaultRowClassPipe,
             // layout components
-            MngBreadcrumbComponent,
-            MngFooterComponent,
+            MngBreadcrumbComponent$1,
+            MngFooterComponent$1,
             MngMainLayoutComponent,
-            MngMenuComponent,
-            MngMenuItemComponent,
-            MngTopbarComponent,
-            MngTopbarUserComponent,
-            MngVersionComponent,
+            MngMenuComponent$1,
+            MngMenuItemComponent$1,
+            MngTopbarComponent$1,
+            MngTopbarUserComponent$1,
+            MngVersionComponent$1,
             // mng fields
             MngAutocompleteComponent,
             MngDropdownComponent,
@@ -16546,14 +16576,14 @@ class MngCommonsModule {
             MngEnumerateAsyncPipe,
             MngLocaleDefaultRowClassPipe,
             // layout components
-            MngBreadcrumbComponent,
-            MngFooterComponent,
+            MngBreadcrumbComponent$1,
+            MngFooterComponent$1,
             MngMainLayoutComponent,
-            MngMenuComponent,
-            MngMenuItemComponent,
-            MngTopbarComponent,
-            MngTopbarUserComponent,
-            MngVersionComponent,
+            MngMenuComponent$1,
+            MngMenuItemComponent$1,
+            MngTopbarComponent$1,
+            MngTopbarUserComponent$1,
+            MngVersionComponent$1,
             // mng fields
             MngAutocompleteComponent,
             MngDropdownComponent,
@@ -16600,12 +16630,12 @@ class MngCommonsModule {
             }),
             FormlyModule.forChild(), primeNgModules, MngActionRouteComponent,
             // layout components
-            MngBreadcrumbComponent,
-            MngFooterComponent,
-            MngMenuComponent,
-            MngMenuItemComponent,
-            MngTopbarComponent,
-            MngTopbarUserComponent,
+            MngBreadcrumbComponent$1,
+            MngFooterComponent$1,
+            MngMenuComponent$1,
+            MngMenuItemComponent$1,
+            MngTopbarComponent$1,
+            MngTopbarUserComponent$1,
             // mng fields
             MngAutocompleteComponent,
             MngDropdownComponent,
@@ -16851,6 +16881,701 @@ class AMngCrudApiService extends AMngGetAllApiService {
     }
 }
 
+class MngBreadcrumbComponent {
+    constructor() {
+        this.mngCommons = inject(MngCommonsService);
+        this.mappedBreadcrumbs$ = this.mngCommons.breadcrumbs$.pipe(map((items) => items.map(el => this.mapMngMenuItem(el))));
+    }
+    mapMngMenuItem(item) {
+        return {
+            ...item,
+            url: item.href,
+            badgeStyleClass: item.badgeClassName,
+            styleClass: item.className
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngBreadcrumbComponent, isStandalone: true, selector: "mng-breadcrumb-v2", ngImport: i0, template: "<div class=\"layout-breadcrumb flex align-items-center relative h-3rem\">\n    <nav>\n        <ol class=\"relative z-2\">\n            <ng-template ngFor let-item let-last=\"last\" [ngForOf]=\"mappedBreadcrumbs$ | async\">\n                <li>{{ item.label! | translate }}</li>\n                <li *ngIf=\"!last\" class=\"layout-breadcrumb-chevron\">/</li>\n            </ng-template>\n        </ol>\n    </nav>\n</div>\n", dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngBreadcrumbComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'mng-breadcrumb-v2', imports: [NgForOf, NgClass, InputTextModule, ButtonModule, AsyncPipe, NgIf, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-breadcrumb flex align-items-center relative h-3rem\">\n    <nav>\n        <ol class=\"relative z-2\">\n            <ng-template ngFor let-item let-last=\"last\" [ngForOf]=\"mappedBreadcrumbs$ | async\">\n                <li>{{ item.label! | translate }}</li>\n                <li *ngIf=\"!last\" class=\"layout-breadcrumb-chevron\">/</li>\n            </ng-template>\n        </ol>\n    </nav>\n</div>\n" }]
+        }] });
+
+class MngFooterComponent {
+    constructor() {
+        this.mngCommons = inject(MngCommonsService);
+        this.currentYear = new Date().getFullYear();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngFooterComponent, isStandalone: true, selector: "mng-footer-v2", ngImport: i0, template: "<div class=\"layout-footer\">\n    <div class=\"footer-logo-container\">\n        <img id=\"footer-logo\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" alt=\"atlantis-layout\" />\n        <span class=\"app-name\">{{ mngCommons.appName | translate }}</span>\n    </div>\n    <span class=\"copyright\">&#169; {{ mngCommons.appOwner | translate }} - {{ currentYear }}</span>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngFooterComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'mng-footer-v2', imports: [TranslateModule, NgOptimizedImage], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-footer\">\n    <div class=\"footer-logo-container\">\n        <img id=\"footer-logo\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" alt=\"atlantis-layout\" />\n        <span class=\"app-name\">{{ mngCommons.appName | translate }}</span>\n    </div>\n    <span class=\"copyright\">&#169; {{ mngCommons.appOwner | translate }} - {{ currentYear }}</span>\n</div>\n" }]
+        }] });
+
+class MngMainLayoutComponentV2Service {
+    constructor() {
+        this.config = inject(MNG_MODULE_CONFIG_IT);
+        this.state = {
+            staticMenuDesktopInactive$: new BehaviorSubject(false),
+            overlayMenuActive$: new BehaviorSubject(false),
+            rightMenuActive$: new BehaviorSubject(false),
+            configSidebarVisible$: new BehaviorSubject(false),
+            staticMenuMobileActive$: new BehaviorSubject(false),
+            menuHoverActive$: new BehaviorSubject(false),
+            sidebarActive$: new BehaviorSubject(false),
+            anchored$: new BehaviorSubject(false)
+        };
+        this.overlayOpen = new Subject();
+        this.overlayOpen$ = this.overlayOpen.asObservable();
+    }
+    onMenuToggle() {
+        if (this.isOverlay()) {
+            this.state.overlayMenuActive$.next(!this.state.overlayMenuActive$.value);
+            if (this.state.overlayMenuActive$.value) {
+                this.overlayOpen.next(null);
+            }
+        }
+        if (this.isDesktop()) {
+            this.state.staticMenuDesktopInactive$.next(!this.state.staticMenuDesktopInactive$.value);
+        }
+        else {
+            this.state.staticMenuMobileActive$.next(!this.state.staticMenuMobileActive$.value);
+            if (this.state.staticMenuMobileActive$.value) {
+                this.overlayOpen.next(null);
+            }
+        }
+    }
+    isOverlay() {
+        return this.config.menuV2?.mode === 'overlay';
+    }
+    isDesktop() {
+        return window.innerWidth > 991;
+    }
+    isMobile() {
+        return !this.isDesktop();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMainLayoutComponentV2Service, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMainLayoutComponentV2Service }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMainLayoutComponentV2Service, decorators: [{
+            type: Injectable
+        }] });
+
+class MenuService {
+    constructor() {
+        this.logger = MngLoggerService.create('MenuService');
+        this.router = inject(Router);
+        this.mngRouter = inject(MngRouterService);
+        this.menuSource = new ReplaySubject(1);
+        this.resetSource = new Subject();
+        this.menuSource$ = this.menuSource.asObservable();
+        this.resetSource$ = this.resetSource.asObservable();
+        this.menuItems = [];
+        this.routeLoadedChildrenSubscriptions = [];
+    }
+    initialize(menuItems) {
+        this.menuItems = menuItems;
+        this.routeLoadedChildrenSubscriptions.forEach(s => s.unsubscribe());
+        this.routeLoadedChildrenSubscriptions = [];
+        this.generateMenuItemKeys(menuItems);
+        this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe(e => {
+            this.findAndSetActiveMenuItem(e.urlAfterRedirects);
+        });
+        this.findAndSetActiveMenuItem(this.router.url);
+    }
+    generateMenuItemKeys(menuItems, parentKey = '') {
+        menuItems.forEach((item, idx) => {
+            if (!item.index) {
+                item.index = idx;
+                item.key = parentKey ? parentKey + '-' + idx : idx.toString();
+            }
+            if (item.items) {
+                this.generateMenuItemKeys(item.items, item.key);
+            }
+            else if (item.lazyChildren) {
+                this.listenToMenuItemLazyChildrenLoad(item);
+            }
+        });
+    }
+    findAndSetActiveMenuItem(url) {
+        const matches = this.findActiveRouteMatches(this.menuItems, url);
+        if (matches.length === 0) {
+            this.reset();
+        }
+        else {
+            const matchKey = matches[0][matches[0].length - 1].key;
+            if (matchKey) {
+                this.menuSource.next({
+                    key: matchKey,
+                    routeEvent: true
+                });
+            }
+            else {
+                this.logger.warn(`Found active menu item for url ${url}, but item key is not present`, matches);
+                this.reset();
+            }
+            if (matches.length > 1) {
+                this.logger.warn(`Multiple active menu items found for url ${url}`, matches);
+            }
+        }
+    }
+    listenToMenuItemLazyChildrenLoad(menuItem) {
+        this.routeLoadedChildrenSubscriptions.push(this.mngRouter
+            .getRouteLoadedChildren$(menuItem.routerLink ?? '/')
+            .pipe(take(1))
+            .subscribe({
+            next: routes => {
+                let menuItems = routes.filter(r => Array.isArray(r.data?.menuItems)).flatMap(r => r.data.menuItems);
+                menuItems = RouteUtil.adjustMenuLazyChildrenRouterLinks(menuItem, menuItems);
+                menuItem.items = menuItems;
+                menuItem.lazyChildren = false;
+                this.generateMenuItemKeys(menuItem.items, menuItem.key);
+                this.findAndSetActiveMenuItem(this.router.url);
+            }
+        }));
+    }
+    findActiveRouteMatches(menuItems, url) {
+        const matches = [];
+        for (const menuItem of menuItems) {
+            if (menuItem.routerLink) {
+                const isActive = RouteUtil.doesUrlMatchRouterLink(menuItem.routerLink, url);
+                if (isActive) {
+                    if (Array.isArray(menuItem.items)) {
+                        const itemsMatches = this.findActiveRouteMatches(menuItem.items, url);
+                        if (itemsMatches.length > 0) {
+                            matches.push(...itemsMatches.map(c => [menuItem, ...c]));
+                        }
+                        else {
+                            matches.push([menuItem]);
+                        }
+                    }
+                    else {
+                        matches.push([menuItem]);
+                    }
+                }
+            }
+            else if (Array.isArray(menuItem.items)) {
+                const itemsMatches = this.findActiveRouteMatches(menuItem.items, url);
+                if (itemsMatches.length > 0) {
+                    matches.push(...itemsMatches.map(c => [menuItem, ...c]));
+                }
+            }
+        }
+        return matches;
+    }
+    reset() {
+        this.resetSource.next(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MenuService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MenuService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class MngMenuItemComponent {
+    constructor() {
+        this.router = inject(Router);
+        this.injector = inject(Injector);
+        this.destroyRef = inject(DestroyRef);
+        this.route = inject(ActivatedRoute);
+        this.menuService = inject(MenuService);
+        this.authorization = inject(MngAuthorizationService);
+        this.layoutService = inject(MngMainLayoutComponentV2Service);
+        this.isPermittedSubject = new BehaviorSubject(true);
+        this.guardsIsAllowedSubject = new BehaviorSubject(true);
+        this.childrenVisibilitySubject = [];
+        this.root = false;
+        this.visibleChangeEventEmitter = new EventEmitter();
+        this.active = signal(false);
+        this.visible = signal(false);
+        this.guardsIsAllowed$ = this.guardsIsAllowedSubject.asObservable().pipe(distinctUntilChanged());
+        this.isPermitted$ = this.isPermittedSubject.asObservable().pipe(distinctUntilChanged());
+        this.menuService.menuSource$.pipe(takeUntilDestroyed()).subscribe(value => {
+            setTimeout(() => {
+                this.active.set(this.item.key === value.key || value.key.startsWith((this.item.key ?? '') + '-'));
+            });
+        });
+        this.menuService.resetSource$.pipe(takeUntilDestroyed()).subscribe(() => {
+            this.active.set(false);
+        });
+    }
+    ngOnInit() {
+        if (this.item.routerLink) {
+            if (typeof this.item.routerLink === 'string') {
+                this.itemUrl = this.item.routerLink;
+            }
+            else {
+                this.itemUrl = this.router.parseUrl(this.item.routerLink.join('/'));
+            }
+        }
+        this.routerEventsSubscription = this.router.events.subscribe(next => {
+            if (next instanceof GuardsCheckEnd && next.shouldActivate) {
+                this.checkIfMenuItemIsAllowedFromGuard(next.state);
+            }
+            else if (next instanceof NavigationEnd) {
+                if (!this.layoutService.isMobile()) {
+                    this.active.set(false);
+                }
+                else {
+                    this.updateActiveStateFromRoute();
+                }
+            }
+        });
+        if (this.item.permissions) {
+            this.authorization
+                .isPermitted(this.item.permissions)
+                .pipe(takeUntilDestroyed(this.destroyRef))
+                .subscribe({
+                next: isPermitted => {
+                    this.isPermittedSubject.next(isPermitted);
+                }
+            });
+        }
+        this.checkIfMenuItemIsAllowedFromGuard(this.router.routerState.snapshot);
+        combineLatest([of(this.item.visible !== false), this.isPermitted$, this.guardsIsAllowed$])
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: res => {
+                const isVisible = res.every(r => r === true);
+                this.active.set(!isVisible);
+                this.visible.set(isVisible);
+            }
+        });
+        this.processItemChildrenVisibility();
+    }
+    ngOnDestroy() {
+        this.routerEventsSubscription?.unsubscribe();
+        this.guardsIsAllowedSubscription?.unsubscribe();
+    }
+    get submenuAnimation() {
+        return this.root ? 'expanded' : this.active() ? 'expanded' : 'collapsed';
+    }
+    get activeClass() {
+        return this.active() && !this.root;
+    }
+    itemClick(event) {
+        // avoid processing disabled items
+        if (this.item.disabled) {
+            event.preventDefault();
+            return;
+        }
+        // toggle active state
+        if (!(this.item.items || this.item.lazyChildren)) {
+            if (this.layoutService.isMobile()) {
+                this.layoutService.state.staticMenuMobileActive$.next(false);
+            }
+        }
+    }
+    onChildVisibleChange(visible, item, idx) {
+        this.childrenVisibilitySubject[idx].next(visible);
+    }
+    checkIfMenuItemIsAllowedFromGuard(routerState) {
+        this.guardsIsAllowedSubscription?.unsubscribe();
+        if (this.item.guards?.length) {
+            const obs = [];
+            for (const guard of this.item.guards) {
+                if (guard && typeof guard === 'function') {
+                    const guardFnInstance = guard;
+                    runInInjectionContext(this.injector, () => {
+                        const canActivateRes = guardFnInstance(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.guardsIsAllowedSubscription = combineLatest(obs)
+                .pipe(first())
+                .subscribe(next => {
+                const result = next.every(n => n === true);
+                this.guardsIsAllowedSubject.next(result);
+            });
+        }
+        else {
+            this.guardsIsAllowedSubject.next(true);
+        }
+    }
+    updateActiveStateFromRoute() {
+        if (this.itemUrl) {
+            this.active.set(this.router.isActive(this.itemUrl, {
+                matrixParams: 'ignored',
+                queryParams: 'ignored',
+                paths: this.item.items ? 'subset' : 'exact',
+                fragment: 'ignored'
+            }));
+        }
+        else {
+            this.active.set(false);
+        }
+    }
+    processItemChildrenVisibility() {
+        if (this.item.items) {
+            this.childrenVisibilitySubject = this.item.items.map(() => new BehaviorSubject(true));
+            combineLatest(this.childrenVisibilitySubject.map(s => s.asObservable().pipe(distinctUntilChanged())))
+                .pipe(takeUntilDestroyed(this.destroyRef))
+                .subscribe(visible => {
+                const anyChildVisible = visible.some(v => v === true);
+                this.active.set(!anyChildVisible);
+            });
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngMenuItemComponent, isStandalone: true, selector: "[mng-menuitem-v2]", inputs: { item: "item", root: "root" }, outputs: { visibleChangeEventEmitter: "visibleChange" }, host: { properties: { "class.layout-root-menuitem": "this.root", "class.active-menuitem": "this.activeClass" } }, viewQueries: [{ propertyName: "submenu", first: true, predicate: ["submenu"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"visible()\">\n    <div *ngIf=\"root\" class=\"layout-menuitem-root-text\">\n        {{ item.label! | translate }}\n    </div>\n    <a\n        *ngIf=\"!item.href && (!item.routerLink || item.items)\"\n        [attr.href]=\"item.href\"\n        (click)=\"itemClick($event)\"\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 || item.lazyChildren\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <a\n        *ngIf=\"!item.href && item.routerLink && !item.items\"\n        (click)=\"itemClick($event)\"\n        [routerLink]=\"item.routerLink\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.className ?? '' + (this.active() ? ' active-route' : '')\"\n        [preserveFragment]=\"item.preserveFragment\"\n        [skipLocationChange]=\"item.skipLocationChange\"\n        [replaceUrl]=\"item.replaceUrl\"\n        [queryParams]=\"item.queryParams\"\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 || item.lazyChildren\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <a\n        *ngIf=\"item.href && !item.items\"\n        (click)=\"itemClick($event)\"\n        [attr.href]=\"item.href\"\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 || item.lazyChildren\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n\n    <ul #submenu *ngIf=\"item.items\" [@children]=\"submenuAnimation\">\n        <ng-template ngFor let-child let-i=\"index\" [ngForOf]=\"item.items\">\n            <li mng-menuitem-v2 [item]=\"child\" [class]=\"child.badgeClassName\" (visibleChange)=\"onChildVisibleChange($event, item, i)\"></li>\n        </ng-template>\n    </ul>\n</ng-container>\n", dependencies: [{ kind: "component", type: MngMenuItemComponent, selector: "[mng-menuitem-v2]", inputs: ["item", "root"], outputs: ["visibleChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], animations: [
+            trigger('children', [
+                state('collapsed', style({
+                    height: '0'
+                })),
+                state('expanded', style({
+                    height: '*'
+                })),
+                state('hidden', style({
+                    display: 'none'
+                })),
+                state('visible', style({
+                    display: 'block'
+                })),
+                transition('collapsed <=> expanded', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
+            ])
+        ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMenuItemComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: '[mng-menuitem-v2]', imports: [NgIf, NgClass, RippleModule, TooltipModule, RouterModule, NgForOf, TranslateModule, AsyncPipe], changeDetection: ChangeDetectionStrategy.OnPush, animations: [
+                        trigger('children', [
+                            state('collapsed', style({
+                                height: '0'
+                            })),
+                            state('expanded', style({
+                                height: '*'
+                            })),
+                            state('hidden', style({
+                                display: 'none'
+                            })),
+                            state('visible', style({
+                                display: 'block'
+                            })),
+                            transition('collapsed <=> expanded', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
+                        ])
+                    ], template: "<ng-container *ngIf=\"visible()\">\n    <div *ngIf=\"root\" class=\"layout-menuitem-root-text\">\n        {{ item.label! | translate }}\n    </div>\n    <a\n        *ngIf=\"!item.href && (!item.routerLink || item.items)\"\n        [attr.href]=\"item.href\"\n        (click)=\"itemClick($event)\"\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 || item.lazyChildren\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <a\n        *ngIf=\"!item.href && item.routerLink && !item.items\"\n        (click)=\"itemClick($event)\"\n        [routerLink]=\"item.routerLink\"\n        [attr.target]=\"item.target\"\n        [attr.tabindex]=\"0\"\n        [ngClass]=\"item.className ?? '' + (this.active() ? ' active-route' : '')\"\n        [preserveFragment]=\"item.preserveFragment\"\n        [skipLocationChange]=\"item.skipLocationChange\"\n        [replaceUrl]=\"item.replaceUrl\"\n        [queryParams]=\"item.queryParams\"\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 || item.lazyChildren\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n    <a\n        *ngIf=\"item.href && !item.items\"\n        (click)=\"itemClick($event)\"\n        [attr.href]=\"item.href\"\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 || item.lazyChildren\"></i>\n        <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n    </a>\n\n    <ul #submenu *ngIf=\"item.items\" [@children]=\"submenuAnimation\">\n        <ng-template ngFor let-child let-i=\"index\" [ngForOf]=\"item.items\">\n            <li mng-menuitem-v2 [item]=\"child\" [class]=\"child.badgeClassName\" (visibleChange)=\"onChildVisibleChange($event, item, i)\"></li>\n        </ng-template>\n    </ul>\n</ng-container>\n" }]
+        }], ctorParameters: function () { return []; }, propDecorators: { item: [{
+                type: Input,
+                args: [{ required: true }]
+            }], root: [{
+                type: Input
+            }, {
+                type: HostBinding,
+                args: ['class.layout-root-menuitem']
+            }], visibleChangeEventEmitter: [{
+                type: Output,
+                args: ['visibleChange']
+            }], submenu: [{
+                type: ViewChild,
+                args: ['submenu']
+            }], activeClass: [{
+                type: HostBinding,
+                args: ['class.active-menuitem']
+            }] } });
+
+class MngMenuComponent {
+    constructor() {
+        this.route = inject(ActivatedRoute);
+        this.menuService = inject(MenuService);
+        this.mngCommons = inject(MngCommonsService);
+        this.menuItems = [];
+    }
+    ngOnInit() {
+        if (Array.isArray(this.mngCommons.menuItems)) {
+            this.menuItems = [{ items: this.mngCommons.menuItems }];
+        }
+        else if (Array.isArray(this.route.snapshot.data?.menuItems)) {
+            this.menuItems = [{ items: this.route.snapshot.data.menuItems }];
+        }
+        this.menuService.initialize(this.menuItems);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngMenuComponent, isStandalone: true, selector: "mng-menu-v2", ngImport: i0, template: "<ul class=\"layout-menu\">\n    <ng-container *ngFor=\"let item of menuItems\">\n        <li mng-menuitem-v2 *ngIf=\"!item.separator\" [item]=\"item\" [root]=\"true\"></li>\n        <li *ngIf=\"item.separator\" class=\"menu-separator\"></li>\n    </ng-container>\n</ul>\n", dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MngMenuItemComponent, selector: "[mng-menuitem-v2]", inputs: ["item", "root"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMenuComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'mng-menu-v2', imports: [NgForOf, NgIf, MngMenuItemComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul class=\"layout-menu\">\n    <ng-container *ngFor=\"let item of menuItems\">\n        <li mng-menuitem-v2 *ngIf=\"!item.separator\" [item]=\"item\" [root]=\"true\"></li>\n        <li *ngIf=\"item.separator\" class=\"menu-separator\"></li>\n    </ng-container>\n</ul>\n" }]
+        }] });
+
+class MngVersionComponent {
+    constructor(versionService, jsonPathPipe) {
+        this.versionService = versionService;
+        this.jsonPathPipe = jsonPathPipe;
+        this.loadingSubject = new BehaviorSubject(false);
+        this.loading$ = this.loadingSubject.asObservable();
+    }
+    ngOnInit() {
+        if (Array.isArray(this.initVersion)) {
+            this.versions = this.initVersion;
+        }
+        else if (typeof this.initVersion === 'string') {
+            this.displayVersion = this.initVersion;
+        }
+        else if (typeof this.initVersion !== 'undefined') {
+            if (this.initVersion['info'] || this.initVersion['urlPath']) {
+                const config = this.initVersion;
+                this.displayName = config.displayName;
+                if (config.urlPath) {
+                    this.loadingSubject.next(true);
+                    this.versionService
+                        .loadVersion(config.urlPath, config.urlBaseConfigKey)
+                        .pipe(take(1))
+                        .subscribe({
+                        next: res => {
+                            this.displayVersion = this.jsonPathPipe.transform(res, config.infoJsonPath ?? '$');
+                            this.loadingSubject.next(false);
+                        },
+                        error: () => {
+                            this.displayVersion = '';
+                            this.loadingSubject.next(false);
+                        }
+                    });
+                }
+                else {
+                    this.displayVersion = this.jsonPathPipe.transform(config.info, config.infoJsonPath ?? '$.raw');
+                }
+            }
+            else {
+                const info = this.initVersion;
+                this.displayVersion = this.jsonPathPipe.transform(info, '$.raw');
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngVersionComponent, deps: [{ token: MngVersionService }, { token: JsonPathPipe }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngVersionComponent, isStandalone: true, selector: "mng-version-v2", inputs: { initVersion: ["version", "initVersion"] }, ngImport: i0, template: "<ng-container *ngIf=\"versions; else version\">\n    <ng-container *ngFor=\"let v of versions; let last = last\"> <mng-version-v2 [version]=\"v\"></mng-version-v2><br *ngIf=\"!last\" /> </ng-container>\n</ng-container>\n<ng-template #version>\n    <ng-container *ngIf=\"displayName\">{{ displayName }}: </ng-container>\n    <ng-container *ngIf=\"(loading$ | async) === false\">{{ displayVersion }}</ng-container>\n</ng-template>\n", dependencies: [{ kind: "component", type: MngVersionComponent, selector: "mng-version-v2", inputs: ["version"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngVersionComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'mng-version-v2', imports: [AsyncPipe, NgForOf, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"versions; else version\">\n    <ng-container *ngFor=\"let v of versions; let last = last\"> <mng-version-v2 [version]=\"v\"></mng-version-v2><br *ngIf=\"!last\" /> </ng-container>\n</ng-container>\n<ng-template #version>\n    <ng-container *ngIf=\"displayName\">{{ displayName }}: </ng-container>\n    <ng-container *ngIf=\"(loading$ | async) === false\">{{ displayVersion }}</ng-container>\n</ng-template>\n" }]
+        }], ctorParameters: function () { return [{ type: MngVersionService }, { type: JsonPathPipe }]; }, propDecorators: { initVersion: [{
+                type: Input,
+                args: ['version']
+            }] } });
+
+class MngSidebarComponent {
+    constructor() {
+        this.config = inject(MNG_MODULE_CONFIG_IT);
+        this.mngCommons = inject(MngCommonsService);
+        this.layoutService = inject(MngMainLayoutComponentV2Service);
+        this.el = inject(ElementRef);
+        this.timeout = null;
+        this.menuComponent = MngMenuComponent;
+    }
+    ngOnInit() {
+        if (this.config.components?.layout?.menu) {
+            this.menuComponent = this.config.components.layout.menu;
+        }
+    }
+    onMouseEnter() {
+        if (!this.layoutService.state.anchored$.value) {
+            if (this.timeout) {
+                clearTimeout(this.timeout);
+                this.timeout = null;
+            }
+            this.layoutService.state.sidebarActive$.next(true);
+        }
+    }
+    onMouseLeave() {
+        if (!this.layoutService.state.anchored$.value) {
+            if (!this.timeout) {
+                this.timeout = setTimeout(() => this.layoutService.state.sidebarActive$.next(false), 300);
+            }
+        }
+    }
+    anchor() {
+        this.layoutService.state.anchored$.next(!this.layoutService.state.anchored$.value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngSidebarComponent, isStandalone: true, selector: "mng-sidebar-v2", viewQueries: [{ propertyName: "menuContainer", first: true, predicate: ["menuContainer"], descendants: true }], ngImport: i0, template: "<div class=\"layout-sidebar\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n    <div class=\"sidebar-header\">\n        <a [routerLink]=\"['/']\" class=\"app-logo\">\n            <div class=\"app-logo-small h-2rem\">\n                <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" [alt]=\"'App logo'\" />\n            </div>\n            <div class=\"app-logo-normal\">\n                <img class=\"h-2rem\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" [alt]=\"'App logo'\" />\n                <img class=\"h-2rem ml-3\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" [alt]=\"'App name'\" />\n            </div>\n        </a>\n        <button class=\"layout-sidebar-anchor p-link z-2\" type=\"button\" (click)=\"anchor()\"></button>\n    </div>\n\n    <div #menuContainer class=\"layout-menu-container\">\n        <div [mngComponent]=\"menuComponent\" [attachToHost]=\"true\"></div>\n    </div>\n\n    <div class=\"menu-version\">\n        <mng-version-v2 [version]=\"mngCommons.appVersion\"></mng-version-v2>\n    </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: MngVersionComponent, selector: "mng-version-v2", inputs: ["version"] }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngSidebarComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'mng-sidebar-v2', imports: [RouterModule, MngMenuComponent, MngVersionComponent, MngComponentDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-sidebar\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n    <div class=\"sidebar-header\">\n        <a [routerLink]=\"['/']\" class=\"app-logo\">\n            <div class=\"app-logo-small h-2rem\">\n                <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" [alt]=\"'App logo'\" />\n            </div>\n            <div class=\"app-logo-normal\">\n                <img class=\"h-2rem\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" [alt]=\"'App logo'\" />\n                <img class=\"h-2rem ml-3\" [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" [alt]=\"'App name'\" />\n            </div>\n        </a>\n        <button class=\"layout-sidebar-anchor p-link z-2\" type=\"button\" (click)=\"anchor()\"></button>\n    </div>\n\n    <div #menuContainer class=\"layout-menu-container\">\n        <div [mngComponent]=\"menuComponent\" [attachToHost]=\"true\"></div>\n    </div>\n\n    <div class=\"menu-version\">\n        <mng-version-v2 [version]=\"mngCommons.appVersion\"></mng-version-v2>\n    </div>\n</div>\n" }]
+        }], propDecorators: { menuContainer: [{
+                type: ViewChild,
+                args: ['menuContainer']
+            }] } });
+
+class MngTopbarUserComponent {
+    constructor() {
+        this.destroyRef = inject(DestroyRef);
+        this.mngCommons = inject(MngCommonsService);
+        this.hrefJsVoid = inject(DomSanitizer).bypassSecurityTrustUrl('javascript:void(0)');
+    }
+    ngOnInit() {
+        this.mngCommons.user$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(u => {
+            this.user = u;
+        });
+        this.userRoles$ = this.mngCommons.userRoles$;
+    }
+    logout(user, event) {
+        if (typeof user?.logout === 'function') {
+            event.preventDefault();
+            event.stopPropagation();
+            user.logout();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarUserComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTopbarUserComponent, isStandalone: true, selector: "mng-topbar-user-component-v2", ngImport: i0, template: "<a\n    class=\"cursor-pointer lg:pr-4\"\n    pStyleClass=\"@next\"\n    enterClass=\"ng-hidden\"\n    enterActiveClass=\"px-scalein\"\n    leaveToClass=\"ng-hidden\"\n    leaveActiveClass=\"px-fadeout\"\n    [hideOnOutsideClick]=\"true\"\n    pRipple>\n    <i class=\"pi pi-fw pi-user text-2xl\"></i>\n    <span class=\"hidden sm:inline-block\">&nbsp; {{ user?.displayName ?? user?.username }}</span>\n</a>\n<ul class=\"topbar-menu active-topbar-menu w-15rem z-5 ng-hidden border-round\">\n    <li role=\"menuitem\">\n        <a\n            class=\"flex align-items-center transition-duration-200\"\n            pStyleClass=\"@grandparent\"\n            enterClass=\"ng-hidden\"\n            enterActiveClass=\"px-scalein\"\n            leaveToClass=\"ng-hidden\"\n            leaveActiveClass=\"px-fadeout\">\n            <i class=\"pi pi-fw pi-user text-base mr-2\"></i>\n            <div>\n                <strong>{{ user?.displayName ?? user?.username }}</strong>\n                <small *ngIf=\"((userRoles$ | async)?.length ?? 0) > 0\">\n                    <br />\n                    {{ userRoles$ | mgnEnumerateAsync : undefined : undefined : undefined : 'roles' | async }}\n                </small>\n            </div>\n        </a>\n    </li>\n    <li role=\"menuitem\" *ngIf=\"user?.logout || user?.logoutUrl\">\n        <a\n            [href]=\"user?.logoutUrl ?? hrefJsVoid\"\n            (click)=\"logout(user, $event)\"\n            class=\"flex align-items-center hover:text-primary-500 transition-duration-200\"\n            pStyleClass=\"@grandparent\"\n            enterClass=\"ng-hidden\"\n            enterActiveClass=\"px-scalein\"\n            leaveToClass=\"ng-hidden\"\n            leaveActiveClass=\"px-fadeout\">\n            <i class=\"pi pi-fw pi-sign-out text-base mr-2\"></i>\n            <span>{{ 'mngTopbar.logout' | translate }}</span>\n        </a>\n    </li>\n</ul>\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: MngEnumerateAsyncPipe, name: "mgnEnumerateAsync" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i6$1.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i3$4.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterClass", "enterActiveClass", "enterToClass", "leaveClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarUserComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'mng-topbar-user-component-v2', imports: [AsyncPipe, MngEnumerateAsyncPipe, NgIf, TranslateModule, RippleModule, StyleClassModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<a\n    class=\"cursor-pointer lg:pr-4\"\n    pStyleClass=\"@next\"\n    enterClass=\"ng-hidden\"\n    enterActiveClass=\"px-scalein\"\n    leaveToClass=\"ng-hidden\"\n    leaveActiveClass=\"px-fadeout\"\n    [hideOnOutsideClick]=\"true\"\n    pRipple>\n    <i class=\"pi pi-fw pi-user text-2xl\"></i>\n    <span class=\"hidden sm:inline-block\">&nbsp; {{ user?.displayName ?? user?.username }}</span>\n</a>\n<ul class=\"topbar-menu active-topbar-menu w-15rem z-5 ng-hidden border-round\">\n    <li role=\"menuitem\">\n        <a\n            class=\"flex align-items-center transition-duration-200\"\n            pStyleClass=\"@grandparent\"\n            enterClass=\"ng-hidden\"\n            enterActiveClass=\"px-scalein\"\n            leaveToClass=\"ng-hidden\"\n            leaveActiveClass=\"px-fadeout\">\n            <i class=\"pi pi-fw pi-user text-base mr-2\"></i>\n            <div>\n                <strong>{{ user?.displayName ?? user?.username }}</strong>\n                <small *ngIf=\"((userRoles$ | async)?.length ?? 0) > 0\">\n                    <br />\n                    {{ userRoles$ | mgnEnumerateAsync : undefined : undefined : undefined : 'roles' | async }}\n                </small>\n            </div>\n        </a>\n    </li>\n    <li role=\"menuitem\" *ngIf=\"user?.logout || user?.logoutUrl\">\n        <a\n            [href]=\"user?.logoutUrl ?? hrefJsVoid\"\n            (click)=\"logout(user, $event)\"\n            class=\"flex align-items-center hover:text-primary-500 transition-duration-200\"\n            pStyleClass=\"@grandparent\"\n            enterClass=\"ng-hidden\"\n            enterActiveClass=\"px-scalein\"\n            leaveToClass=\"ng-hidden\"\n            leaveActiveClass=\"px-fadeout\">\n            <i class=\"pi pi-fw pi-sign-out text-base mr-2\"></i>\n            <span>{{ 'mngTopbar.logout' | translate }}</span>\n        </a>\n    </li>\n</ul>\n" }]
+        }] });
+
+class MngTopbarComponent {
+    constructor() {
+        this.el = inject(ElementRef);
+        this.mngCommons = inject(MngCommonsService);
+        this.mainLayoutService = inject(MngMainLayoutComponentV2Service);
+        this.config = inject(MNG_MODULE_CONFIG_IT);
+        this.breadcrumbComponent = MngBreadcrumbComponent;
+        this.topbarUserComponent = MngTopbarUserComponent;
+        this.languages = ['en'];
+        this.selectedLanguage = 'en';
+    }
+    ngOnInit() {
+        if (this.config.components?.layout?.topbarUser) {
+            this.topbarUserComponent = this.config.components.layout.topbarUser;
+        }
+        if (this.config.components?.layout?.breadcrumb) {
+            this.breadcrumbComponent = this.config.components.layout.breadcrumb;
+        }
+        this.languages = this.mngCommons.appLanguages;
+        this.selectedLanguage = this.mngCommons.getOrInitLanguage();
+    }
+    onMenuButtonClick() {
+        this.mainLayoutService.onMenuToggle();
+    }
+    switchLanguage(language) {
+        this.mngCommons.appLanguage = language;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngTopbarComponent, isStandalone: true, selector: "mng-topbar-v2", viewQueries: [{ propertyName: "menuButton", first: true, predicate: ["menubutton"], descendants: true }, { propertyName: "topbarInjectionRef", first: true, predicate: ["userMenuItem"], descendants: true }, { propertyName: "appSidebar", first: true, predicate: MngSidebarComponent, descendants: true }], ngImport: i0, template: "<div class=\"layout-topbar\">\n    <div class=\"topbar-start\">\n        <button #menubutton type=\"button\" class=\"topbar-menubutton p-link p-trigger\" (click)=\"onMenuButtonClick()\">\n            <i class=\"pi pi-bars\"></i>\n        </button>\n\n        <div class=\"topbar-breadcrumb\">\n            <div [mngComponent]=\"breadcrumbComponent\" [attachToHost]=\"true\"></div>\n        </div>\n    </div>\n    <div class=\"layout-topbar-menu-section\">\n        <mng-sidebar-v2></mng-sidebar-v2>\n    </div>\n    <div class=\"topbar-end\">\n        <ul class=\"topbar-menu\">\n            <li *ngIf=\"languages.length > 1\" class=\"profile-item\">\n                <i class=\"pi pi-fw pi-globe\"></i>\n                <p-dropdown [ngModel]=\"selectedLanguage\" [options]=\"languages\" (onChange)=\"switchLanguage($event.value)\"></p-dropdown>\n            </li>\n            <li #userMenuItem class=\"profile-item topbar-item mr-3\" [mngComponent]=\"topbarUserComponent\" [attachToHost]=\"true\"></li>\n        </ul>\n    </div>\n</div>\n", dependencies: [{ kind: "component", type: MngSidebarComponent, selector: "mng-sidebar-v2" }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: StyleClassModule }, { kind: "ngmodule", type: RippleModule }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i3$1.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngTopbarComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'mng-topbar-v2', imports: [
+                        MngSidebarComponent,
+                        NgClass,
+                        ButtonModule,
+                        InputTextModule,
+                        StyleClassModule,
+                        RippleModule,
+                        MngBreadcrumbComponent,
+                        AsyncPipe,
+                        DropdownModule,
+                        NgIf,
+                        MngComponentDirective,
+                        FormsModule
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-topbar\">\n    <div class=\"topbar-start\">\n        <button #menubutton type=\"button\" class=\"topbar-menubutton p-link p-trigger\" (click)=\"onMenuButtonClick()\">\n            <i class=\"pi pi-bars\"></i>\n        </button>\n\n        <div class=\"topbar-breadcrumb\">\n            <div [mngComponent]=\"breadcrumbComponent\" [attachToHost]=\"true\"></div>\n        </div>\n    </div>\n    <div class=\"layout-topbar-menu-section\">\n        <mng-sidebar-v2></mng-sidebar-v2>\n    </div>\n    <div class=\"topbar-end\">\n        <ul class=\"topbar-menu\">\n            <li *ngIf=\"languages.length > 1\" class=\"profile-item\">\n                <i class=\"pi pi-fw pi-globe\"></i>\n                <p-dropdown [ngModel]=\"selectedLanguage\" [options]=\"languages\" (onChange)=\"switchLanguage($event.value)\"></p-dropdown>\n            </li>\n            <li #userMenuItem class=\"profile-item topbar-item mr-3\" [mngComponent]=\"topbarUserComponent\" [attachToHost]=\"true\"></li>\n        </ul>\n    </div>\n</div>\n" }]
+        }], propDecorators: { menuButton: [{
+                type: ViewChild,
+                args: ['menubutton']
+            }], topbarInjectionRef: [{
+                type: ViewChild,
+                args: ['userMenuItem']
+            }], appSidebar: [{
+                type: ViewChild,
+                args: [MngSidebarComponent]
+            }] } });
+
+class MngMainLayoutV2Component {
+    constructor() {
+        this.config = inject(MNG_MODULE_CONFIG_IT);
+        this.layoutService = inject(MngMainLayoutComponentV2Service);
+        this.menuService = inject(MenuService);
+        this.renderer = inject(Renderer2);
+        this.topbarComponent = MngTopbarComponent;
+        this.breadcrumbsComponent = MngBreadcrumbComponent;
+        this.footerComponent = MngFooterComponent;
+        this.layoutService.overlayOpen$.pipe(takeUntilDestroyed()).subscribe(() => {
+            if (!this.menuOutsideClickListener) {
+                this.menuOutsideClickListener = this.renderer.listen('document', 'click', event => {
+                    const isOutsideClicked = !(this.appTopbar?.nativeElement.isSameNode(event.target) || this.appTopbar?.nativeElement.contains(event.target));
+                    if (isOutsideClicked) {
+                        this.hideMenu();
+                    }
+                });
+            }
+            if (this.layoutService.state.staticMenuMobileActive$.value) {
+                this.blockBodyScroll();
+            }
+        });
+    }
+    ngOnInit() {
+        if (this.config.components?.layout?.topbar) {
+            this.topbarComponent = this.config.components.layout.topbar;
+        }
+        if (this.config.components?.layout?.breadcrumb) {
+            this.breadcrumbsComponent = this.config.components.layout.breadcrumb;
+        }
+        if (this.config.components?.layout?.footer) {
+            this.footerComponent = this.config.components.layout.footer;
+        }
+    }
+    blockBodyScroll() {
+        if (document.body.classList) {
+            document.body.classList.add('blocked-scroll');
+        }
+        else {
+            document.body.className += ' blocked-scroll';
+        }
+    }
+    unblockBodyScroll() {
+        if (document.body.classList) {
+            document.body.classList.remove('blocked-scroll');
+        }
+        else {
+            document.body.className = document.body.className.replace(new RegExp('(^|\\b)' + 'blocked-scroll'.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
+        }
+    }
+    hideMenu() {
+        this.layoutService.state.overlayMenuActive$.next(false);
+        this.layoutService.state.staticMenuMobileActive$.next(false);
+        this.layoutService.state.menuHoverActive$.next(false);
+        this.menuService.reset();
+        if (this.menuOutsideClickListener) {
+            this.menuOutsideClickListener();
+            this.menuOutsideClickListener = null;
+        }
+        this.unblockBodyScroll();
+    }
+    ngOnDestroy() {
+        if (this.menuOutsideClickListener) {
+            this.menuOutsideClickListener();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMainLayoutV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: MngMainLayoutV2Component, isStandalone: true, selector: "mng-main-layout-v2", providers: [MngMainLayoutComponentV2Service], viewQueries: [{ propertyName: "appTopbar", first: true, predicate: ["topbarCmp"], descendants: true }], ngImport: i0, template: "<div\n    class=\"layout-container\"\n    [ngClass]=\"{\n        'layout-light': config.app?.colorScheme === 'light',\n        'layout-dark': config.app?.colorScheme === 'dark',\n        'layout-overlay': config.menuV2?.mode === 'overlay',\n        'layout-static': config.menuV2?.mode === 'static',\n        'layout-reveal': config.menuV2?.mode === 'reveal',\n        'layout-drawer': config.menuV2?.mode === 'drawer',\n        'layout-static-inactive': (layoutService.state.staticMenuDesktopInactive$ | async) && config.menuV2?.mode === 'static',\n        'layout-overlay-active': layoutService.state.overlayMenuActive$ | async,\n        'layout-mobile-active': layoutService.state.staticMenuMobileActive$ | async,\n        'p-ripple-disabled': !config.menuV2?.ripple,\n        'layout-sidebar-active': layoutService.state.sidebarActive$ | async,\n        'layout-sidebar-anchored': layoutService.state.anchored$ | async\n    }\">\n    <div class=\"layout-content-wrapper\">\n        <div #topbarCmp class=\"layout-topbar-wrapper\" [mngComponent]=\"topbarComponent\" [attachToHost]=\"true\"></div>\n        <div class=\"content-breadcrumb\">\n            <div [mngComponent]=\"breadcrumbsComponent\" [attachToHost]=\"true\"></div>\n        </div>\n        <div class=\"layout-content\">\n            <router-outlet></router-outlet>\n        </div>\n        <div class=\"layout-mask\"></div>\n        <div [mngComponent]=\"footerComponent\" [attachToHost]=\"true\"></div>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs", "attachToHost"], outputs: ["instanceCreated"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: MngMainLayoutV2Component, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'mng-main-layout-v2', imports: [NgClass, RouterModule, MngTopbarComponent, MngBreadcrumbComponent, MngComponentDirective, NgIf, AsyncPipe], providers: [MngMainLayoutComponentV2Service], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    class=\"layout-container\"\n    [ngClass]=\"{\n        'layout-light': config.app?.colorScheme === 'light',\n        'layout-dark': config.app?.colorScheme === 'dark',\n        'layout-overlay': config.menuV2?.mode === 'overlay',\n        'layout-static': config.menuV2?.mode === 'static',\n        'layout-reveal': config.menuV2?.mode === 'reveal',\n        'layout-drawer': config.menuV2?.mode === 'drawer',\n        'layout-static-inactive': (layoutService.state.staticMenuDesktopInactive$ | async) && config.menuV2?.mode === 'static',\n        'layout-overlay-active': layoutService.state.overlayMenuActive$ | async,\n        'layout-mobile-active': layoutService.state.staticMenuMobileActive$ | async,\n        'p-ripple-disabled': !config.menuV2?.ripple,\n        'layout-sidebar-active': layoutService.state.sidebarActive$ | async,\n        'layout-sidebar-anchored': layoutService.state.anchored$ | async\n    }\">\n    <div class=\"layout-content-wrapper\">\n        <div #topbarCmp class=\"layout-topbar-wrapper\" [mngComponent]=\"topbarComponent\" [attachToHost]=\"true\"></div>\n        <div class=\"content-breadcrumb\">\n            <div [mngComponent]=\"breadcrumbsComponent\" [attachToHost]=\"true\"></div>\n        </div>\n        <div class=\"layout-content\">\n            <router-outlet></router-outlet>\n        </div>\n        <div class=\"layout-mask\"></div>\n        <div [mngComponent]=\"footerComponent\" [attachToHost]=\"true\"></div>\n    </div>\n</div>\n" }]
+        }], ctorParameters: function () { return []; }, propDecorators: { appTopbar: [{
+                type: ViewChild,
+                args: ['topbarCmp']
+            }] } });
+
 class RouteBuilder {
     constructor(route) {
         this.routePath = [];
@@ -16893,9 +17618,15 @@ class RouteBuilder {
     static createFromRoute(route) {
         return new RouteBuilder(route);
     }
+    /**
+     * @deprecated use createLayoutRouteV2() instead
+     */
     static createLayoutRoute(path, layoutComponent = MngMainLayoutComponent) {
         return RouteBuilder.create(path, layoutComponent);
     }
+    static createLayoutRouteV2(path, layoutComponent = MngMainLayoutV2Component) {
+        return RouteBuilder.create(path, layoutComponent);
+    }
     withRoot(routesBuilder) {
         this.root = routesBuilder;
         return this;
@@ -16967,8 +17698,13 @@ class RouteBuilder {
         this.menuItem = menuItem;
         return this;
     }
-    withMenuItem(icon, label, routerLink) {
+    withMenuItem(icon, label, routerLink, breadcrumb = false) {
         this.menuItem = this.createMenuItem(icon, label, routerLink);
+        if (breadcrumb && label) {
+            this.withBreadcrumb({
+                label: label
+            });
+        }
         return this;
     }
     /**
@@ -17191,10 +17927,17 @@ class RoutesBuilder {
     static create() {
         return new RoutesBuilder();
     }
+    /**
+     * @deprecated use createWithLayoutV2() instead
+     */
     static createWithLayout(layoutComponent = MngMainLayoutComponent) {
         const layoutRoute = RouteBuilder.createLayoutRoute('', layoutComponent);
         return new RoutesBuilder(layoutRoute);
     }
+    static createWithLayoutV2(layoutComponent = MngMainLayoutV2Component) {
+        const layoutRoute = RouteBuilder.createLayoutRouteV2('', layoutComponent);
+        return new RoutesBuilder(layoutRoute);
+    }
     addAngularRoute(route) {
         return this.addRouteBuilder(RouteBuilder.createFromRoute(route));
     }
@@ -17470,5 +18213,5 @@ function EnumName(typeName) {
  * Generated bundle index. Do not edit.
  */
 
-export { ACTION_EDITOR_DIALOG_COMPONENT_SETTING, AFieldDescriptor, AFieldGroupDescriptor, AGenericFieldDescriptor, AMngApiService, AMngBaseApiService, AMngCrudApiService, AMngErrorBase, AMngFormlyCustomFieldComponent, AMngGetAllApiService, AMngTableviewRouteComponent, APermissions, ActionActivationTriggerEnum, ActionButtonDescriptor, ActionConfirmationDialogDescriptor, ActionContext, ActionContextValidation, ActionDataProviderUtil, ActionDeleteDescriptor, ActionDescriptor, ActionEditorAddDescriptor, ActionEditorDescriptor, ActionEditorDetailsDescriptor, ActionEditorEditDescriptor, ActionEditorSubmitDescriptor, ActionEditorSubmitTypeEnum, ActionError, ActionInstance, ActionInstanceStateEnum, ActionLinkDescriptor, ActionParameters, ActionPositionEnum, ActionSimpleDescriptor, ActionTypeEnum, AuthorizationTypeEnum, AuthorizationUtil, ButtonStyleBuilder, ButtonStyleRoundedEnum, ColumnDescriptor, ColumnDisplayTypeEnum, ColumnDynamicDescriptor, ColumnTypeEnum, DataProvider, DateUtil, DefaultActionMngErrorMapperService, DynamicTableviewDataProvider, EditorDataProvider, EditorDescriptor, EditorFormlyUtil, EnumName, EnumUtil, EnumeratePipeI18nHelper, ErrorUtil, ExportUtils, FieldActionDescriptor, FieldGroupDescriptor, FieldGroupTypeEnum, FieldInputDescriptor, FieldInputTypeEnum, FieldLookupDescriptor, FieldLookupEnumDescriptor, FieldLookupTypeEnum, FieldManyEditorActionEnum, FieldManyEditorDescriptor, FieldManyEditorTypeEnum, FieldManyToManyEditorActionEnum, FieldManyToManyEditorDescriptor, FieldManyToManyEditorTypeEnum, FieldSizeEnum, FieldTabGroupDescriptor, FieldValidationDescriptor, FileUtil, FilterDescriptor, FilterLookupDescriptor, FilterLookupEnumDescriptor, FilterLookupTypeEnum, FilterMatchModeEnum, FilterTypeEnum, I18nUtils, IdProperty, JsonPathPipe, LogLevelEnum, LookupDataProvider, MNG_AUTOCOMPLETE_VALUE_ACCESSOR, MNG_BROWSER_STORAGE_IT, MNG_COMMONS_INITIALIZER_IT, MNG_DATE_RANGE_VALUE_ACCESSOR, MNG_DROPDOWN_VALUE_ACCESSOR, MNG_LOG_PUBLISHERS, MNG_MODULE_CONFIG_IT, MediusFilterMatchType, MediusFilterParam, MediusQueryMode, MediusQueryParam, MediusQueryParamBuilder, MediusQueryResult, MediusRestUtil, MngActionComponent, MngActionEditorComponent, MngActionError, MngActionErrorMapperService, MngActionExecutorService, MngActionRouteComponent, MngAuthorizationService, MngAutocompleteComponent, MngBooleanPipe, MngBreadcrumbComponent, MngClassMapPipe, MngCommonsInitEventEnum, MngCommonsModule, MngCommonsService, MngComponentDirective, MngConfigurationService, MngDataLanguageDropdownComponent, MngDateRangeComponent, MngDialogKeydownHandlerDirective, MngDropdownComponent, MngEnumPipe, MngEnumerateAsyncPipe, MngEnumeratePipe, MngErrorHandler, MngErrorPageComponent, MngFooterComponent, MngFormEditorComponent, MngFormEditorSubmitEvent, MngFormEvent, MngFormEventTypeEnum, MngFormFieldEvent, MngFormFieldEventComponentSubtype, MngFormFieldEventDialogSubtype, MngFormFieldEventTypeEnum, MngFormlyFieldActionComponent, MngFormlyFieldAutocompleteComponent, MngFormlyFieldCustomComponent, MngFormlyFieldDropdownComponent, MngFormlyFieldFieldsetComponent, MngFormlyFieldInputComponent, MngFormlyFieldLabelComponent, MngFormlyFieldLookupDialogComponent, MngFormlyFieldNoLabelWrapperComponent, MngFormlyFieldTableDialogFormComponent, MngFormlyFieldTableDialogMultiselectComponent, MngFormlyFieldTabsComponent, MngFormlyFieldWrapperComponent, MngGetterPipe, MngHttpError, MngI18nPropertyPipe, MngInternalError, MngLocalStorageService, MngLocaleDefaultRowClassPipe, MngLogPublisherConsoleService, MngLoggerService, MngMainLayoutComponent, MngMainLayoutComponentService, MngMenuComponent, MngMenuItemComponent, MngNavigationService, MngNotFoundPageComponent, MngParametrizePipe, MngRouterService, MngTableCellClickEvent, MngTableColumnFilterComponent, MngTableColumnFilterFullComponent, MngTableColumnValueComponent, MngTableComponent, MngTableLoadEvent, MngTableReloadEvent, MngTableviewComponent, MngTableviewRouteComponent, MngTemplateDirective, MngTemplatePipe, MngTopbarComponent, MngTopbarUserComponent, MngVersionComponent, MngVersionService, MngViewContainerComponentService, ModelDescriptor, ModelUtil, NotificationUtil, ObjectSerializer, ObjectUtil, Permissions, RouteBuilder, RoutesBuilder, StringUtil, StyleLevelEnum, StyleSizeEnum, StylesUtil, TableDataProvider, TableDescriptor, TableDynamicColumnsModeEnum, TableDynamicDescriptor, TableFilterDisplayEnum, TablePaginationModeEnum, TableSizeEnum, TableviewActionDefaultCategories, TableviewCrudDataProvider, TableviewDataProvider, TableviewDescriptor, TableviewDynamicDescriptor, TableviewEditorTypeEnum, TableviewRouteBuilder, TableviewRouteBuilderInternal, TitleProperty, TypeName, TypeUtil, booleanObsAttribute, enumsMapBase, formlyTypesConfig, formlyWrappersConfig, getEmailValidationMessage, getFormlyValidationMessages, getMaxDateValidationMessage, getMaxLengthValidationMessage, getMaxValidationMessage, getMinDateValidationMessage, getMinLengthValidationMessage, getMinValidationMessage, getRequiredValidationMessage, getTextPatternValidationMessage, mngAuthorizationGuard, mngFormlyConfigProvider, primeNgModules, provideMngCommons, typeMapBase };
+export { ACTION_EDITOR_DIALOG_COMPONENT_SETTING, AFieldDescriptor, AFieldGroupDescriptor, AGenericFieldDescriptor, AMngApiService, AMngBaseApiService, AMngCrudApiService, AMngErrorBase, AMngFormlyCustomFieldComponent, AMngGetAllApiService, AMngTableviewRouteComponent, APermissions, ActionActivationTriggerEnum, ActionButtonDescriptor, ActionConfirmationDialogDescriptor, ActionContext, ActionContextValidation, ActionDataProviderUtil, ActionDeleteDescriptor, ActionDescriptor, ActionEditorAddDescriptor, ActionEditorDescriptor, ActionEditorDetailsDescriptor, ActionEditorEditDescriptor, ActionEditorSubmitDescriptor, ActionEditorSubmitTypeEnum, ActionError, ActionInstance, ActionInstanceStateEnum, ActionLinkDescriptor, ActionParameters, ActionPositionEnum, ActionSimpleDescriptor, ActionTypeEnum, AuthorizationTypeEnum, AuthorizationUtil, ButtonStyleBuilder, ButtonStyleRoundedEnum, ColumnDescriptor, ColumnDisplayTypeEnum, ColumnDynamicDescriptor, ColumnTypeEnum, DataProvider, DateUtil, DefaultActionMngErrorMapperService, DynamicTableviewDataProvider, EditorDataProvider, EditorDescriptor, EditorFormlyUtil, EnumName, EnumUtil, EnumeratePipeI18nHelper, ErrorUtil, ExportUtils, FieldActionDescriptor, FieldGroupDescriptor, FieldGroupTypeEnum, FieldInputDescriptor, FieldInputTypeEnum, FieldLookupDescriptor, FieldLookupEnumDescriptor, FieldLookupTypeEnum, FieldManyEditorActionEnum, FieldManyEditorDescriptor, FieldManyEditorTypeEnum, FieldManyToManyEditorActionEnum, FieldManyToManyEditorDescriptor, FieldManyToManyEditorTypeEnum, FieldSizeEnum, FieldTabGroupDescriptor, FieldValidationDescriptor, FileUtil, FilterDescriptor, FilterLookupDescriptor, FilterLookupEnumDescriptor, FilterLookupTypeEnum, FilterMatchModeEnum, FilterTypeEnum, I18nUtils, IdProperty, JsonPathPipe, LogLevelEnum, LookupDataProvider, MNG_AUTOCOMPLETE_VALUE_ACCESSOR, MNG_BROWSER_STORAGE_IT, MNG_COMMONS_INITIALIZER_IT, MNG_DATE_RANGE_VALUE_ACCESSOR, MNG_DROPDOWN_VALUE_ACCESSOR, MNG_LOG_PUBLISHERS, MNG_MODULE_CONFIG_IT, MediusFilterMatchType, MediusFilterParam, MediusQueryMode, MediusQueryParam, MediusQueryParamBuilder, MediusQueryResult, MediusRestUtil, MngActionComponent, MngActionEditorComponent, MngActionError, MngActionErrorMapperService, MngActionExecutorService, MngActionRouteComponent, MngAuthorizationService, MngAutocompleteComponent, MngBooleanPipe, MngBreadcrumbComponent$1 as MngBreadcrumbComponent, MngClassMapPipe, MngCommonsInitEventEnum, MngCommonsModule, MngCommonsService, MngComponentDirective, MngConfigurationService, MngDataLanguageDropdownComponent, MngDateRangeComponent, MngDialogKeydownHandlerDirective, MngDropdownComponent, MngEnumPipe, MngEnumerateAsyncPipe, MngEnumeratePipe, MngErrorHandler, MngErrorPageComponent, MngFooterComponent$1 as MngFooterComponent, MngFormEditorComponent, MngFormEditorSubmitEvent, MngFormEvent, MngFormEventTypeEnum, MngFormFieldEvent, MngFormFieldEventComponentSubtype, MngFormFieldEventDialogSubtype, MngFormFieldEventTypeEnum, MngFormlyFieldActionComponent, MngFormlyFieldAutocompleteComponent, MngFormlyFieldCustomComponent, MngFormlyFieldDropdownComponent, MngFormlyFieldFieldsetComponent, MngFormlyFieldInputComponent, MngFormlyFieldLabelComponent, MngFormlyFieldLookupDialogComponent, MngFormlyFieldNoLabelWrapperComponent, MngFormlyFieldTableDialogFormComponent, MngFormlyFieldTableDialogMultiselectComponent, MngFormlyFieldTabsComponent, MngFormlyFieldWrapperComponent, MngGetterPipe, MngHttpError, MngI18nPropertyPipe, MngInternalError, MngLocalStorageService, MngLocaleDefaultRowClassPipe, MngLogPublisherConsoleService, MngLoggerService, MngMainLayoutComponent, MngMainLayoutComponentService, MngMenuComponent$1 as MngMenuComponent, MngMenuItemComponent$1 as MngMenuItemComponent, MngNavigationService, MngNotFoundPageComponent, MngParametrizePipe, MngRouterService, MngTableCellClickEvent, MngTableColumnFilterComponent, MngTableColumnFilterFullComponent, MngTableColumnValueComponent, MngTableComponent, MngTableLoadEvent, MngTableReloadEvent, MngTableviewComponent, MngTableviewRouteComponent, MngTemplateDirective, MngTemplatePipe, MngTopbarComponent$1 as MngTopbarComponent, MngTopbarUserComponent$1 as MngTopbarUserComponent, MngVersionComponent$1 as MngVersionComponent, MngVersionService, MngViewContainerComponentService, ModelDescriptor, ModelUtil, NotificationUtil, ObjectSerializer, ObjectUtil, Permissions, RouteBuilder, RoutesBuilder, StringUtil, StyleLevelEnum, StyleSizeEnum, StylesUtil, TableDataProvider, TableDescriptor, TableDynamicColumnsModeEnum, TableDynamicDescriptor, TableFilterDisplayEnum, TablePaginationModeEnum, TableSizeEnum, TableviewActionDefaultCategories, TableviewCrudDataProvider, TableviewDataProvider, TableviewDescriptor, TableviewDynamicDescriptor, TableviewEditorTypeEnum, TableviewRouteBuilder, TableviewRouteBuilderInternal, TitleProperty, TypeName, TypeUtil, booleanObsAttribute, enumsMapBase, formlyTypesConfig, formlyWrappersConfig, getEmailValidationMessage, getFormlyValidationMessages, getMaxDateValidationMessage, getMaxLengthValidationMessage, getMaxValidationMessage, getMinDateValidationMessage, getMinLengthValidationMessage, getMinValidationMessage, getRequiredValidationMessage, getTextPatternValidationMessage, mngAuthorizationGuard, mngFormlyConfigProvider, primeNgModules, provideMngCommons, typeMapBase };
 //# sourceMappingURL=mediusinc-mng-commons.mjs.map