@mediusinc/mng-commons 3.0.0-rc.7 → 3.0.0-rc.9

package/fesm2022/mediusinc-mng-commons.mjs

@@ -324,33 +324,47 @@ const typeMapBase = {
     QueryParam: MediusQueryParam
 };
 
-class MngInternalError extends Error {
-    constructor(message, name = 'Commons Internal Error', options) {
+class AMngErrorBase extends Error {
+    constructor(message, options) {
         super(message);
-        this.type = 'MngInternalError';
-        this.name = name;
-        this.id = options?.id;
+        this.name = options?.name ?? 'MngError';
         this.messageCode = options?.messageCode;
-        this.notification = options?.notification ?? this.generateNotification();
-        this.details = options?.details;
-        this.status = options?.status;
-        this.statusDescription = options?.statusDescription;
-        this.url = options?.url;
+        this.location = options?.location ?? window?.location?.href;
         this.cause = options?.cause;
         this.stack = options?.stack ?? (options?.cause ? options.cause.stack : new Error(message).stack);
+        this.details = options?.details;
     }
-    get messageLog() {
-        let message = this.message;
-        if (this.cause && this.cause instanceof Error) {
-            message += `\nCaused by ${this.cause.name}: ${this.cause.message}`;
-        }
-        if (this.stack) {
-            message += `\nStack trace:\n${this.stack}`;
-        }
-        return message;
+}
+class MngInternalError extends AMngErrorBase {
+    constructor(message, options) {
+        super(message, {
+            name: 'MngInternalError',
+            ...options
+        });
+        this.type = 'MngInternalError';
     }
-    generateNotification() {
-        return { severity: 'error', summary: this.name, detail: this.message, life: 10000 };
+}
+class MngHttpError extends AMngErrorBase {
+    constructor(message, httpError, options) {
+        super(message, {
+            name: 'MngHttpError_' + httpError.url,
+            cause: httpError,
+            ...options
+        });
+        this.type = 'MngHttpError';
+        this.httpError = httpError;
+    }
+}
+class MngActionError extends AMngErrorBase {
+    constructor(message, actionName, options) {
+        super(message, {
+            name: 'MngActionError_' + actionName,
+            ...options
+        });
+        this.type = 'MngActionError';
+        this.actionId = actionName;
+        this.actionContext = options?.actionContext;
+        this.httpError = options?.httpError;
     }
 }
 
@@ -373,11 +387,11 @@ class ActionDataProviderUtil {
         const serviceExec = ActionDataProviderUtil.runGetAllService(ctx);
         return isObservable(serviceExec)
             ? serviceExec
-            : throwError(() => new MngInternalError(`Data provider and service instance could not extract fetch function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item id ${ctx.parameters?.itemId}.`, 'ActionDataProviderUtils error'));
+            : throwError(() => new MngActionError(`Data provider and service instance could not extract fetch function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item id ${ctx.parameters?.itemId}.`, ctx.contextLongName, { actionContext: ctx }));
     }
     static runFetchOrFail(ctx) {
         return (ActionDataProviderUtil.runFetch(ctx) ??
-            throwError(() => new MngInternalError(`Data provider and service instance could not extract fetch function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item id ${ctx.parameters?.itemId}.`, 'ActionDataProviderUtils error')));
+            throwError(() => new MngActionError(`Data provider and service instance could not extract fetch function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item id ${ctx.parameters?.itemId}.`, ctx.contextLongName, { actionContext: ctx })));
     }
     static runFetch(ctx, fallback) {
         const dataProviderExec = ActionDataProviderUtil.runFetchDataProvider(ctx);
@@ -389,7 +403,7 @@ class ActionDataProviderUtil {
     }
     static runCreateOrFail(ctx) {
         return (ActionDataProviderUtil.runCreate(ctx) ??
-            throwError(() => new MngInternalError(`Data provider and service instance could not extract create function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item ${ctx.parameters?.item}.`, 'ActionDataProviderUtils error')));
+            throwError(() => new MngActionError(`Data provider and service instance could not extract create function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item ${ctx.parameters?.item}.`, ctx.contextLongName, { actionContext: ctx })));
     }
     static runCreate(ctx, fallback) {
         const dataProviderExec = ActionDataProviderUtil.runCreateDataProvider(ctx);
@@ -401,7 +415,7 @@ class ActionDataProviderUtil {
     }
     static runUpdateOrFail(ctx) {
         return (ActionDataProviderUtil.runUpdate(ctx) ??
-            throwError(() => new MngInternalError(`Data provider and service instance could not extract update function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item id ${ctx.parameters?.itemId}.`, 'ActionDataProviderUtils error')));
+            throwError(() => new MngActionError(`Data provider and service instance could not extract update function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item id ${ctx.parameters?.itemId}.`, ctx.contextLongName, { actionContext: ctx })));
     }
     static runUpdate(ctx, fallback) {
         const dataProviderExec = ActionDataProviderUtil.runUpdateDataProvider(ctx);
@@ -419,7 +433,7 @@ class ActionDataProviderUtil {
         const serviceExec = ActionDataProviderUtil.runDeleteService(ctx);
         return isObservable(serviceExec)
             ? serviceExec
-            : throwError(() => new MngInternalError(`Data provider and service instance could not extract delete function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item id ${ctx.parameters?.itemId}.`, 'ActionDataProviderUtils error'));
+            : throwError(() => new MngActionError(`Data provider and service instance could not extract delete function to execute in action ${ctx.instance.action.actionNameLong} (${ctx.instance.action.model?.typeName}) for item id ${ctx.parameters?.itemId}.`, ctx.contextLongName, { actionContext: ctx }));
     }
     static runGetAllService(ctx) {
         if (typeof ctx.serviceInstance !== 'undefined') {
@@ -1575,17 +1589,18 @@ class DefaultActionMngErrorMapperService extends MngActionErrorMapperService {
             mngError = {
                 type: 'MngActionError',
                 name: error?.name ?? 'UnknownError',
-                message: error.message ?? 'Unknown error'
+                message: error.message ?? 'Unknown error',
+                cause: error
             };
         }
         return mngError;
     }
 }
 
-/* eslint-disable no-console */
 class MngLoggerService {
     static { this._instance = new MngLoggerService(); }
     static { this._isInit = false; }
+    static { this._publishers = []; }
     static { this._entriesBuffer = []; }
     static { this._categoryInstances = {}; }
     static { this._timestampFormat = 'yyyy-MM-dd HH:mm:ss.SSS'; }
@@ -1603,15 +1618,19 @@ class MngLoggerService {
             MngLoggerService._timestampFormat = config.timestampFormat;
         }
     }
-    static init(configurationService) {
+    static init(configurationService, publishers) {
         if (MngLoggerService._isInit) {
             return;
         }
         MngLoggerService._configurationService = configurationService;
+        MngLoggerService._publishers = publishers;
         MngLoggerService._isInit = true;
         MngLoggerService._flushBuffer();
     }
     static _flushBuffer() {
+        if (!MngLoggerService._isInit) {
+            return;
+        }
         MngLoggerService._entriesBuffer.forEach(e => this._instance._log(e));
         MngLoggerService._entriesBuffer = [];
     }
@@ -1630,26 +1649,38 @@ class MngLoggerService {
         MngLoggerService._categoryInstances[category] = logger;
         return logger;
     }
-    _processLog(msg, logLevel, category = this.category, data) {
-        const timestamp = new Date();
-        const timestampFormatted = this.datePipe.transform(timestamp, MngLoggerService._timestampFormat);
-        const log = {
+    _processLog(msgOrError, logLevel, category = undefined, data) {
+        const [timestamp, timestampFormatted] = [...this._getTimestamps()];
+        const logEntry = {
             level: logLevel,
-            message: msg,
+            message: typeof msgOrError === 'string' ? msgOrError : msgOrError.message,
             data: data,
-            category: category,
+            category: this.category ?? category,
             timestamp: timestamp,
             timestampFormatted: timestampFormatted ?? undefined
         };
-        if (!MngLoggerService._isInit) {
-            // add to buffer
-            MngLoggerService._entriesBuffer.push(log);
+        if (msgOrError instanceof Error) {
+            // set error from message param
+            logEntry.error = msgOrError;
         }
-        else {
-            this._log(log);
+        else if (data?.length && data[0] instanceof Error) {
+            // if first data is error, also consider as error
+            logEntry.error = data[0];
+            data = data.splice(1);
         }
+        this._log(logEntry);
+    }
+    _getTimestamps() {
+        const timestamp = new Date();
+        const timestampFormatted = this.datePipe.transform(timestamp, MngLoggerService._timestampFormat) ?? DateUtil.toIsoString(timestamp, false, true, true);
+        return [timestamp, timestampFormatted];
     }
     _log(log) {
+        if (!MngLoggerService._isInit) {
+            // add to buffer
+            MngLoggerService._entriesBuffer.push(log);
+            return;
+        }
         const logConfig = (MngLoggerService._configurationService?.getConfigValue)?.('log');
         if ((this.category && log.level < (logConfig?.category?.[this.category]?.level ?? logConfig?.level ?? this.defaultLogLevel)) ||
             (!this.category && log.level < (logConfig?.level ?? this.defaultLogLevel))) {
@@ -1658,48 +1689,38 @@ class MngLoggerService {
         if (logConfig?.timestampFormat) {
             log.timestampFormatted = this.datePipe.transform(log.timestamp, logConfig.timestampFormat) ?? undefined;
         }
-        let prefix = `${log.timestampFormatted}`;
-        if (log.category)
-            prefix += ` [${log.category}]`;
-        prefix += ':';
-        switch (log.level) {
-            case LogLevelEnum.Trace:
-                console.trace(prefix, log.message, ...log.data);
-                break;
-            case LogLevelEnum.Debug:
-                console.debug(prefix, log.message, ...log.data);
-                break;
-            case LogLevelEnum.Log:
-                console.log(prefix, log.message, ...log.data);
-                break;
-            case LogLevelEnum.Info:
-                console.info(prefix, log.message, ...log.data);
-                break;
-            case LogLevelEnum.Warning:
-                console.warn(prefix, log.message, ...log.data);
-                break;
-            case LogLevelEnum.Error:
-                console.error(prefix, log.message, ...log.data);
-                break;
-        }
+        MngLoggerService._publishers.forEach(p => p.addEntry(log));
+    }
+    trace(msgOrError, ...data) {
+        this._processLog(msgOrError, LogLevelEnum.Trace, undefined, data);
     }
-    trace(msg, ...data) {
-        this._processLog(msg, LogLevelEnum.Trace, undefined, data);
+    debug(msgOrError, ...data) {
+        this._processLog(msgOrError, LogLevelEnum.Debug, undefined, data);
     }
-    debug(msg, ...data) {
-        this._processLog(msg, LogLevelEnum.Debug, undefined, data);
+    log(msgOrError, logLevel = LogLevelEnum.Log, category = undefined, ...data) {
+        this._processLog(msgOrError, logLevel, category, data);
     }
-    log(msg, logLevel = LogLevelEnum.Log, category = undefined, ...data) {
-        this._processLog(msg, logLevel, category, data);
+    logEntry(logEntry) {
+        const [timestamp, timestampFormatted] = [...this._getTimestamps()];
+        const logEntryFinal = {
+            timestamp: timestamp,
+            timestampFormatted: timestampFormatted ?? undefined,
+            category: this.category ?? logEntry.category,
+            message: '',
+            messageDetails: logEntry.messageDetails,
+            level: LogLevelEnum.Log,
+            ...logEntry
+        };
+        this._log(logEntryFinal);
     }
-    info(msg, ...data) {
-        this._processLog(msg, LogLevelEnum.Info, undefined, data);
+    info(msgOrError, ...data) {
+        this._processLog(msgOrError, LogLevelEnum.Info, undefined, data);
     }
-    warn(msg, ...data) {
-        this._processLog(msg, LogLevelEnum.Warning, undefined, data);
+    warn(msgOrError, ...data) {
+        this._processLog(msgOrError, LogLevelEnum.Warning, undefined, data);
     }
-    error(msg, ...data) {
-        this._processLog(msg, LogLevelEnum.Error, undefined, data);
+    error(msgOrError, ...data) {
+        this._processLog(msgOrError, LogLevelEnum.Error, undefined, data);
     }
 }
 
@@ -1712,6 +1733,8 @@ const MNG_COMMONS_INITIALIZER_IT = new InjectionToken('MNG Commons Initializer')
 
 const ACTION_EDITOR_DIALOG_COMPONENT_SETTING = new InjectionToken('ACTION_EDITOR_DIALOG_COMPONENT_SETTING');
 
+const MNG_LOG_PUBLISHERS = new InjectionToken('MNG_LOG_PUBLISHERS');
+
 const MNG_MODULE_CONFIG_IT = new InjectionToken('MngModuleConfig');
 
 class MngCommonsService {
@@ -2442,7 +2465,7 @@ class MngActionExecutorService {
             return runResult;
         }), catchError(err => {
             // transform error to mng action error
-            const actionError = this.toMngActionError(err);
+            const actionError = this.toMngActionError(err, ctx);
             // set instance state to error
             ctx.instance.state = isMainRunFn ? ActionInstanceStateEnum.RunError : ActionInstanceStateEnum.FetchError;
             // mark execution error on context
@@ -2451,10 +2474,6 @@ class MngActionExecutorService {
             if (isMainRunFn) {
                 ctx.instance.error = err;
                 ctx.instance.isRunLoadingSubject.next(false);
-                // handle error notification
-                if (ctx.instance.action.hasRunNotificationError) {
-                    actionError.notification = NotificationUtil.actionNotificationError(this.translate, ctx.instance.action, actionError, ctx.functionName, ctx.parameters.viewContainer ?? undefined, ctx.parameters.item);
-                }
                 // handle possible error action if run
                 if (isMainRunFn && ctx.instance.action.onRunErrorAction) {
                     // cannot start with trigger, because routing might be problematic (lousing previous results etc.)
@@ -2472,13 +2491,13 @@ class MngActionExecutorService {
                     NotificationUtil.actionNotificationError(this.translate, ctx.instance.action, actionError, 'fetch', ctx.parameters.viewContainer, ctx.parameters.item);
                 }
             }
-            // liste and map only to mark instance state as finished error state
+            // list and map only to mark instance state as finished error state
             return errorObs.pipe(map(() => {
                 // deactivate action only if critical (fetch on editor or run on button actions)
                 if (isErrorCriticalRunFn) {
                     this.finishAction(ctx.instance);
                 }
-                // rethrow error to propagate furher
+                // rethrow error to propagate further
                 throw actionError;
             }));
         }));
@@ -2487,9 +2506,11 @@ class MngActionExecutorService {
                 this.logger.debug(`ActionContext ${ctx.contextLongName} execution next event`, res);
             },
             error: err => {
-                this.logger.debug(`ActionContext ${ctx.contextLongName} execution error event`, err);
                 if (err?.type !== 'MngActionError') {
-                    this.logger.error(`Non MngActionError occurred`, err);
+                    this.logger.error(`Non action error occurred`, err);
+                }
+                else {
+                    this.logger.debug(`Action context ${ctx.contextLongName} execution error event`, err);
                 }
             }
         });
@@ -2852,22 +2873,39 @@ class MngActionExecutorService {
     /**
      * Transform error of any type to mng error by using error mapper that could be provided by final project.
      * @param error error of any type.
+     * @param context Action context.
      *
      * @return mapped MngError.
      */
-    toMngActionError(error) {
-        const actionError = {
-            type: 'MngActionError',
-            name: error?.name ?? 'UnknownError',
-            message: error?.message ?? 'Unknown error',
-            cause: error
-        };
-        if (error instanceof HttpErrorResponse) {
-            actionError.status = error.status;
-            actionError.statusDescription = error.statusText;
-            actionError.url = error.url ?? undefined;
+    toMngActionError(error, context) {
+        let mngError;
+        if (context) {
+            const options = {
+                cause: error,
+                location: this.router.url
+            };
+            if (error instanceof HttpErrorResponse) {
+                options.httpError = error;
+            }
+            mngError = new MngActionError(error?.message ?? 'Unknown error', context.contextLongName);
         }
-        return this.errorMapper.toMngError(error, actionError);
+        else if (error instanceof HttpErrorResponse) {
+            // should not really happen (should always be wrapped in MngActionError), just in case
+            mngError = new MngHttpError(`Http Error occurred in action`, error, {
+                location: this.router.url
+            });
+        }
+        else {
+            // not from action, so unknown source of error
+            mngError = new MngInternalError(error?.message ?? 'Unknown error', {
+                name: error?.name ?? 'UnknownError',
+                location: this.router.url,
+                cause: error
+            });
+        }
+        // just trace it, allow user to set if this is error or not
+        this.logger.trace(mngError);
+        return this.errorMapper.toMngError(error, mngError);
     }
     /**
      * Creates or gets existing action instance.
@@ -2884,7 +2922,7 @@ class MngActionExecutorService {
         }
         if (!instance) {
             if (!action) {
-                throw new MngInternalError('Action descriptor is not provided, instance cannot be created.', 'ActionExecutorService error');
+                throw new MngInternalError('Action descriptor is not provided, instance cannot be created.', { name: 'ActionExecutorServiceError' });
             }
             // create new instance if non provided
             instance = new ActionInstance(action, instanceInitialStatus);
@@ -3020,18 +3058,13 @@ class MngConfigurationService {
                     return httpClient.get(noEnvUrl);
                 }
                 else {
-                    const message = `Configuration file ${url} not loaded (${err.status}): ${err.message}.`;
-                    this.logger?.warn(message, err);
-                    return throwError(() => {
-                        return new MngInternalError(message, 'ConfigurationService', {
-                            cause: err,
-                            status: err.status,
-                            statusDescription: err.statusText,
-                            url: err.url ?? undefined
-                        });
-                    });
+                    this.logger?.warn(`Configuration file ${url} not loaded`, err);
+                    return of(false);
                 }
             }), map(configuration => {
+                if (typeof configuration !== 'object') {
+                    return false;
+                }
                 sourceInfo.configuration = configuration;
                 sourceInfo.isLoaded = true;
                 return true;
@@ -3095,6 +3128,7 @@ class MngRouterService {
         this.router = router;
         this.logger = inject(MngLoggerService).create('MngRouterService');
         this.routesLoadedPropKey = '_loadedRoutes';
+        this.currentNavigationModuleKeys = [];
         this.lazyLoadedRoutesConfig = {};
     }
     getRouteLoadedChildren(path) {
@@ -3121,59 +3155,53 @@ class MngRouterService {
     }
     startNavigation(url) {
         this.currentNavigationPath = url.split('?')[0].split('#')[0];
-        this.currentNavigationConfigModule = undefined;
-        this.currentNavigationConfigLoaded = undefined;
+        this.currentNavigationModuleKeys = [];
     }
     finishNavigation() {
-        if (this.currentNavigationConfigLoaded && this.currentNavigationConfigModule) {
-            this.getLoadedRoutesFromRoute(true);
+        if (this.currentNavigationModuleKeys.length) {
+            this.currentNavigationModuleKeys.forEach(k => this.getLoadedRoutesFromRoute(k, true));
         }
         this.currentNavigationPath = undefined;
     }
     markNavigationConfigLoad(route, isEnd = false) {
-        this.currentNavigationConfigLoaded = isEnd;
         let routePath = route.path ?? '';
         if (!routePath.startsWith('/'))
             routePath = `/${routePath}`;
-        if (!this.currentNavigationConfigModule) {
-            let moduleKey = routePath;
-            const currentNavigationPathRoutePathIdx = this.currentNavigationPath?.indexOf(routePath) ?? -1;
-            if (this.currentNavigationPath && currentNavigationPathRoutePathIdx >= 0) {
-                moduleKey = this.currentNavigationPath.substring(0, currentNavigationPathRoutePathIdx + routePath.length);
-            }
-            this.currentNavigationConfigModule = moduleKey;
+        const currentNavigationPathRoutePathIdx = this.currentNavigationPath?.indexOf(routePath) ?? -1;
+        const moduleKey = this.currentNavigationPath?.substring(0, currentNavigationPathRoutePathIdx + routePath.length) ?? routePath;
+        if (!isEnd && this.currentNavigationModuleKeys.indexOf(moduleKey) < 0) {
+            this.currentNavigationModuleKeys.push(moduleKey);
         }
-        this.logger.trace(`Config load ${isEnd ? 'end' : 'start'} for ${this.currentNavigationConfigModule}`);
-        const config = this.getOrCreateRouteForModule(this.currentNavigationConfigModule);
+        this.logger.trace(`Config load ${isEnd ? 'end' : 'start'} for ${moduleKey} (routePath: ${routePath}; navigationUrl: ${this.currentNavigationPath})`);
+        const config = this.getOrCreateRouteForModule(moduleKey);
         config.route = route;
         config.isLoadEnd = isEnd;
-        this.getLoadedRoutesFromRoute();
+        if (isEnd) {
+            this.getLoadedRoutesFromRoute(moduleKey);
+        }
     }
-    getLoadedRoutesFromRoute(isFinish = false) {
-        if (!this.currentNavigationConfigModule ||
-            !this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule]?.route ||
-            Array.isArray(this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].loadedRoutes)) {
+    getLoadedRoutesFromRoute(moduleKey, isFinish = false) {
+        const moduleConfig = this.lazyLoadedRoutesConfig[moduleKey];
+        if (!moduleConfig?.route || Array.isArray(moduleConfig.loadedRoutes)) {
             return;
         }
-        this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].loadedRoutes =
-            this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].route[this.routesLoadedPropKey];
-        if (!Array.isArray(this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].loadedRoutes) && isFinish) {
+        moduleConfig.loadedRoutes = moduleConfig.route[this.routesLoadedPropKey];
+        if (!Array.isArray(moduleConfig.loadedRoutes) && isFinish) {
             // if is called from finish and no lazy loaded routes are matched from router events, try finding in route config, it should be there!
-            this.logger.trace(`Route loadedRoutes for ${this.currentNavigationConfigModule} not found, searching in router config now`);
-            const route = this.findRouteInRouteConfig(this.currentNavigationConfigModule);
+            this.logger.trace(`Route loadedRoutes for ${moduleKey} not found, searching in router config now`);
+            const route = this.findRouteInRouteConfig(moduleKey);
             if (route) {
-                this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].route = route;
-                this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].loadedRoutes =
-                    this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].route[this.routesLoadedPropKey];
+                moduleConfig.route = route;
+                moduleConfig.loadedRoutes = moduleConfig.route[this.routesLoadedPropKey];
             }
             else {
-                this.logger.warn(`Route loadedRoutes for ${this.currentNavigationConfigModule} were not found in router config`);
+                this.logger.warn(`Route loadedRoutes for ${moduleKey} were not found in router config`);
             }
         }
-        if (typeof this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].loadedRoutes !== 'undefined') {
-            this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].loadedRoutesSubject.next(this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].loadedRoutes);
-            this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule].loadedRoutesSubject.complete();
-            this.logger.trace(`Config load for ${this.currentNavigationConfigModule} is complete`, this.lazyLoadedRoutesConfig[this.currentNavigationConfigModule]);
+        if (typeof moduleConfig.loadedRoutes !== 'undefined') {
+            moduleConfig.loadedRoutesSubject.next(moduleConfig.loadedRoutes);
+            moduleConfig.loadedRoutesSubject.complete();
+            this.logger.trace(`Config load for ${moduleKey} is complete`, moduleConfig);
         }
     }
     /**
@@ -3270,6 +3298,7 @@ class MngVersionService {
     constructor(http, configurationService) {
         this.http = http;
         this.configurationService = configurationService;
+        this.logger = inject(MngLoggerService).create('MngVersionService');
         this.cache = {};
     }
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -3288,6 +3317,9 @@ class MngVersionService {
             this.http.get(urlSegments.join('')).subscribe({
                 next: res => {
                     this.cache[url].next(res);
+                },
+                error: err => {
+                    this.logger.error('Version could not be retreived', err);
                 }
             });
         }
@@ -3391,6 +3423,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
             args: [{ providedIn: 'root' }]
         }] });
 
+/* eslint-disable no-console */
+class MngLogPublisherConsoleService {
+    addEntry(entry) {
+        let prefix = `${entry.timestampFormatted}`;
+        if (entry.category)
+            prefix += ` [${entry.category}]`;
+        prefix += ':';
+        const message = `${entry.message}${entry.messageDetails ? `\n${entry.messageDetails}` : ''}`;
+        const logParams = [prefix, message];
+        if (entry.error) {
+            logParams.push(`\n${ErrorUtil.getErrorName(entry.error)}:`, entry.error);
+        }
+        if (entry.data?.length) {
+            logParams.push(`\nData:\n`, ...entry.data);
+        }
+        switch (entry.level) {
+            case LogLevelEnum.Trace:
+                console.trace(...logParams);
+                break;
+            case LogLevelEnum.Debug:
+                console.debug(...logParams);
+                break;
+            case LogLevelEnum.Log:
+                console.log(...logParams);
+                break;
+            case LogLevelEnum.Info:
+                console.info(...logParams);
+                break;
+            case LogLevelEnum.Warning:
+                console.warn(...logParams);
+                break;
+            case LogLevelEnum.Error:
+                console.error(...logParams);
+                break;
+        }
+    }
+}
+
 class ObjectSerializer {
     constructor() {
         this._logCategory = 'ObjectSerializer';
@@ -3968,7 +4038,7 @@ class TableviewUtil {
      */
     static expandAttributeDefWithTableviewTypes(attributes) {
         if (attributes == null) {
-            throw new MngInternalError('AttributeDef is null, problem with ObjectSerializer::findAttributesDefinitionByClassType?', 'TableViewUtils error');
+            throw new MngInternalError('AttributeDef is null, problem with ObjectSerializer::findAttributesDefinitionByClassType?', { name: 'TableViewUtilsError' });
         }
         const objectSerializer = ObjectSerializer.get();
         const tableviewAttributeDef = [];
@@ -4815,14 +4885,14 @@ class FilterLookupDescriptor extends FilterDescriptor {
         this._defaultValueTo = filterValueTo;
         this._defaultFilterMatchMode = filterMatchMode;
         if (Array.isArray(filterValue) && !this.multiselect) {
-            throw new MngInternalError('Array default filter can only be used with a multiselect filter.', 'FilterDescriptor error');
+            throw new MngInternalError('Array default filter can only be used with a multiselect filter.', { name: 'FilterDescriptorError' });
         }
         if (filterMatchMode && this._matchModes && this._matchModes.indexOf(filterMatchMode) < 0) {
             this._defaultFilterMatchMode = undefined;
             MngLoggerService.get().debug(`WARNING: Default filter match mode '${filterMatchMode}' could not be assigned for property ${this._property}.`);
         }
         if ((Array.isArray(filterValue) && !this.multiselect) || (this.multiselect && !Array.isArray(filterValue))) {
-            throw new MngInternalError(`Default value not in correct format for property ${this._property}.`, 'FilterDescriptor error');
+            throw new MngInternalError(`Default value not in correct format for property ${this._property}.`, { name: 'FilterDescriptorError' });
         }
         return this;
     }
@@ -4878,7 +4948,7 @@ class FilterLookupEnumDescriptor extends FilterLookupDescriptor {
         return super.withMultiselect(multiselect);
     }
     withDefaultFilter() {
-        throw new MngInternalError(`withDefaultFilter on FilterLookupEnumDescriptor should not be used. Use withDefaultFilterEnum instead.`, 'FilterDescriptor error');
+        throw new MngInternalError(`withDefaultFilter on FilterLookupEnumDescriptor should not be used. Use withDefaultFilterEnum instead.`, { name: 'FilterDescriptorError' });
     }
     withDefaultFilterEnum(filterValue, filterValueTo, filterMatchMode) {
         let defaultOptionValue;
@@ -5219,7 +5289,7 @@ class ColumnDescriptor {
     }
     withFilterLookupEnum(options) {
         if (this._columnType !== ColumnTypeEnum.Enum || !this._enumType) {
-            throw new MngInternalError(`Column ${this._property} is not of type enum or enum type is undefined.`, 'ColumnDescriptor error');
+            throw new MngInternalError(`Column ${this._property} is not of type enum or enum type is undefined.`, { name: 'ColumnDescriptorError' });
         }
         const filterDescriptor = new FilterLookupEnumDescriptor(this._property, this._enumType, options, this._enumNameAsValue, this._enumTitlePath);
         this._filterDescriptor = filterDescriptor;
@@ -5492,6 +5562,9 @@ class TableDescriptor {
     get rowClassNameMapFn() {
         return this._rowClassNameMapFn;
     }
+    get selectionColumnFrozen() {
+        return this._selectionColumnFrozen;
+    }
     get actionColumnFrozen() {
         return this._actionColumnFrozen;
     }
@@ -5648,16 +5721,22 @@ class TableDescriptor {
     }
     /**
      * Method that enables/disabled column resize feature with columnResizeMode on all columns.
-     * @param resizableColumns: boolean
-     * @param columnResizeMode: 'fit' | 'expand' = 'fit'
+     * @param resizableColumns True if enabled
+     * @param columnResizeMode 'fit' or 'expand' mode
      */
     withColumnsResizable(resizableColumns = true, columnResizeMode = 'fit') {
         this._hasResizableColumns = resizableColumns;
         this._columnResizeMode = columnResizeMode;
         return this;
     }
-    withActionColumnFrozen(frozen) {
-        this._actionColumnFrozen = frozen;
+    /**
+     * Sets column to (un)frozen.
+     * @param selectionColumnFrozen True to freeze selection column, false to unfreeze it.
+     * @param actionColumnFrozen True to freeze action column, false to unfreeze it.
+     */
+    withColumnFrozen(selectionColumnFrozen, actionColumnFrozen) {
+        this._selectionColumnFrozen = selectionColumnFrozen;
+        this._actionColumnFrozen = actionColumnFrozen;
         return this;
     }
     withRowClassName(rowClassName, classNameMapFn) {
@@ -5695,6 +5774,7 @@ class TableDescriptor {
         obj._hasResizableColumns = this._hasResizableColumns;
         obj._columnResizeMode = this._columnResizeMode;
         obj._actionColumnFrozen = this._actionColumnFrozen;
+        obj._selectionColumnFrozen = this._selectionColumnFrozen;
         obj._isLocalized = this._isLocalized;
         obj._localizationLocaleProperty = this._localizationLocaleProperty;
         obj._paginationMode = this._paginationMode;
@@ -6154,7 +6234,7 @@ class TableviewDescriptor {
      */
     withModifiedType(property, columnType, fieldType, columnDisplayType) {
         if (columnType === ColumnTypeEnum.Enum) {
-            throw new MngInternalError('Do not use with types where args are required', 'TableViewDescriptor error');
+            throw new MngInternalError('Do not use with types where args are required', { name: 'TableViewDescriptorError' });
         }
         const attributeDef = TableviewUtil.getAttributeDefMap(this._modelType).find(atribute => atribute.name === property);
         if (attributeDef != null) {
@@ -7478,7 +7558,7 @@ class EditorDescriptor {
     removeField(property) {
         const fieldIdx = this._fields.findIndex(f => f.property === property);
         if (fieldIdx < 0) {
-            throw new MngInternalError(`Field ${property} does not exist.`, 'EditorDescriptor error');
+            throw new MngInternalError(`Field ${property} does not exist.`, { name: 'EditorDescriptorError' });
         }
         for (const group of this._groups) {
             const groupFieldIdx = group.fields.findIndex(f => f instanceof AFieldDescriptor && f.property === property);
@@ -8051,6 +8131,393 @@ class EnumUtil {
     }
 }
 
+class ObjectUtil {
+    static deepCopy(obj, options) {
+        if (typeof obj !== 'object' || obj === null || Array.isArray(obj)) {
+            return obj;
+        }
+        if (obj instanceof Date) {
+            return new Date(+obj);
+        }
+        let copy;
+        if (options?.mapGettersToProperties) {
+            copy = {};
+        }
+        else {
+            copy = options?.objectPrototype ? Object.create(options.objectPrototype['prototype']) : Object.create(Object.getPrototypeOf(obj));
+            Object.assign(copy, obj);
+        }
+        for (const key of ObjectUtil.getProperties(obj)) {
+            const prop = obj[key];
+            copy[key] = ObjectUtil.handleProp(prop, { mapGettersToProperties: options?.mapGettersToProperties });
+        }
+        if (options?.mapGettersToProperties) {
+            for (const getterKey of ObjectUtil.getGetters(obj)) {
+                const prop = obj[getterKey];
+                copy[getterKey] = ObjectUtil.handleProp(prop, { mapGettersToProperties: options?.mapGettersToProperties });
+            }
+        }
+        return copy;
+    }
+    static deepMerge(target, source) {
+        if (!ObjectUtil.isObject(source)) {
+            return target;
+        }
+        for (const key of ObjectUtil.getProperties(source)) {
+            if (ObjectUtil.isObject(source[key])) {
+                if (ObjectUtil.isObject(target[key])) {
+                    target[key] = ObjectUtil.deepMerge(target[key], source[key]);
+                }
+                else {
+                    target[key] = ObjectUtil.deepCopy(source[key]);
+                }
+            }
+            else if (Array.isArray(source[key])) {
+                if (!Array.isArray(target[key])) {
+                    target[key] = source[key].map(i => (ObjectUtil.isObject(i) ? ObjectUtil.deepMerge({}, i) : i));
+                }
+            }
+            else if (typeof target[key] === 'undefined') {
+                target[key] = source[key];
+            }
+        }
+        return target;
+    }
+    static isObject(obj) {
+        return typeof obj === 'object' && obj !== null && !Array.isArray(obj);
+    }
+    static handleProp(prop, options) {
+        if (Array.isArray(prop)) {
+            return prop.map(i => ObjectUtil.deepCopy(i, options));
+        }
+        else if (typeof prop === 'object' && prop !== null) {
+            return ObjectUtil.deepCopy(prop, options);
+        }
+        else {
+            return prop;
+        }
+    }
+    static getProperties(obj) {
+        return Object.keys(obj);
+    }
+    static getGetters(obj) {
+        const getterSet = new Set();
+        let currObj = obj;
+        while (currObj) {
+            const getters = Object.entries(Object.getOwnPropertyDescriptors(currObj))
+                .filter(([, descriptor]) => typeof descriptor.get === 'function')
+                .filter(([key]) => key !== '__proto__')
+                .map(([key]) => key);
+            for (const getter of getters) {
+                getterSet.add(getter);
+            }
+            currObj = Object.getPrototypeOf(currObj);
+        }
+        return Array.from(getterSet);
+    }
+}
+
+class StringUtil {
+    static escapeHtml(value) {
+        return value.replace(/</g, '&lt;').replace(/>/g, '&gt;');
+    }
+    static escapeHtmlAny(value) {
+        if (typeof value === 'string') {
+            return StringUtil.escapeHtml(value);
+        }
+        else if (typeof value === 'object') {
+            const escapedValue = ObjectUtil.deepCopy(value, { mapGettersToProperties: true });
+            for (const key in value) {
+                if (typeof value[key] === 'string') {
+                    escapedValue[key] = StringUtil.escapeHtml(value[key]);
+                }
+                else if (typeof value[key] === 'object') {
+                    escapedValue[key] = StringUtil.escapeHtmlAny(value[key]);
+                }
+                else {
+                    escapedValue[key] = value[key];
+                }
+            }
+            return escapedValue;
+        }
+        return value;
+    }
+    /**
+     * Stringifies a value - primitives with toString, dates with dateUtil, objects with JSON.stringify.
+     * @param value Any value.
+     */
+    static stringify(value) {
+        if (value === null) {
+            return 'null';
+        }
+        if (typeof value === 'undefined') {
+            return 'undefined';
+        }
+        // eliminate functions, cause they could fall into objects
+        if (typeof value === 'function') {
+            return `Function ${value.name ?? 'anonymous'}()`;
+        }
+        if (typeof value === 'object') {
+            // date is object, but would like it in ISO string representation
+            if (value instanceof Date) {
+                return DateUtil.toIsoString(value, false, true, true) ?? 'null';
+            }
+            try {
+                return JSON.stringify(value);
+            }
+            catch (e) {
+                return value.toString();
+            }
+        }
+        // only primitives should be left to be printed like this (string, number, boolean)
+        return value.toString();
+    }
+}
+
+class ErrorUtil {
+    /**
+     * Converts RxJS subscription error to MngError.
+     * @param error Error.
+     * @param name Optional name to write in mngError.
+     * @param details Optional details of error.
+     */
+    static fromSubscribeError(error, name, details) {
+        const opts = {
+            name,
+            details,
+            location: window?.location?.href
+        };
+        if (error instanceof HttpErrorResponse) {
+            return new MngHttpError(error.message ?? 'Http Error occurred', error, opts);
+        }
+        else {
+            opts.cause = error;
+            return new MngInternalError(error.message ?? 'Internal Error occurred', opts);
+        }
+    }
+    /**
+     * Checks if error is Http error (Angular or Mng).
+     * @param error
+     */
+    static isHttpErrorResponse(error) {
+        return error instanceof HttpErrorResponse || error instanceof MngHttpError || (error instanceof MngActionError && error.httpError);
+    }
+    /**
+     * Gets HttpErrorResponse from error (Angular or Mng).
+     * @param error Error.
+     */
+    static getHttpErrorResponse(error) {
+        if (error instanceof HttpErrorResponse) {
+            return error;
+        }
+        else if (error instanceof MngHttpError) {
+            return error.httpError;
+        }
+        else if (error instanceof MngActionError) {
+            return error.httpError ?? null;
+        }
+        else {
+            return null;
+        }
+    }
+    /**
+     * Gets HttpErrorResponse status from error (Angular or Mng).
+     * @param error Error.
+     */
+    static getHttpErrorResponseStatus(error) {
+        return ErrorUtil.getHttpErrorResponse(error)?.status ?? null;
+    }
+    /**
+     * Get error log level. All is error, except if error is http error with status >=400 and <500.
+     * @param error Error.
+     */
+    static getErrorLogLevel(error) {
+        if (ErrorUtil.isHttpErrorResponse(error)) {
+            const status = ErrorUtil.getHttpErrorResponseStatus(error);
+            if (status && status >= 400 && status < 500) {
+                return LogLevelEnum.Warning;
+            }
+        }
+        return LogLevelEnum.Error;
+    }
+    /**
+     * Get error name (prototype name or type from mng error if name is not provided).
+     * @param error Error.
+     */
+    static getErrorName(error) {
+        if (error instanceof AMngErrorBase) {
+            return error.name ?? error.type;
+        }
+        else {
+            return error.name;
+        }
+    }
+    /**
+     * Writes http error to string with all headers and body.
+     * @param error Http response error.
+     * @param opts Options for hiding parts of error:
+     *  - hideMessage Hides message of error (message include url, status and status text!).
+     *  - hideHeaders Hides headers.
+     *  - hideBody Hides JSON representation of body.
+     */
+    static httpErrorResponseToString(error, opts) {
+        let str = opts?.hideMessage ? '' : `${error.message}\n`; // message should already include url, status, etc.
+        if (!opts?.hideHeaders) {
+            str += `Http Response Headers: ${error.headers.keys().reduce((acc, key) => `${acc}[${key}: ${error.headers.get(key)}]`, '')}`;
+        }
+        if (!opts?.hideBody) {
+            str += `\nHttp Response Body: ${StringUtil.stringify(error.error)}`;
+        }
+        return str;
+    }
+    /**
+     * Error to string.
+     * @param error Error.
+     * @param opts Options for hiding parts of error:
+     * - hideMessage Hides message of error.
+     * - hideName Hides error name.
+     * - hideCause Hides cause of an error (if present, see @link(errorCauseToString) for other options).
+     * - hideStack Hides stack of an error (if present).
+     * - hideDetails Hides JSON detail's representation of error (if present).
+     * - hideLocation Hides location (URL) where error was thrown.
+     * - hideHttp Hides http error portion of error if http error response (see @link(httpErrorResponseToString) for other options).
+     */
+    static errorToString(error, opts) {
+        if (error instanceof AMngErrorBase) {
+            return ErrorUtil.mngErrorToString(error, opts);
+        }
+        else if (error instanceof HttpErrorResponse) {
+            return ErrorUtil.httpErrorResponseToString(error, opts);
+        }
+        const strBlocks = [];
+        if (!opts?.hideMessage) {
+            strBlocks.push(error.message);
+        }
+        if (error.name) {
+            strBlocks.push(`Error name: ${error.name}`);
+        }
+        if (!opts?.hideCause) {
+            strBlocks.push(ErrorUtil.errorCauseToString(error, opts));
+        }
+        if (!opts?.hideStack && error.stack) {
+            strBlocks.push(`Stack trace:\n${error.stack}`);
+        }
+        return strBlocks.filter(s => s.trim().length > 0).join('\n');
+    }
+    /**
+     * Mng error to string.
+     * @param error Mng error.
+     * @param opts Options for hiding parts of error:
+     * - hideMessage Hides message of error.
+     * - hideName Hides error name.
+     * - hideCause Hides cause of an error (if present, see @link(errorCauseToString) for other options).
+     * - hideStack Hides stack of an error (if present).
+     * - hideDetails Hides JSON detail's representation of error (if present).
+     * - hideLocation Hides location (URL) where error was thrown.
+     * - hideHttp Hides http error portion of error if http error response (see @link(httpErrorResponseToString) for other options).
+     * - hideItems Hides all item information (http body, action context data).
+     * - hideActionData See @link(mngActionErrorContextToString) for additional info.
+     * - hideQueryParams See @link(mngActionErrorContextToString) for additional info.
+     */
+    static mngErrorToString(error, opts) {
+        const strBlocks = [];
+        if (!opts?.hideMessage) {
+            strBlocks.push(`${error.message}${error.messageCode ? ` (code: ${error.messageCode})` : ''}`);
+        }
+        if (!opts?.hideName) {
+            strBlocks.push(`Error name: ${error.name ?? error.type} ${error.name ? `(${error.type})` : ''}`);
+        }
+        if (!opts?.hideLocation && error.location) {
+            strBlocks.push(`Location: ${error.location}`);
+        }
+        let isHttp = false;
+        if (!opts?.hideHttp && error instanceof MngHttpError) {
+            strBlocks.push(ErrorUtil.httpErrorResponseToString(error.httpError, {
+                hideBody: opts?.hideItems || opts?.hideBody,
+                hideHeaders: opts?.hideHeaders,
+                hideMessage: error.message.indexOf(error.httpError.message) >= 0
+            }));
+            isHttp = true;
+        }
+        if (error instanceof MngActionError) {
+            if (error.actionContext) {
+                strBlocks.push(ErrorUtil.mngActionErrorContextToString(error, opts));
+            }
+            if (!opts?.hideHttp && error.httpError) {
+                strBlocks.push(ErrorUtil.httpErrorResponseToString(error.httpError, {
+                    hideBody: opts?.hideItems || opts?.hideBody,
+                    hideHeaders: opts?.hideHeaders,
+                    hideMessage: error.message.indexOf(error.httpError.message) >= 0
+                }));
+                isHttp = true;
+            }
+        }
+        if (!opts?.hideDetails && error.details) {
+            strBlocks.push(`Details: ${StringUtil.stringify(error.details)}`);
+        }
+        if (!opts?.hideCause && (!isHttp || !(error.cause instanceof HttpErrorResponse))) {
+            strBlocks.push(ErrorUtil.errorCauseToString(error, opts));
+        }
+        if (!opts?.hideStack && error.stack) {
+            strBlocks.push(`Stack trace:\n${error.stack}`);
+        }
+        return strBlocks.filter(s => s.trim().length > 0).join('\n');
+    }
+    /**
+     * Writes Mng action error info from context as string.
+     * @param error Mng action error.
+     * @param opts Options for hiding parts of error:
+     * - hideItems Hides all item related information (item, form item, submit item, ...).
+     * - hideActionData Hides action data.
+     * - hideQueryParams Hides query params.
+     */
+    static mngActionErrorContextToString(error, opts) {
+        let paramsMessage = '';
+        if (error.actionContext?.parameters) {
+            if (error.actionContext?.parameters.itemId) {
+                paramsMessage += `[itemId: ${error.actionContext.parameters.itemId}]`;
+            }
+            if (!opts?.hideItems && error.actionContext?.parameters.item) {
+                paramsMessage += `[item: ${StringUtil.stringify(error.actionContext.parameters.item)}]`;
+            }
+            if (!opts?.hideActionData && error.actionContext?.parameters.actionData) {
+                paramsMessage += Object.entries(error.actionContext?.parameters.actionData).reduce((acc, [key, value]) => `${acc}[actionData ${key}: ${StringUtil.stringify(value)}]`, '');
+            }
+            if (!opts?.hideQueryParams && error.actionContext?.parameters.queryParam) {
+                paramsMessage += `[queryParam: ${StringUtil.stringify(error.actionContext.parameters.queryParam)}]`;
+            }
+            if (!opts?.hideItems && error.actionContext?.parameters.formItem) {
+                paramsMessage += `[formItem: ${StringUtil.stringify(error.actionContext.parameters.formItem)}]`;
+            }
+            if (!opts?.hideItems && error.actionContext?.parameters.submitResult) {
+                paramsMessage += `[formItem: ${StringUtil.stringify(error.actionContext.parameters.submitResult)}]`;
+            }
+            if (error.actionContext?.parameters.locale) {
+                paramsMessage += `[locale: ${StringUtil.stringify(error.actionContext.parameters.locale)}]`;
+            }
+        }
+        return paramsMessage;
+    }
+    /**
+     * Writes cause of an error as string.
+     * @param error Error.
+     * @param opts Options for hiding parts of error:
+     * - causeOnErrorOnly Prints only if cause is instance of error.
+     * - causeAsJson Print error cause as a JSON (by default, if error only message and name will be printed).
+     */
+    static errorCauseToString(error, opts) {
+        // if already logged as http error, check that cause is not also http error (cause it is usually duplicated)
+        if (error.cause && (!opts?.causeOnErrorOnly || error.cause instanceof Error)) {
+            const stringify = opts?.causeAsJson || !(error.cause instanceof Error);
+            if (!opts?.causeOnErrorOnly || error.cause instanceof Error) {
+                return ('Caused by: ' +
+                    (stringify ? StringUtil.stringify(error.cause) : `${error.cause.message}${error.cause.name ? ` (${error.cause.name})` : ''}`));
+            }
+        }
+        return '';
+    }
+}
+
 class TypeUtil {
     static { this.reflectTypeNameKey = 'typeName'; }
     static { this.reflectTypeIdPropertyKey = 'typeIdProperty'; }
@@ -8124,7 +8591,7 @@ class TypeUtil {
         if (enumName) {
             return enumName;
         }
-        throw new MngInternalError('Could not fined enum name', 'TypeUtils error');
+        throw new MngInternalError('Could not fined enum name', { name: 'TypeUtilsError' });
     }
     /**
      * Gets type's id property from reflect metadata.
@@ -8399,14 +8866,11 @@ var I18nUtils;
             const paramsRes = { ...params };
             paramsRes.errorStatus = '';
             paramsRes.errorMessage = '';
-            if (error.status) {
-                paramsRes.errorStatus = error.status;
-            }
-            if (error.message) {
-                paramsRes.errorMessage = error.message;
-            }
-            if (error.statusDescription) {
-                paramsRes.errorStatusDescription = error.statusDescription;
+            if (ErrorUtil.isHttpErrorResponse(error)) {
+                const httpError = ErrorUtil.getHttpErrorResponse(error);
+                paramsRes.errorStatus = httpError?.status;
+                paramsRes.errorMessage = httpError?.message;
+                paramsRes.errorStatusDescription = httpError?.statusText;
             }
             paramsRes.error = error;
             return paramsRes;
@@ -8532,119 +8996,6 @@ class NotificationUtil {
     }
 }
 
-class ObjectUtil {
-    static deepCopy(obj, options) {
-        if (typeof obj !== 'object' || obj === null || Array.isArray(obj)) {
-            return obj;
-        }
-        if (obj instanceof Date) {
-            return new Date(+obj);
-        }
-        let copy;
-        if (options?.mapGettersToProperties) {
-            copy = {};
-        }
-        else {
-            copy = options?.objectPrototype ? Object.create(options.objectPrototype['prototype']) : Object.create(Object.getPrototypeOf(obj));
-            Object.assign(copy, obj);
-        }
-        for (const key of ObjectUtil.getProperties(obj)) {
-            const prop = obj[key];
-            copy[key] = ObjectUtil.handleProp(prop, { mapGettersToProperties: options?.mapGettersToProperties });
-        }
-        if (options?.mapGettersToProperties) {
-            for (const getterKey of ObjectUtil.getGetters(obj)) {
-                const prop = obj[getterKey];
-                copy[getterKey] = ObjectUtil.handleProp(prop, { mapGettersToProperties: options?.mapGettersToProperties });
-            }
-        }
-        return copy;
-    }
-    static deepMerge(target, source) {
-        if (!ObjectUtil.isObject(source)) {
-            return target;
-        }
-        for (const key of ObjectUtil.getProperties(source)) {
-            if (ObjectUtil.isObject(source[key])) {
-                if (ObjectUtil.isObject(target[key])) {
-                    target[key] = ObjectUtil.deepMerge(target[key], source[key]);
-                }
-                else {
-                    target[key] = ObjectUtil.deepCopy(source[key]);
-                }
-            }
-            else if (Array.isArray(source[key])) {
-                if (!Array.isArray(target[key])) {
-                    target[key] = source[key].map(i => (ObjectUtil.isObject(i) ? ObjectUtil.deepMerge({}, i) : i));
-                }
-            }
-            else if (typeof target[key] === 'undefined') {
-                target[key] = source[key];
-            }
-        }
-        return target;
-    }
-    static isObject(obj) {
-        return typeof obj === 'object' && obj !== null && !Array.isArray(obj);
-    }
-    static handleProp(prop, options) {
-        if (Array.isArray(prop)) {
-            return prop.map(i => ObjectUtil.deepCopy(i, options));
-        }
-        else if (typeof prop === 'object' && prop !== null) {
-            return ObjectUtil.deepCopy(prop, options);
-        }
-        else {
-            return prop;
-        }
-    }
-    static getProperties(obj) {
-        return Object.keys(obj);
-    }
-    static getGetters(obj) {
-        const getterSet = new Set();
-        let currObj = obj;
-        while (currObj) {
-            const getters = Object.entries(Object.getOwnPropertyDescriptors(currObj))
-                .filter(([, descriptor]) => typeof descriptor.get === 'function')
-                .filter(([key]) => key !== '__proto__')
-                .map(([key]) => key);
-            for (const getter of getters) {
-                getterSet.add(getter);
-            }
-            currObj = Object.getPrototypeOf(currObj);
-        }
-        return Array.from(getterSet);
-    }
-}
-
-class StringUtil {
-    static escapeHtml(value) {
-        return value.replace(/</g, '&lt;').replace(/>/g, '&gt;');
-    }
-    static escapeHtmlAny(value) {
-        if (typeof value === 'string') {
-            return StringUtil.escapeHtml(value);
-        }
-        else if (typeof value === 'object') {
-            const escapedValue = ObjectUtil.deepCopy(value, { mapGettersToProperties: true });
-            for (const key in value) {
-                if (typeof value[key] === 'string') {
-                    escapedValue[key] = StringUtil.escapeHtml(value[key]);
-                }
-                else if (typeof value[key] === 'object') {
-                    escapedValue[key] = StringUtil.escapeHtmlAny(value[key]);
-                }
-                else {
-                    escapedValue[key] = value[key];
-                }
-            }
-            return escapedValue;
-        }
-        return value;
-    }
-}
-
 class ExportUtils {
     static prepareDataForExport(pageData, delimiter, descriptor, translate) {
         const replaceNullValue = (key, value) => (value === null ? '' : value);
@@ -8887,7 +9238,7 @@ class ActionDescriptor {
         this._model = model;
         this._actionName = actionName;
         if ((parentType && !parentProperty) || (!parentProperty && parentProperty)) {
-            throw new MngInternalError(`Provide both the parent type and parent property or none: ${parentType}, ${parentProperty}.`, 'ActionDescriptor error');
+            throw new MngInternalError(`Provide both the parent type and parent property or none: ${this._actionName}, ${parentType}, ${parentProperty}.`);
         }
         this._parentType = parentType;
         this._parentTypeName = parentType ? TypeUtil.findTypeName(parentType) : undefined;
@@ -8936,7 +9287,7 @@ class ActionDescriptor {
     }
     get runFunction() {
         if (!this._runFunction) {
-            throw new MngInternalError('Run function is not defined and cannot be invoked', 'ActionDescriptor error');
+            throw new MngInternalError(`Run function is not defined for action ${this._actionNameLong} and cannot be invoked`);
         }
         return this._runFunction;
     }
@@ -9022,7 +9373,7 @@ class ActionDescriptor {
     }
     withServiceType(serviceType) {
         if (!this._model) {
-            throw new MngInternalError(`Cannot set data provider if no model type is provided for action ${this._actionName}`, 'ActionDescriptor error');
+            throw new MngInternalError(`Cannot set data provider for action ${this._actionNameLong} if no model type is provided`);
         }
         this._dataProvider = new DataProvider(this._model.type, serviceType);
         return this;
@@ -9212,7 +9563,7 @@ class ActionEditorDescriptor extends ActionDescriptor {
         return this._dataProvider;
     }
     get runFunction() {
-        throw new MngInternalError('Run function cannot be used in editor action. Use submit function instead!', 'ActionDescriptor error');
+        throw new MngInternalError(`Run function cannot be used in editor action for ${this._actionNameLong}. Use submit function instead`);
     }
     get fetchFunction() {
         return this._fetchFunction;
@@ -9246,7 +9597,7 @@ class ActionEditorDescriptor extends ActionDescriptor {
     }
     withServiceType(serviceType) {
         if (!this._model) {
-            throw new MngInternalError(`Cannot set data provider if no model type is provided for action ${this._actionName}`, 'ActionDescriptor error');
+            throw new MngInternalError(`Cannot set data provider for action ${this._actionNameLong} if no model type is provided`);
         }
         this._dataProvider = new EditorDataProvider(this._model.type, serviceType);
         return this;
@@ -10597,6 +10948,14 @@ class MngAutocompleteComponent {
             this.searchSubscription = this.getLookup(queryParamBuilder.build(), event.query).subscribe({
                 next: items => {
                     this.setSuggestionsFromItems(items, event.query);
+                },
+                error: err => {
+                    this.setSuggestionsFromItems([], event.query);
+                    const mngError = ErrorUtil.fromSubscribeError(err, 'MngAutocompleteComponentError', {
+                        search: event.query,
+                        queryParam: queryParamBuilder.build()
+                    });
+                    this.logger.log(mngError, ErrorUtil.getErrorLogLevel(mngError));
                 }
             });
         }
@@ -10703,7 +11062,9 @@ class MngAutocompleteComponent {
                     this.itemsValueProperty = 'value';
                 }
                 else {
-                    throw new MngInternalError(`Invalid use with value (${this.itemsLabelPropertyInit}) and label (${this.itemsLabelPropertyInit}) property setup.`, 'MngAutocompleteComponent error');
+                    throw new MngInternalError(`Invalid use with value (${this.itemsLabelPropertyInit}) and label (${this.itemsLabelPropertyInit}) property setup.`, {
+                        name: 'MngAutocompleteComponentError'
+                    });
                 }
             }
         }
@@ -10879,7 +11240,9 @@ class MngDropdownComponent {
                     this.itemsValueProperty = 'value';
                 }
                 else {
-                    throw new MngInternalError(`Invalid use with value (${this.itemsLabelPropertyInit}) and label (${this.itemsLabelPropertyInit}) property setup.`, 'MngDropdownComponent error');
+                    throw new MngInternalError(`Invalid use with value (${this.itemsLabelPropertyInit}) and label (${this.itemsLabelPropertyInit}) property setup.`, {
+                        name: 'MngDropdownComponentError'
+                    });
                 }
             }
             this.itemsSubscription = this.dataProvider
@@ -10912,9 +11275,17 @@ class MngDropdownComponent {
                     return of(items);
                 }
             }))
-                .subscribe(res => {
-                this.itemsSubject.next(res);
-                this.loadingSubject.next(false);
+                .subscribe({
+                next: res => {
+                    this.itemsSubject.next(res);
+                    this.loadingSubject.next(false);
+                },
+                error: err => {
+                    const mngError = ErrorUtil.fromSubscribeError(err, 'MngDropdownComponentError', {
+                        queryParam: queryParamBuilder.build()
+                    });
+                    this.logger.log(mngError, ErrorUtil.getErrorLogLevel(mngError));
+                }
             });
             if (this.selectFirstItem && !this.dropdownFormControl?.value) {
                 this.items$.pipe(first()).subscribe(res => {
@@ -12105,6 +12476,7 @@ class MngTableComponent {
         this.localStorageService = localStorageService;
         this.filterDisplayRow = TableFilterDisplayEnum.Row;
         this.cmpTypeName = 'MngTableComponent';
+        this.logger = inject(MngLoggerService).create(this.cmpTypeName);
         this.useQueryParams = false;
         // extra features input
         this.selectionMode = 'multiple';
@@ -12503,6 +12875,10 @@ class MngTableComponent {
                 emptyQueryResult.allDataCount = 0;
                 this.dataProviderQueryResultSubject.next(emptyQueryResult);
                 this.dataProviderLoadingSubject.next(false);
+                const mngError = ErrorUtil.fromSubscribeError(err, 'MngTableComponentError', {
+                    queryParam: queryParam
+                });
+                this.logger.log(mngError, ErrorUtil.getErrorLogLevel(mngError));
             }
         });
         if (emitEvent) {
@@ -12714,7 +13090,7 @@ class MngTableComponent {
         this.layoutPreferences = {};
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", 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.1.7", 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>\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></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                                (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                    ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                    : '')\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                                (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                    ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                    : '')\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=\"descriptor?.filterDisplay === filterDisplayRow && 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></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 [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter>\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>\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn>\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 +\n                            (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                : '')\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$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "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", "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$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i4$3.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "directive", type: i4$3.ResizableColumn, selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "directive", type: i4$3.ReorderableColumn, selector: "[pReorderableColumn]", inputs: ["pReorderableColumnDisabled"] }, { kind: "component", type: i4$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i4$3.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i4$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i4$3.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: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor", "display"] }, { kind: "pipe", type: MngClassMapPipe, name: "mngClassMapPipe" }, { kind: "pipe", type: MngLocaleDefaultRowClassPipe, name: "mngLocaleDefaultRowClass" }, { kind: "component", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { 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$4.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", "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"], 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", "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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", 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                                (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                    ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                    : '')\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                                (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                    ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                    : '')\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=\"descriptor?.filterDisplay === filterDisplayRow && 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 [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter>\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 +\n                            (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                : '')\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$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "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", "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$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i4$3.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "directive", type: i4$3.ResizableColumn, selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "directive", type: i4$3.ReorderableColumn, selector: "[pReorderableColumn]", inputs: ["pReorderableColumnDisabled"] }, { kind: "component", type: i4$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i4$3.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i4$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i4$3.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: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor", "display"] }, { kind: "pipe", type: MngClassMapPipe, name: "mngClassMapPipe" }, { kind: "pipe", type: MngLocaleDefaultRowClassPipe, name: "mngLocaleDefaultRowClass" }, { kind: "component", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { 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$4.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", "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"], 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", "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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: MngTableComponent, decorators: [{
             type: Component,
@@ -12739,7 +13115,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
                         ButtonModule,
                         TooltipModule,
                         FormsModule
-                    ], 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>\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></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                                (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                    ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                    : '')\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                                (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                    ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                    : '')\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=\"descriptor?.filterDisplay === filterDisplayRow && 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></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 [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter>\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>\n                    <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n                </td>\n                <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn>\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 +\n                            (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                : '')\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        [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                                (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                    ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                    : '')\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                                (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                    ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                    : '')\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=\"descriptor?.filterDisplay === filterDisplayRow && 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 [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.descriptor.filterDescriptor\"></mng-table-column-filter>\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 +\n                            (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.descriptor.filterDescriptor\n                                ? ' mng-column-filter-' + col.descriptor.filterDescriptor.filterType\n                                : '')\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: [{
@@ -13122,6 +13498,7 @@ class MngFormlyFieldLookupDialogComponent extends FieldType {
     constructor(injector) {
         super();
         this.injector = injector;
+        this.logger = inject(MngLoggerService).create('MngFormlyFieldLookupDialogComponent');
         this.fieldLabelFormControl = new FormControl();
         this.itemsSubject = new ReplaySubject(1);
         this.itemsAsync = this.itemsSubject.asObservable();
@@ -13212,6 +13589,10 @@ class MngFormlyFieldLookupDialogComponent extends FieldType {
                         eventSubtype: 'LookupError',
                         queryResult: err
                     });
+                    const mngError = ErrorUtil.fromSubscribeError(err, 'MngFormlyFieldLookupDialogComponentError', {
+                        queryParam: queryParamBuilder.build()
+                    });
+                    this.logger.log(mngError, ErrorUtil.getErrorLogLevel(mngError));
                 }
             });
         }
@@ -13269,7 +13650,7 @@ class MngFormlyFieldLookupDialogComponent extends FieldType {
         if (typeof value === 'object') {
             const labelProperty = this.descriptor.itemsLabelProperty ?? this.descriptor.dialogTableDescriptor?.model.titlePropertyName;
             if (!labelProperty) {
-                throw new MngInternalError('Could not determine label property.', 'MngFormlyFieldLookupDialog error');
+                throw new MngInternalError('Could not determine label property.', { name: 'MngFormlyFieldLookupDialogError' });
             }
             this.fieldLabelFormControl.setValue(value[labelProperty]);
         }
@@ -13331,7 +13712,7 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
             })
                 .withSubmitFunction(ctx => {
                 if (!ctx.parameters.item) {
-                    return throwError(() => new MngInternalError(`No item was provided in context, add cannot be done.`, 'FormlyFieldTableDialogFormComponent error'));
+                    return throwError(() => new MngInternalError(`No item was provided in context, add cannot be done.`, { name: 'FormlyFieldTableDialogFormComponentError' }));
                 }
                 this.formState.submittedOn = Date.now();
                 let value = this.formControl.value;
@@ -13359,7 +13740,7 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
             })
                 .withSubmitFunction(ctx => {
                 if (!ctx.parameters.item) {
-                    return throwError(() => new MngInternalError(`No item was provided in context, edit cannot be done.`, 'FormlyFieldTableDialogFormComponent error'));
+                    return throwError(() => new MngInternalError(`No item was provided in context, edit cannot be done.`, { name: 'FormlyFieldTableDialogFormComponentError' }));
                 }
                 this.formState.submittedOn = Date.now();
                 const formControlValue = this.formControl.value;
@@ -13382,7 +13763,7 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
                 .withButtonDescriptor(new ActionButtonDescriptor().withStyleClass(new ButtonStyleBuilder(StyleLevelEnum.Danger).withSize(StyleSizeEnum.ExtraSmall)))
                 .withRunFunction(ctx => {
                 if (!ctx.parameters.item) {
-                    return throwError(() => new MngInternalError(`No item was provided in context, delete cannot be done.`, 'FormlyFieldTableDialogFormComponent error'));
+                    return throwError(() => new MngInternalError(`No item was provided in context, delete cannot be done.`, { name: 'FormlyFieldTableDialogFormComponentError' }));
                 }
                 let formControlValue = this.formControl.value;
                 const compareProperty = this.descriptor.tableDescriptor.dataKeyProperty
@@ -13400,7 +13781,9 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
                     this.formControl.markAsDirty();
                 }
                 else {
-                    return throwError(() => new MngInternalError('Cannot compare items, please provide main table data key property or model id property.', 'FormlyFieldTableDialogFormComponent error'));
+                    return throwError(() => new MngInternalError('Cannot compare items, please provide main table data key property or model id property.', {
+                        name: 'FormlyFieldTableDialogFormComponentError'
+                    }));
                 }
                 this.formControl.markAsTouched();
                 return of(ctxItem);
@@ -13483,6 +13866,7 @@ class MngFormlyFieldTableDialogMultiselectComponent extends FieldType {
     constructor(injector) {
         super();
         this.injector = injector;
+        this.logger = inject(MngLoggerService).create('MngFormlyFieldTableDialogMultiselectComponent');
         this.itemsSubject = new ReplaySubject(1);
         this.itemsAsync = this.itemsSubject.asObservable();
         this.addItemsSubject = new ReplaySubject(1);
@@ -13569,8 +13953,12 @@ class MngFormlyFieldTableDialogMultiselectComponent extends FieldType {
                         this.dialogAreItemsLoaded = true;
                         this.dialogIsLoadingSubject.next(false);
                     },
-                    error: () => {
+                    error: err => {
                         this.dialogIsLoadingSubject.next(false);
+                        const mngError = ErrorUtil.fromSubscribeError(err, 'MngFormlyFieldTableDialogMultiselectComponent', {
+                            queryParam: queryParamBuilder.build()
+                        });
+                        this.logger.log(mngError, ErrorUtil.getErrorLogLevel(mngError));
                     }
                 });
             });
@@ -13613,7 +14001,9 @@ class MngFormlyFieldTableDialogMultiselectComponent extends FieldType {
             ? this.descriptor.mainTableDescriptor.dataKeyProperty
             : this.descriptor.mainTableDescriptor.model.idPropertyName;
         if (!compareProperty) {
-            throw new MngInternalError('Cannot compare items, please provide main table data key property or model id property.', 'FormlyFieldTableDialogMultiselectComponent error');
+            throw new MngInternalError('Cannot compare items, please provide main table data key property or model id property.', {
+                name: 'FormlyFieldTableDialogMultiselectComponentError'
+            });
         }
         value = value.filter((i) => i[compareProperty] !== item[compareProperty]);
         this.formControl.patchValue(value);
@@ -13626,11 +14016,11 @@ class MngFormlyFieldTableDialogMultiselectComponent extends FieldType {
         this.searchDebounceSubject.next(query);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: MngFormlyFieldTableDialogMultiselectComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: MngFormlyFieldTableDialogMultiselectComponent, isStandalone: true, selector: "mng-formly-table-multiselect-add-field", viewQueries: [{ propertyName: "addTableComponent", first: true, predicate: ["addTableComponent"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"itemsAsync\" [viewContainer]=\"viewContainer\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header pt-0\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label\n            >\n            <button\n                *ngIf=\"hasAddAction && !options?.formState?.disabled\"\n                pButton\n                pRipple\n                type=\"button\"\n                icon=\"pi pi-plus\"\n                class=\"p-button-rounded mng-button-xs\"\n                (click)=\"openAddDialog()\"\n                [disabled]=\"formControl!.disabled\"></button>\n        </div>\n    </ng-template>\n    <ng-template mngTemplate=\"columnAction\" let-item=\"rowItem\">\n        <button\n            *ngIf=\"hasDeleteAction && !options?.formState?.disabled\"\n            pButton\n            pRipple\n            type=\"button\"\n            icon=\"pi pi-trash\"\n            class=\"p-button-rounded p-button-danger mng-button-xs\"\n            (click)=\"removeItem(item)\"\n            [disabled]=\"formControl!.disabled\"></button>\n    </ng-template>\n</mng-table>\n\n<p-dialog\n    *ngIf=\"hasAddAction\"\n    [(visible)]=\"isDialogVisible\"\n    [draggable]=\"false\"\n    [header]=\"'general.addItem' | translate : {item: props.label! | translate}\"\n    [modal]=\"true\"\n    appendTo=\"body\"\n    styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n    <ng-template pTemplate=\"content\" class=\"table-container\">\n        <div class=\"h-full flex flex-column\">\n            <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n                <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n                    <mng-table\n                        #addTableComponent\n                        [descriptor]=\"descriptor.mainTableDescriptor\"\n                        [globalFilterFields]=\"descriptor.searchFields\"\n                        [queryResult]=\"addItemsAsync\"\n                        [selectionEnabled]=\"true\"\n                        [loading]=\"dialogIsLoading$\"\n                        (selectionChange)=\"onSelectionChange($event)\"\n                        [viewContainer]=\"viewContainer\">\n                        <ng-template *ngIf=\"descriptor.searchEnabled\" mngTemplate=\"caption\">\n                            <div class=\"flex\">\n                                <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n                                    <i class=\"pi pi-search\"></i>\n                                    <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n                                </span>\n                            </div>\n                        </ng-template>\n                    </mng-table>\n                </div>\n            </div>\n\n            <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n                <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n                <button\n                    pButton\n                    pRipple\n                    type=\"button\"\n                    [label]=\"'general.add' | translate\"\n                    icon=\"pi pi-check\"\n                    class=\"p-button-primary\"\n                    (click)=\"addItems()\"\n                    [loading]=\"(dialogIsLoading$ | async) ?? false\"\n                    [disabled]=\"form.disabled\"></button>\n            </div>\n        </div>\n    </ng-template>\n</p-dialog>\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: MngTableComponent, selector: "mng-table", inputs: ["descriptor", "items", "queryResult", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "actions", "isColumnClickable", "viewContainer", "captionComponent", "columnActionComponent", "columnActionMinWidth", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i4$4.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { 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: "directive", type: MngTemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i14.InputText, selector: "[pInputText]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: MngFormlyFieldTableDialogMultiselectComponent, isStandalone: true, selector: "mng-formly-table-multiselect-add-field", viewQueries: [{ propertyName: "addTableComponent", first: true, predicate: ["addTableComponent"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"itemsAsync\" [viewContainer]=\"viewContainer\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header pt-0\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label\n            >\n            <button\n                *ngIf=\"hasAddAction && !options?.formState?.disabled\"\n                pButton\n                pRipple\n                type=\"button\"\n                icon=\"pi pi-plus\"\n                class=\"p-button-rounded mng-button-xs\"\n                (click)=\"openAddDialog()\"\n                [disabled]=\"formControl!.disabled\"></button>\n        </div>\n    </ng-template>\n    <ng-template mngTemplate=\"columnAction\" let-item=\"rowItem\">\n        <button\n            *ngIf=\"hasDeleteAction && !options?.formState?.disabled\"\n            pButton\n            pRipple\n            type=\"button\"\n            icon=\"pi pi-trash\"\n            class=\"p-button-rounded p-button-danger mng-button-xs\"\n            (click)=\"removeItem(item)\"\n            [disabled]=\"formControl!.disabled\"></button>\n    </ng-template>\n</mng-table>\n\n<p-dialog\n    *ngIf=\"hasAddAction\"\n    [(visible)]=\"isDialogVisible\"\n    [draggable]=\"false\"\n    [header]=\"'general.addItem' | translate : {item: props.label! | translate}\"\n    [modal]=\"true\"\n    appendTo=\"body\"\n    styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n    <ng-template pTemplate=\"content\" class=\"table-container\">\n        <div class=\"h-full flex flex-column\">\n            <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n                <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n                    <mng-table\n                        #addTableComponent\n                        [descriptor]=\"descriptor.lookupTableDescriptor\"\n                        [globalFilterFields]=\"descriptor.searchFields\"\n                        [queryResult]=\"addItemsAsync\"\n                        [selectionEnabled]=\"true\"\n                        [loading]=\"dialogIsLoading$\"\n                        (selectionChange)=\"onSelectionChange($event)\"\n                        [viewContainer]=\"viewContainer\">\n                        <ng-template *ngIf=\"descriptor.searchEnabled\" mngTemplate=\"caption\">\n                            <div class=\"flex\">\n                                <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n                                    <i class=\"pi pi-search\"></i>\n                                    <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n                                </span>\n                            </div>\n                        </ng-template>\n                    </mng-table>\n                </div>\n            </div>\n\n            <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n                <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n                <button\n                    pButton\n                    pRipple\n                    type=\"button\"\n                    [label]=\"'general.add' | translate\"\n                    icon=\"pi pi-check\"\n                    class=\"p-button-primary\"\n                    (click)=\"addItems()\"\n                    [loading]=\"(dialogIsLoading$ | async) ?? false\"\n                    [disabled]=\"form.disabled\"></button>\n            </div>\n        </div>\n    </ng-template>\n</p-dialog>\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: MngTableComponent, selector: "mng-table", inputs: ["descriptor", "items", "queryResult", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "actions", "isColumnClickable", "viewContainer", "captionComponent", "columnActionComponent", "columnActionMinWidth", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i4$4.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { 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: "directive", type: MngTemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i14.InputText, selector: "[pInputText]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: MngFormlyFieldTableDialogMultiselectComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'mng-formly-table-multiselect-add-field', imports: [TranslateModule, NgIf, AsyncPipe, MngTableComponent, DialogModule, ButtonModule, RippleModule, MngTemplateDirective, InputTextModule, NgStyle], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"itemsAsync\" [viewContainer]=\"viewContainer\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header pt-0\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label\n            >\n            <button\n                *ngIf=\"hasAddAction && !options?.formState?.disabled\"\n                pButton\n                pRipple\n                type=\"button\"\n                icon=\"pi pi-plus\"\n                class=\"p-button-rounded mng-button-xs\"\n                (click)=\"openAddDialog()\"\n                [disabled]=\"formControl!.disabled\"></button>\n        </div>\n    </ng-template>\n    <ng-template mngTemplate=\"columnAction\" let-item=\"rowItem\">\n        <button\n            *ngIf=\"hasDeleteAction && !options?.formState?.disabled\"\n            pButton\n            pRipple\n            type=\"button\"\n            icon=\"pi pi-trash\"\n            class=\"p-button-rounded p-button-danger mng-button-xs\"\n            (click)=\"removeItem(item)\"\n            [disabled]=\"formControl!.disabled\"></button>\n    </ng-template>\n</mng-table>\n\n<p-dialog\n    *ngIf=\"hasAddAction\"\n    [(visible)]=\"isDialogVisible\"\n    [draggable]=\"false\"\n    [header]=\"'general.addItem' | translate : {item: props.label! | translate}\"\n    [modal]=\"true\"\n    appendTo=\"body\"\n    styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n    <ng-template pTemplate=\"content\" class=\"table-container\">\n        <div class=\"h-full flex flex-column\">\n            <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n                <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n                    <mng-table\n                        #addTableComponent\n                        [descriptor]=\"descriptor.mainTableDescriptor\"\n                        [globalFilterFields]=\"descriptor.searchFields\"\n                        [queryResult]=\"addItemsAsync\"\n                        [selectionEnabled]=\"true\"\n                        [loading]=\"dialogIsLoading$\"\n                        (selectionChange)=\"onSelectionChange($event)\"\n                        [viewContainer]=\"viewContainer\">\n                        <ng-template *ngIf=\"descriptor.searchEnabled\" mngTemplate=\"caption\">\n                            <div class=\"flex\">\n                                <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n                                    <i class=\"pi pi-search\"></i>\n                                    <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n                                </span>\n                            </div>\n                        </ng-template>\n                    </mng-table>\n                </div>\n            </div>\n\n            <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n                <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n                <button\n                    pButton\n                    pRipple\n                    type=\"button\"\n                    [label]=\"'general.add' | translate\"\n                    icon=\"pi pi-check\"\n                    class=\"p-button-primary\"\n                    (click)=\"addItems()\"\n                    [loading]=\"(dialogIsLoading$ | async) ?? false\"\n                    [disabled]=\"form.disabled\"></button>\n            </div>\n        </div>\n    </ng-template>\n</p-dialog>\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"] }]
+            args: [{ standalone: true, selector: 'mng-formly-table-multiselect-add-field', imports: [TranslateModule, NgIf, AsyncPipe, MngTableComponent, DialogModule, ButtonModule, RippleModule, MngTemplateDirective, InputTextModule, NgStyle], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"itemsAsync\" [viewContainer]=\"viewContainer\">\n    <ng-template mngTemplate=\"caption\">\n        <div class=\"flex flex-row justify-content-end align-items-center table-header pt-0\">\n            <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n                >{{ props.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label\n            >\n            <button\n                *ngIf=\"hasAddAction && !options?.formState?.disabled\"\n                pButton\n                pRipple\n                type=\"button\"\n                icon=\"pi pi-plus\"\n                class=\"p-button-rounded mng-button-xs\"\n                (click)=\"openAddDialog()\"\n                [disabled]=\"formControl!.disabled\"></button>\n        </div>\n    </ng-template>\n    <ng-template mngTemplate=\"columnAction\" let-item=\"rowItem\">\n        <button\n            *ngIf=\"hasDeleteAction && !options?.formState?.disabled\"\n            pButton\n            pRipple\n            type=\"button\"\n            icon=\"pi pi-trash\"\n            class=\"p-button-rounded p-button-danger mng-button-xs\"\n            (click)=\"removeItem(item)\"\n            [disabled]=\"formControl!.disabled\"></button>\n    </ng-template>\n</mng-table>\n\n<p-dialog\n    *ngIf=\"hasAddAction\"\n    [(visible)]=\"isDialogVisible\"\n    [draggable]=\"false\"\n    [header]=\"'general.addItem' | translate : {item: props.label! | translate}\"\n    [modal]=\"true\"\n    appendTo=\"body\"\n    styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n    <ng-template pTemplate=\"content\" class=\"table-container\">\n        <div class=\"h-full flex flex-column\">\n            <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n                <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n                    <mng-table\n                        #addTableComponent\n                        [descriptor]=\"descriptor.lookupTableDescriptor\"\n                        [globalFilterFields]=\"descriptor.searchFields\"\n                        [queryResult]=\"addItemsAsync\"\n                        [selectionEnabled]=\"true\"\n                        [loading]=\"dialogIsLoading$\"\n                        (selectionChange)=\"onSelectionChange($event)\"\n                        [viewContainer]=\"viewContainer\">\n                        <ng-template *ngIf=\"descriptor.searchEnabled\" mngTemplate=\"caption\">\n                            <div class=\"flex\">\n                                <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n                                    <i class=\"pi pi-search\"></i>\n                                    <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n                                </span>\n                            </div>\n                        </ng-template>\n                    </mng-table>\n                </div>\n            </div>\n\n            <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n                <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n                <button\n                    pButton\n                    pRipple\n                    type=\"button\"\n                    [label]=\"'general.add' | translate\"\n                    icon=\"pi pi-check\"\n                    class=\"p-button-primary\"\n                    (click)=\"addItems()\"\n                    [loading]=\"(dialogIsLoading$ | async) ?? false\"\n                    [disabled]=\"form.disabled\"></button>\n            </div>\n        </div>\n    </ng-template>\n</p-dialog>\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { addTableComponent: [{
                 type: ViewChild,
                 args: ['addTableComponent']
@@ -13846,7 +14236,7 @@ class RouteUtil {
             }
             else if (path[0].startsWith('../')) {
                 // TODO: process multi upper folder
-                throw new MngInternalError('Not implemented', 'RouteUtils error');
+                throw new MngInternalError('Not implemented', { name: 'RouteUtilsError' });
             }
             else {
                 return RouteUtil.removeEmptyPathSegments([...basePath, ...path]);
@@ -14566,16 +14956,12 @@ class MngErrorHandler {
     }
     static { this.logCategory = 'MngErrorHandler'; }
     handleError(error) {
-        if (error instanceof MngInternalError) {
-            const internalError = error;
-            this.logger.log(internalError.messageLog, LogLevelEnum.Error, internalError.name, error);
-        }
-        else if (error instanceof HttpErrorResponse) {
-            const isClientError = error.status >= 400 && error.status < 500;
-            this.logger.log(`Http error occurred with status ${error.status} ${error.statusText}: ${error.message}`, isClientError ? LogLevelEnum.Warning : LogLevelEnum.Error, MngErrorHandler.logCategory, error);
+        if (error instanceof AMngErrorBase || error instanceof HttpErrorResponse) {
+            const logLevel = ErrorUtil.getErrorLogLevel(error);
+            this.logger.log(error, logLevel);
         }
         else {
-            this.logger.log(`Unexpected error occurred: ${error.message}`, LogLevelEnum.Error, MngErrorHandler.logCategory, error);
+            this.logger.error('Unexpected error occurred', error);
         }
     }
 }
@@ -14588,6 +14974,7 @@ class MngCommonsInitService {
     constructor() {
         this.httpClient = inject(HttpClient);
         this.logger = inject(MngLoggerService);
+        this.logPublishers = inject(MNG_LOG_PUBLISHERS, { optional: true });
         this.config = inject(MngConfigurationService);
         this.mngCommons = inject(MngCommonsService);
         this.mngRouter = inject(MngRouterService);
@@ -14627,7 +15014,7 @@ class MngCommonsInitService {
         }
         return this.config.loadJsonConfigurations().pipe(mergeMap(() => {
             // init logger
-            MngLoggerService.init(this.config);
+            MngLoggerService.init(this.config, this.logPublishers ?? []);
             if (this.commonsInitializers) {
                 ctxLogger.debug('Project initializers are being initialized');
                 return combineLatest(this.commonsInitializers.map(ci => ci())).pipe(map(res => res));
@@ -14982,6 +15369,11 @@ function provideMngCommons(config) {
             provide: MngLoggerService,
             useFactory: () => MngLoggerService.get()
         },
+        {
+            provide: MNG_LOG_PUBLISHERS,
+            useClass: MngLogPublisherConsoleService,
+            multi: true
+        },
         {
             provide: ErrorHandler,
             useClass: MngErrorHandler
@@ -15705,13 +16097,13 @@ class RouteBuilder {
     }
     toParent() {
         if (!this.parent) {
-            throw new MngInternalError('Parent was not provided.', 'RouteBuilder error');
+            throw new MngInternalError('Parent was not provided.', { name: 'RouteBuilder error' });
         }
         return this.parent;
     }
     toRoot() {
         if (!this.root) {
-            throw new MngInternalError('Root was not provided.', 'RouteBuilder error');
+            throw new MngInternalError('Root was not provided.', { name: 'RouteBuilderError' });
         }
         return this.root;
     }
@@ -15893,7 +16285,7 @@ class RoutesBuilder {
     }
     toRoute() {
         if (!this.currentRoute) {
-            throw new MngInternalError('No routes were added!', 'RoutesBuilder error');
+            throw new MngInternalError('No routes were added!', { name: 'RoutesBuilderError' });
         }
         return this.currentRoute;
     }
@@ -16143,5 +16535,5 @@ function EnumName(typeName) {
  * Generated bundle index. Do not edit.
  */
 
-export { ACTION_EDITOR_DIALOG_COMPONENT_SETTING, AFieldDescriptor, AFieldGroupDescriptor, AGenericFieldDescriptor, AMngApiService, AMngBaseApiService, AMngCrudApiService, 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, 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_MODULE_CONFIG_IT, MediusFilterMatchType, MediusFilterParam, MediusQueryMode, MediusQueryParam, MediusQueryParamBuilder, MediusQueryResult, MediusRestUtil, MngActionComponent, MngActionEditorComponent, MngActionErrorMapperService, MngActionExecutorService, MngActionRouteComponent, MngAuthorizationService, MngAutocompleteComponent, MngBooleanPipe, MngBreadcrumbComponent, MngClassMapPipe, MngCommonsModule, MngCommonsService, MngComponentDirective, MngConfigurationService, MngDataLanguageDropdownComponent, MngDateRangeComponent, 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, MngI18nPropertyPipe, MngInternalError, MngLocalStorageService, MngLocaleDefaultRowClassPipe, MngLoggerService, MngMainLayoutComponent, MngMainLayoutComponentService, MngMenuComponent, MngMenuItemComponent, MngNavigationService, MngNotFoundPageComponent, MngParametrizePipe, MngRouterService, MngTableCellClickEvent, MngTableColumnFilterComponent, 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, 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, MngClassMapPipe, MngCommonsModule, MngCommonsService, MngComponentDirective, MngConfigurationService, MngDataLanguageDropdownComponent, MngDateRangeComponent, 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, 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, enumsMapBase, formlyTypesConfig, formlyWrappersConfig, getEmailValidationMessage, getFormlyValidationMessages, getMaxDateValidationMessage, getMaxLengthValidationMessage, getMaxValidationMessage, getMinDateValidationMessage, getMinLengthValidationMessage, getMinValidationMessage, getRequiredValidationMessage, getTextPatternValidationMessage, mngAuthorizationGuard, mngFormlyConfigProvider, primeNgModules, provideMngCommons, typeMapBase };
 //# sourceMappingURL=mediusinc-mng-commons.mjs.map