ontimize-web-ngx 15.0.0-beta.0 → 15.0.0-beta.2

package/fesm2020/ontimize-web-ngx.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, EventEmitter, Directive, Host, Self, Optional, Input, HostListener, Output, Injectable, Injector, Component, forwardRef, ContentChildren, ChangeDetectorRef, Pipe, NgModule, ViewChild, ElementRef, ViewEncapsulation, ViewContainerRef, Inject, NgZone, HostBinding, ViewChildren, ChangeDetectionStrategy, CUSTOM_ELEMENTS_SCHEMA, TemplateRef, SkipSelf, isDevMode, ContentChild, Renderer2, APP_INITIALIZER } from '@angular/core';
+import { InjectionToken, EventEmitter, Directive, Host, Self, Optional, Input, HostListener, Output, Injectable, Injector, Component, forwardRef, ContentChildren, ChangeDetectorRef, Pipe, NgModule, ViewChild, ElementRef, ViewEncapsulation, ViewContainerRef, Inject, NgZone, HostBinding, ViewChildren, ChangeDetectionStrategy, CUSTOM_ELEMENTS_SCHEMA, TemplateRef, SkipSelf, isDevMode, ContentChild, Renderer2, inject, APP_INITIALIZER } from '@angular/core';
 import moment from 'moment';
 import { isObservable, from, of, Subscription, Subject, Observable, timer, combineLatest, BehaviorSubject, ReplaySubject, merge, fromEvent } from 'rxjs';
 export { Observable, Subject } from 'rxjs';
@@ -12,7 +12,7 @@ import { TranslateService, TranslateDefaultParser, TranslateModule, TranslateLoa
 import * as i10 from 'ngx-material-timepicker';
 import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker';
 import * as i1$2 from '@angular/common';
-import { Location, CommonModule, LOCATION_INITIALIZED } from '@angular/common';
+import { Location, CommonModule, DOCUMENT, LOCATION_INITIALIZED } from '@angular/common';
 import * as i1 from '@angular/router';
 import { Router, NavigationStart, NavigationEnd, RouterModule, ActivatedRoute } from '@angular/router';
 import * as i2$2 from '@angular/flex-layout';
@@ -551,6 +551,10 @@ class Util {
         const L = cuList.join('');
         return L;
     }
+    static isArrayEqual(array1, array2) {
+        return array1.length === array2.length && array1.every((v, i) => v === array2[i]);
+    }
+    ;
     static differenceArrays(array1, array2) {
         const difference = array1.filter(obj => {
             return !array2.some(obj2 => {
@@ -3941,6 +3945,7 @@ class OTranslateService {
         this.httpClient = this.injector.get(HttpClient);
         this.appConfig = this.injector.get(AppConfig);
         this.localStorageKey = this.appConfig.getConfiguration().uuid;
+        this.defaultLocale = this.appConfig.getConfiguration().defaultLocale;
     }
     storeLanguage(language) {
         if (language) {
@@ -4002,7 +4007,7 @@ class OTranslateService {
             textTranslated = undefined;
         }
         if (!textTranslated) {
-            const bundle = MAP[this.ngxTranslateService.currentLang] || MAP[this.DEFAULT_LANG];
+            const bundle = MAP[this.ngxTranslateService.currentLang] || MAP[this.defaultLocale] || MAP[this.DEFAULT_LANG];
             if (bundle && bundle[text]) {
                 textTranslated = bundle[text];
             }
@@ -4190,7 +4195,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
         }], ctorParameters: function () { return [{ type: i1$1.MatDialogRef }, { type: i0.Injector }]; } });
 
 class OErrorDialogManager {
-    constructor() { }
+    constructor(ng2Dialog) {
+        this.ng2Dialog = ng2Dialog;
+    }
     restart() {
         this.errorDialogSubscription = null;
     }
@@ -4229,14 +4236,14 @@ class OErrorDialogManager {
         return observable.toPromise();
     }
 }
-OErrorDialogManager.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OErrorDialogManager, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+OErrorDialogManager.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OErrorDialogManager, deps: [{ token: i1$1.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
 OErrorDialogManager.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OErrorDialogManager, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OErrorDialogManager, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: function () { return []; } });
+        }], ctorParameters: function () { return [{ type: i1$1.MatDialog }]; } });
 
 class OFormValue {
     constructor(value) {
@@ -5878,8 +5885,7 @@ const DEFAULT_INPUTS_O_FORM_CONTAINER = [
     'form'
 ];
 class OFormContainerComponent {
-    constructor(resolver) {
-        this.resolver = resolver;
+    constructor() {
         this.breadcrumb = false;
         this.breadcrumbSeparator = ' ';
     }
@@ -5894,14 +5900,13 @@ class OFormContainerComponent {
         this.formMananger = form.getFormManager();
     }
     createBreadcrumb(container) {
-        const factory = this.resolver.resolveComponentFactory(OBreadcrumbComponent);
-        const ref = container.createComponent(factory);
+        const ref = container.createComponent(OBreadcrumbComponent);
         ref.instance.form = this.form;
         ref.instance.labelColumns = this.breadcrumbLabelColumns;
         ref.instance.separator = this.breadcrumbSeparator;
     }
 }
-OFormContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormContainerComponent, deps: [{ token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+OFormContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 OFormContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OFormContainerComponent, selector: "o-form-container", inputs: { breadcrumb: "breadcrumb", breadcrumbSeparator: ["breadcrumb-separator", "breadcrumbSeparator"], breadcrumbLabelColumns: ["breadcrumb-label-columns", "breadcrumbLabelColumns"], form: "form" }, host: { properties: { "class.o-form-container": "true", "class.breadcrumb": "breadcrumb" } }, viewQueries: [{ propertyName: "breadContainer", first: true, predicate: ["breadcrumb"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div class=\"o-form-container-content\">\n  <ng-template #breadcrumb></ng-template>\n  <ng-content></ng-content>\n</div>", styles: [".application-layout-content-wrapper .o-form-container{position:relative;width:100%;height:100%;display:block}.application-layout-content-wrapper .o-form-container .o-form-container-content{display:flex;flex:auto;flex-direction:column;max-height:100%}.application-layout-content-wrapper .o-form-container .o-form-container-content>.o-breadcrumb{padding-left:8px;padding-right:8px}\n"], encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     BooleanInputConverter(),
@@ -5913,7 +5918,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                         '[class.o-form-container]': 'true',
                         '[class.breadcrumb]': 'breadcrumb'
                     }, template: "<div class=\"o-form-container-content\">\n  <ng-template #breadcrumb></ng-template>\n  <ng-content></ng-content>\n</div>", styles: [".application-layout-content-wrapper .o-form-container{position:relative;width:100%;height:100%;display:block}.application-layout-content-wrapper .o-form-container .o-form-container-content{display:flex;flex:auto;flex-direction:column;max-height:100%}.application-layout-content-wrapper .o-form-container .o-form-container-content>.o-breadcrumb{padding-left:8px;padding-right:8px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ComponentFactoryResolver }]; }, propDecorators: { breadContainer: [{
+        }], propDecorators: { breadContainer: [{
                 type: ViewChild,
                 args: ['breadcrumb', { read: ViewContainerRef }]
             }], breadcrumb: [] } });
@@ -6281,39 +6286,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             }] } });
 
 class OFormLayoutDialogComponent {
-    constructor(dialogRef, injector, componentFactoryResolver, data) {
+    constructor(dialogRef, injector, data) {
         this.dialogRef = dialogRef;
         this.injector = injector;
-        this.componentFactoryResolver = componentFactoryResolver;
+        this.title = 'LAYOUT_MANANGER.DIALOG_TITLE';
         this.dialogService = injector.get(DialogService);
-        if (data.title) {
+        if (typeof data.title !== 'undefined') {
             this.title = data.title;
         }
         if (data.data) {
             this.data = data.data;
-            const component = data.data.component;
-            this.componentFactory = this.componentFactoryResolver.resolveComponentFactory(component);
+            this.component = data.data.component;
+            ;
             this.params = data.data.params;
             this.queryParams = data.data.queryParams;
             this.urlSegments = data.data.urlSegments;
+            this.dialogTitleSeparator = data.dialogTitleSeparator;
         }
         if (data.layoutManagerComponent) {
             this.formLayoutManager = data.layoutManagerComponent;
         }
     }
     ngAfterViewInit() {
-        if (this.contentDirective && this.componentFactory) {
+        if (this.contentDirective && this.component) {
             const viewContainerRef = this.contentDirective.viewContainerRef;
             viewContainerRef.clear();
-            viewContainerRef.createComponent(this.componentFactory);
+            viewContainerRef.createComponent(this.component);
         }
     }
     updateNavigation(data) {
-        let label = this.formLayoutManager.getLabelFromData(data);
-        if (label && label.length) {
-            label = ': ' + label;
-        }
-        this.label = label;
+        this.label = this.formLayoutManager.getLabelFromData(data);
     }
     updateActiveData(data) {
         this.data = Object.assign(this.data, data);
@@ -6374,14 +6376,14 @@ class OFormLayoutDialogComponent {
         return 'dialog';
     }
 }
-OFormLayoutDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: i0.Injector }, { token: i0.ComponentFactoryResolver }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-OFormLayoutDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OFormLayoutDialogComponent, selector: "o-form-layout-dialog", host: { properties: { "class.o-form-layout-dialog": "true" } }, viewQueries: [{ propertyName: "contentDirective", first: true, predicate: OFormLayoutManagerContentDirective, descendants: true }], ngImport: i0, template: "<div fxLayout=\"row\" fxLayoutAlign=\"space-between center\" class=\"title-container\" mat-dialog-title>\n  <span fxFlex fxLayoutAlign=\"center center\" > {{ (title || 'LAYOUT_MANANGER.DIALOG_TITLE') | oTranslate }}{{ label }} </span>\n  <mat-icon (click)=\"closeDialog()\" svgIcon=\"ontimize:close\"></mat-icon>\n</div>\n\n<div mat-dialog-content class=\"form-layout-dialog-container\">\n  <ng-template o-form-layout-manager-content></ng-template>\n</div>", styles: [".o-form-layout-dialog-overlay{width:65%;height:90%}.o-form-layout-dialog-overlay .title-container{cursor:default}.o-form-layout-dialog-overlay .title-container .mat-icon{cursor:pointer}.o-form-layout-dialog-overlay .mat-mdc-dialog-container{overflow:hidden}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .mat-mdc-dialog-content.form-layout-dialog-container{display:block;padding-top:16px;margin:0;max-height:calc(100% - 78px);height:100%}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .o-form-layout-dialog o-form-toolbar .mat-toolbar{padding:0}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .o-form-layout-dialog .o-form form.inner-form{position:relative;margin-top:0}\n"], dependencies: [{ kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: OFormLayoutManagerContentDirective, selector: "[o-form-layout-manager-content]", inputs: ["index"] }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], encapsulation: i0.ViewEncapsulation.None });
+OFormLayoutDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: i0.Injector }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+OFormLayoutDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OFormLayoutDialogComponent, selector: "o-form-layout-dialog", host: { properties: { "class.o-form-layout-dialog": "true" } }, viewQueries: [{ propertyName: "contentDirective", first: true, predicate: OFormLayoutManagerContentDirective, descendants: true }], ngImport: i0, template: "<div fxLayout=\"row\" fxLayoutAlign=\"space-between center\" class=\"title-container\" mat-dialog-title>\n  <span fxFlex fxLayoutAlign=\"center center\"> {{ title | oTranslate }} <span *ngIf=\"title?.length>0\">{{dialogTitleSeparator}}&nbsp;</span>{{ label }}</span>\n  <mat-icon (click)=\"closeDialog()\" svgIcon=\"ontimize:close\"></mat-icon>\n</div>\n\n<div mat-dialog-content class=\"form-layout-dialog-container\">\n  <ng-template o-form-layout-manager-content></ng-template>\n</div>", styles: [".o-form-layout-dialog-overlay{width:65%;height:90%}.o-form-layout-dialog-overlay .title-container{cursor:default}.o-form-layout-dialog-overlay .title-container .mat-icon{cursor:pointer}.o-form-layout-dialog-overlay .mat-mdc-dialog-container{overflow:hidden}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .mat-mdc-dialog-content.form-layout-dialog-container{display:block;padding-top:16px;margin:0;max-height:calc(100% - 78px);height:100%}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .o-form-layout-dialog o-form-toolbar .mat-toolbar{padding:0}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .o-form-layout-dialog .o-form form.inner-form{position:relative;margin-top:0}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: OFormLayoutManagerContentDirective, selector: "[o-form-layout-manager-content]", inputs: ["index"] }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'o-form-layout-dialog', encapsulation: ViewEncapsulation.None, host: {
                         '[class.o-form-layout-dialog]': 'true'
-                    }, template: "<div fxLayout=\"row\" fxLayoutAlign=\"space-between center\" class=\"title-container\" mat-dialog-title>\n  <span fxFlex fxLayoutAlign=\"center center\" > {{ (title || 'LAYOUT_MANANGER.DIALOG_TITLE') | oTranslate }}{{ label }} </span>\n  <mat-icon (click)=\"closeDialog()\" svgIcon=\"ontimize:close\"></mat-icon>\n</div>\n\n<div mat-dialog-content class=\"form-layout-dialog-container\">\n  <ng-template o-form-layout-manager-content></ng-template>\n</div>", styles: [".o-form-layout-dialog-overlay{width:65%;height:90%}.o-form-layout-dialog-overlay .title-container{cursor:default}.o-form-layout-dialog-overlay .title-container .mat-icon{cursor:pointer}.o-form-layout-dialog-overlay .mat-mdc-dialog-container{overflow:hidden}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .mat-mdc-dialog-content.form-layout-dialog-container{display:block;padding-top:16px;margin:0;max-height:calc(100% - 78px);height:100%}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .o-form-layout-dialog o-form-toolbar .mat-toolbar{padding:0}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .o-form-layout-dialog .o-form form.inner-form{position:relative;margin-top:0}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$1.MatDialogRef }, { type: i0.Injector }, { type: i0.ComponentFactoryResolver }, { type: undefined, decorators: [{
+                    }, template: "<div fxLayout=\"row\" fxLayoutAlign=\"space-between center\" class=\"title-container\" mat-dialog-title>\n  <span fxFlex fxLayoutAlign=\"center center\"> {{ title | oTranslate }} <span *ngIf=\"title?.length>0\">{{dialogTitleSeparator}}&nbsp;</span>{{ label }}</span>\n  <mat-icon (click)=\"closeDialog()\" svgIcon=\"ontimize:close\"></mat-icon>\n</div>\n\n<div mat-dialog-content class=\"form-layout-dialog-container\">\n  <ng-template o-form-layout-manager-content></ng-template>\n</div>", styles: [".o-form-layout-dialog-overlay{width:65%;height:90%}.o-form-layout-dialog-overlay .title-container{cursor:default}.o-form-layout-dialog-overlay .title-container .mat-icon{cursor:pointer}.o-form-layout-dialog-overlay .mat-mdc-dialog-container{overflow:hidden}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .mat-mdc-dialog-content.form-layout-dialog-container{display:block;padding-top:16px;margin:0;max-height:calc(100% - 78px);height:100%}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .o-form-layout-dialog o-form-toolbar .mat-toolbar{padding:0}.o-form-layout-dialog-overlay .mat-mdc-dialog-container .o-form-layout-dialog .o-form form.inner-form{position:relative;margin-top:0}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1$1.MatDialogRef }, { type: i0.Injector }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }]; }, propDecorators: { contentDirective: [{
@@ -6697,7 +6699,7 @@ class OFormNavigationClass {
             }
             else {
                 extras.relativeTo = this.actRoute;
-                route = ['../' + Codes.DEFAULT_INSERT_ROUTE];
+                route = [Codes.DEFAULT_INSERT_ROUTE];
                 if (this.formLayoutManager && this.formLayoutManager.isTabMode()) {
                     extras.queryParams = {};
                     extras.queryParams[Codes.INSERTION_MODE] = 'true';
@@ -11702,6 +11704,14 @@ const DEFAULT_OUTPUTS_O_BUTTON_TOGGLE_GROUP = [
     'onChange'
 ];
 class OButtonToggleGroupComponent {
+    constructor() {
+        this.DEFAULT_INPUTS_O_BUTTON_TOGGLE_GROUP = DEFAULT_INPUTS_O_BUTTON_TOGGLE_GROUP;
+        this.DEFAULT_OUTPUTS_O_BUTTON_TOGGLE_GROUP = DEFAULT_OUTPUTS_O_BUTTON_TOGGLE_GROUP;
+        this._enabled = true;
+        this.layout = 'row';
+        this.multiple = false;
+        this.onChange = new EventEmitter();
+    }
     get enabled() {
         if (this._innerButtonToggleGroup instanceof MatButtonToggleGroup) {
             return !this._innerButtonToggleGroup.disabled;
@@ -11714,15 +11724,6 @@ class OButtonToggleGroupComponent {
             this._innerButtonToggleGroup.disabled = !val;
         }
     }
-    constructor(resolver) {
-        this.resolver = resolver;
-        this.DEFAULT_INPUTS_O_BUTTON_TOGGLE_GROUP = DEFAULT_INPUTS_O_BUTTON_TOGGLE_GROUP;
-        this.DEFAULT_OUTPUTS_O_BUTTON_TOGGLE_GROUP = DEFAULT_OUTPUTS_O_BUTTON_TOGGLE_GROUP;
-        this._enabled = true;
-        this.layout = 'row';
-        this.multiple = false;
-        this.onChange = new EventEmitter();
-    }
     ngOnInit() {
         if (!Util.isDefined(this.name)) {
             this.name = this.oattr;
@@ -11733,10 +11734,9 @@ class OButtonToggleGroupComponent {
         this._children.changes.subscribe(() => this.buildChildren());
     }
     buildChildren() {
-        const factory = this.resolver.resolveComponentFactory(OButtonToggleComponent);
         this._viewContainerRef.clear();
         const childList = this._children.map((child) => {
-            const componentRef = this._viewContainerRef.createComponent(factory);
+            const componentRef = this._viewContainerRef.createComponent(OButtonToggleComponent);
             componentRef.instance.oattr = child.oattr;
             componentRef.instance.label = child.label;
             componentRef.instance.icon = child.icon;
@@ -11759,7 +11759,7 @@ class OButtonToggleGroupComponent {
         this._innerButtonToggleGroup.value = val;
     }
 }
-OButtonToggleGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OButtonToggleGroupComponent, deps: [{ token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+OButtonToggleGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OButtonToggleGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 OButtonToggleGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OButtonToggleGroupComponent, selector: "o-button-toggle-group", inputs: { oattr: ["attr", "oattr"], name: "name", enabled: "enabled", layout: "layout", multiple: "multiple", value: "value" }, outputs: { onChange: "onChange" }, host: { properties: { "class.o-button-toggle-group": "true" } }, queries: [{ propertyName: "_children", predicate: i0.forwardRef(function () { return OButtonToggleComponent; }) }], viewQueries: [{ propertyName: "_innerButtonToggleGroup", first: true, predicate: MatButtonToggleGroup, descendants: true }, { propertyName: "_viewContainerRef", first: true, predicate: ["childContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<mat-button-toggle-group [disabled]=\"!enabled\" [name]=\"name\" [value]=\"value\" [vertical]=\"layout==='column'\" [multiple]=\"multiple\"\n  (change)=\"onChange.emit($event)\">\n  <ng-container #childContainer></ng-container>\n</mat-button-toggle-group>\n", dependencies: [{ kind: "directive", type: i2$1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }], encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     BooleanInputConverter(),
@@ -11770,7 +11770,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             args: [{ selector: 'o-button-toggle-group', inputs: DEFAULT_INPUTS_O_BUTTON_TOGGLE_GROUP, outputs: DEFAULT_OUTPUTS_O_BUTTON_TOGGLE_GROUP, encapsulation: ViewEncapsulation.None, host: {
                         '[class.o-button-toggle-group]': 'true'
                     }, template: "<mat-button-toggle-group [disabled]=\"!enabled\" [name]=\"name\" [value]=\"value\" [vertical]=\"layout==='column'\" [multiple]=\"multiple\"\n  (change)=\"onChange.emit($event)\">\n  <ng-container #childContainer></ng-container>\n</mat-button-toggle-group>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ComponentFactoryResolver }]; }, propDecorators: { multiple: [], _innerButtonToggleGroup: [{
+        }], propDecorators: { multiple: [], _innerButtonToggleGroup: [{
                 type: ViewChild,
                 args: [MatButtonToggleGroup]
             }], _viewContainerRef: [{
@@ -11920,11 +11920,10 @@ class OCardMenuItemComponent {
     get detailComponentContainer() {
         return this._detailComponentContainer;
     }
-    constructor(injector, router, actRoute, resolver, cd, elRef) {
+    constructor(injector, router, actRoute, cd, elRef) {
         this.injector = injector;
         this.router = router;
         this.actRoute = actRoute;
-        this.resolver = resolver;
         this.cd = cd;
         this.elRef = elRef;
         this.disabledButton = false;
@@ -11938,8 +11937,7 @@ class OCardMenuItemComponent {
     }
     ngAfterViewInit() {
         if (this.detailComponentContainer && this.detailComponent) {
-            const factory = this.resolver.resolveComponentFactory(this.detailComponent);
-            const ref = this.detailComponentContainer.createComponent(factory);
+            const ref = this.detailComponentContainer.createComponent(this.detailComponent);
             if (this.detailComponentInputs && ref.instance) {
                 const keys = Object.keys(this.detailComponentInputs);
                 for (let i = 0, len = keys.length; i < len; i++) {
@@ -11989,7 +11987,7 @@ class OCardMenuItemComponent {
         }
     }
 }
-OCardMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OCardMenuItemComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i0.ComponentFactoryResolver }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+OCardMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OCardMenuItemComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
 OCardMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OCardMenuItemComponent, selector: "o-card-menu-item", inputs: { title: "title", image: "image", icon: "icon", tooltip: "tooltip", buttonText: ["button-text", "buttonText"], disabledButton: ["disabled-button", "disabledButton"], mainContainerLayout: ["main-container-layout", "mainContainerLayout"], secondaryContainerLayout: ["secondary-container-layout", "secondaryContainerLayout"], route: "route", detailComponent: ["detail-component", "detailComponent"], detailComponentInputs: ["detail-component-inputs", "detailComponentInputs"], action: "action" }, host: { properties: { "class.o-card-menu-item": "true", "class.mat-elevation-z1": "true", "class.compact": "!showSecondaryContainer" } }, queries: [{ propertyName: "secondaryContent", predicate: [".secondary-container"] }], viewQueries: [{ propertyName: "detailComponentContainer", first: true, predicate: ["menuCardContent"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div class=\"o-card-menu-item-content\" (click)=\"onClick()\" fxLayout=\"column\" fxFill fxLayoutAlign=\"space-between center\">\n\n  <div *ngIf=\"showSecondaryContainer\" class=\"o-card-menu-item-secondary\" fxFlex=\"50\" [fxLayout]=\"secondaryContainerLayout\"\n    fxLayoutAlign=\"space-around center\">\n    <ng-content select=\".secondary-container\"></ng-content>\n    <ng-container #menuCardContent *ngIf=\"detailComponent\">\n    </ng-container>\n  </div>\n\n  <div class=\"o-card-menu-item-main\" fxFlex=\"{{ showSecondaryContainer ? '45' : '80' }}\" [fxLayout]=\"mainContainerLayout\"\n    fxLayoutAlign=\"space-between center\">\n    <div *ngIf=\"useImage() || useIcon()\" fxFlex=\"80\" fxLayout=\"column\" fxLayoutAlign=\"center center\" class=\"o-card-menu-item-image-container\">\n      <img *ngIf=\"useImage()\" [src]=\"image\" alt=\"card image\"/>\n      <mat-icon *ngIf=\"useIcon()\" class=\"o-card-menu-item-icon\" fxLayoutAlign=\"center center\">{{ icon }}</mat-icon>\n    </div>\n\n    <div class=\"o-card-menu-item-title\" fxFlex=\"20\" fxLayout=\"column\" fxLayoutAlign=\"center center\" *ngIf=\"title !== undefined\">{{\n      title | oTranslate }}</div>\n\n    <mat-icon class=\"o-card-menu-item-info\" matTooltip=\"{{ tooltip | oTranslate }}\" *ngIf=\"tooltip\" svgIcon=\"ontimize:info_outline\"></mat-icon>\n\n    <ng-content select=\".main-container\"></ng-content>\n\n    <button type=\"button\" *ngIf=\"buttonText !== undefined\" [disabled]=\"disabledButton\" (click)=\"onButtonClick()\" mat-button>\n      {{ buttonText | oTranslate }}</button>\n  </div>\n\n\n</div>\n", styles: [".o-card-menu-item{border-radius:4px}.o-card-menu-item .o-card-menu-item-content{padding:12px 18px}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-main,.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-secondary{width:100%}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-secondary{padding-bottom:18px}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-image-container{width:100%}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-image-container .o-card-menu-item-icon{width:100%;height:100%;font-size:5em}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-image-container img{max-width:100%;max-height:100%}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-title{margin:8px 0}.o-card-menu-item .o-card-menu-item-content .mat-mdc-button,.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-title{font-weight:600}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-main{position:relative;padding:16px;border-radius:4px}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-icon,.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-title{cursor:default}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-info{cursor:default;position:absolute;top:16px;right:16px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     BooleanInputConverter(),
@@ -12002,7 +12000,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                         '[class.mat-elevation-z1]': 'true',
                         '[class.compact]': '!showSecondaryContainer'
                     }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"o-card-menu-item-content\" (click)=\"onClick()\" fxLayout=\"column\" fxFill fxLayoutAlign=\"space-between center\">\n\n  <div *ngIf=\"showSecondaryContainer\" class=\"o-card-menu-item-secondary\" fxFlex=\"50\" [fxLayout]=\"secondaryContainerLayout\"\n    fxLayoutAlign=\"space-around center\">\n    <ng-content select=\".secondary-container\"></ng-content>\n    <ng-container #menuCardContent *ngIf=\"detailComponent\">\n    </ng-container>\n  </div>\n\n  <div class=\"o-card-menu-item-main\" fxFlex=\"{{ showSecondaryContainer ? '45' : '80' }}\" [fxLayout]=\"mainContainerLayout\"\n    fxLayoutAlign=\"space-between center\">\n    <div *ngIf=\"useImage() || useIcon()\" fxFlex=\"80\" fxLayout=\"column\" fxLayoutAlign=\"center center\" class=\"o-card-menu-item-image-container\">\n      <img *ngIf=\"useImage()\" [src]=\"image\" alt=\"card image\"/>\n      <mat-icon *ngIf=\"useIcon()\" class=\"o-card-menu-item-icon\" fxLayoutAlign=\"center center\">{{ icon }}</mat-icon>\n    </div>\n\n    <div class=\"o-card-menu-item-title\" fxFlex=\"20\" fxLayout=\"column\" fxLayoutAlign=\"center center\" *ngIf=\"title !== undefined\">{{\n      title | oTranslate }}</div>\n\n    <mat-icon class=\"o-card-menu-item-info\" matTooltip=\"{{ tooltip | oTranslate }}\" *ngIf=\"tooltip\" svgIcon=\"ontimize:info_outline\"></mat-icon>\n\n    <ng-content select=\".main-container\"></ng-content>\n\n    <button type=\"button\" *ngIf=\"buttonText !== undefined\" [disabled]=\"disabledButton\" (click)=\"onButtonClick()\" mat-button>\n      {{ buttonText | oTranslate }}</button>\n  </div>\n\n\n</div>\n", styles: [".o-card-menu-item{border-radius:4px}.o-card-menu-item .o-card-menu-item-content{padding:12px 18px}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-main,.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-secondary{width:100%}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-secondary{padding-bottom:18px}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-image-container{width:100%}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-image-container .o-card-menu-item-icon{width:100%;height:100%;font-size:5em}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-image-container img{max-width:100%;max-height:100%}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-title{margin:8px 0}.o-card-menu-item .o-card-menu-item-content .mat-mdc-button,.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-title{font-weight:600}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-main{position:relative;padding:16px;border-radius:4px}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-icon,.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-title{cursor:default}.o-card-menu-item .o-card-menu-item-content .o-card-menu-item-info{cursor:default;position:absolute;top:16px;right:16px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.Router }, { type: i1.ActivatedRoute }, { type: i0.ComponentFactoryResolver }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { disabledButton: [], detailComponentContainer: [{
+        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.Router }, { type: i1.ActivatedRoute }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { disabledButton: [], detailComponentContainer: [{
                 type: ViewChild,
                 args: ['menuCardContent', { read: ViewContainerRef }]
             }], secondaryContent: [{
@@ -13781,9 +13779,8 @@ const DEFAULT_OUTPUTS_O_FORM_LAYOUT_TABGROUP = [
     'onCloseTab'
 ];
 class OFormLayoutTabGroupComponent {
-    constructor(injector, componentFactoryResolver, location, elementRef, formLayoutManager) {
+    constructor(injector, location, elementRef, formLayoutManager) {
         this.injector = injector;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.location = location;
         this.elementRef = elementRef;
         this.formLayoutManager = formLayoutManager;
@@ -13954,10 +13951,9 @@ class OFormLayoutTabGroupComponent {
     }
     createTabComponent(tabData, content) {
         const component = tabData.component;
-        const componentFactory = this.componentFactoryResolver.resolveComponentFactory(component);
         const viewContainerRef = content.viewContainerRef;
         viewContainerRef.clear();
-        viewContainerRef.createComponent(componentFactory);
+        viewContainerRef.createComponent(component);
         tabData.rendered = true;
     }
     getFormCacheData() {
@@ -14114,7 +14110,7 @@ class OFormLayoutTabGroupComponent {
         return this.data[this.data.length - 1] ? this.data[this.data.length - 1].id : this.data.length.toString();
     }
 }
-OFormLayoutTabGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutTabGroupComponent, deps: [{ token: i0.Injector }, { token: i0.ComponentFactoryResolver }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: forwardRef(() => OFormLayoutManagerBase) }], target: i0.ɵɵFactoryTarget.Component });
+OFormLayoutTabGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutTabGroupComponent, deps: [{ token: i0.Injector }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: forwardRef(() => OFormLayoutManagerBase) }], target: i0.ɵɵFactoryTarget.Component });
 OFormLayoutTabGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OFormLayoutTabGroupComponent, selector: "o-form-layout-tabgroup", inputs: { title: "title", options: "options", stretchTabs: ["stretch-tabs", "stretchTabs"] }, outputs: { onMainTabSelected: "onMainTabSelected", onSelectedTabChange: "onSelectedTabChange", onCloseTab: "onCloseTab" }, host: { properties: { "class.o-form-layout-tabgroup": "true" } }, viewQueries: [{ propertyName: "tabGroup", first: true, predicate: ["tabGroup"], descendants: true }, { propertyName: "tabsDirectives", predicate: OFormLayoutManagerContentDirective, descendants: true }], ngImport: i0, template: "<mat-tab-group #tabGroup oTabGroup=\"ontimize\" fxFill (selectedTabChange)=\"onTabSelectChange($event)\" [color]=\"color\"\n  [backgroundColor]=\"backgroundColor\" [headerPosition]=\"headerPosition\" [@.disabled]=\"disableAnimation\" [mat-stretch-tabs]=\"stretchTabs\">\n  <mat-tab label=\"{{ mainTabTitle | oTranslate }}\">\n    <ng-content></ng-content>\n  </mat-tab>\n  <mat-tab *ngFor=\"let tabData of data; let i = index\">\n    <ng-template mat-tab-label>\n      <span class=\"tab-label\" [class.modified]=\"isTabDataModified(tabData)\">\n        <ng-container *ngIf=\"icon && isIconPositionLeft\">\n          <mat-icon>{{ icon }}</mat-icon>\n        </ng-container>\n        <ng-container *ngIf=\"templateMatTabLabel && tabData.formDataByLabelColumns && !tabData.insertionMode \">\n          <ng-container *ngTemplateOutlet=\"templateMatTabLabel;context:{$implicit:tabData.formDataByLabelColumns}\">\n          </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!templateMatTabLabel || tabData.insertionMode\">\n          {{ tabData.label }}\n        </ng-container>\n        <ng-container *ngIf=\"icon && !isIconPositionLeft\">\n          <mat-icon>{{ icon }}</mat-icon>\n        </ng-container>\n        <span class=\"gradient-layer\"></span>\n      </span>\n      <mat-icon (click)=\"closeTab(i)\" svgIcon=\"ontimize:close\"></mat-icon>\n    </ng-template>\n    <ng-template o-form-layout-manager-content [index]=\"i\"></ng-template>\n  </mat-tab>\n</mat-tab-group>\n<div *ngIf=\"showLoading | async\" class=\"spinner-container\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n  <mat-progress-spinner mode=\"indeterminate\" strokeWidth=\"3\"></mat-progress-spinner>\n</div>\n", styles: [".o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab span.mdc-tab__ripple{display:none}.o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab span.tab-label{width:100%;max-width:120px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab span.tab-label.modified{font-weight:700}.o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab span.tab-label.modified:after{content:\"*\"}.o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab .mat-icon{height:14px;width:14px;font-size:8px;margin-left:6px;vertical-align:middle}.o-form-layout-tabgroup .mat-mdc-tab-group .mat-mdc-tab-body-wrapper{flex:1 1 auto}.o-form-layout-tabgroup .mat-mdc-tab-group o-form-toolbar{padding:0;top:0px!important}.o-form-layout-tabgroup .mat-mdc-tab-group o-form-toolbar .mat-toolbar{box-shadow:none;border-radius:0}.o-form-layout-tabgroup .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "directive", type: OTabGroupDirective, selector: "[oTabGroup]", inputs: ["oTabGroup"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i6.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i6.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i6.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "directive", type: OFormLayoutManagerContentDirective, selector: "[o-form-layout-manager-content]", inputs: ["index"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     BooleanInputConverter(),
@@ -14125,7 +14121,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             args: [{ selector: 'o-form-layout-tabgroup', inputs: DEFAULT_INPUTS_O_FORM_LAYOUT_TABGROUP, outputs: DEFAULT_OUTPUTS_O_FORM_LAYOUT_TABGROUP, encapsulation: ViewEncapsulation.None, host: {
                         '[class.o-form-layout-tabgroup]': 'true'
                     }, template: "<mat-tab-group #tabGroup oTabGroup=\"ontimize\" fxFill (selectedTabChange)=\"onTabSelectChange($event)\" [color]=\"color\"\n  [backgroundColor]=\"backgroundColor\" [headerPosition]=\"headerPosition\" [@.disabled]=\"disableAnimation\" [mat-stretch-tabs]=\"stretchTabs\">\n  <mat-tab label=\"{{ mainTabTitle | oTranslate }}\">\n    <ng-content></ng-content>\n  </mat-tab>\n  <mat-tab *ngFor=\"let tabData of data; let i = index\">\n    <ng-template mat-tab-label>\n      <span class=\"tab-label\" [class.modified]=\"isTabDataModified(tabData)\">\n        <ng-container *ngIf=\"icon && isIconPositionLeft\">\n          <mat-icon>{{ icon }}</mat-icon>\n        </ng-container>\n        <ng-container *ngIf=\"templateMatTabLabel && tabData.formDataByLabelColumns && !tabData.insertionMode \">\n          <ng-container *ngTemplateOutlet=\"templateMatTabLabel;context:{$implicit:tabData.formDataByLabelColumns}\">\n          </ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!templateMatTabLabel || tabData.insertionMode\">\n          {{ tabData.label }}\n        </ng-container>\n        <ng-container *ngIf=\"icon && !isIconPositionLeft\">\n          <mat-icon>{{ icon }}</mat-icon>\n        </ng-container>\n        <span class=\"gradient-layer\"></span>\n      </span>\n      <mat-icon (click)=\"closeTab(i)\" svgIcon=\"ontimize:close\"></mat-icon>\n    </ng-template>\n    <ng-template o-form-layout-manager-content [index]=\"i\"></ng-template>\n  </mat-tab>\n</mat-tab-group>\n<div *ngIf=\"showLoading | async\" class=\"spinner-container\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n  <mat-progress-spinner mode=\"indeterminate\" strokeWidth=\"3\"></mat-progress-spinner>\n</div>\n", styles: [".o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab span.mdc-tab__ripple{display:none}.o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab span.tab-label{width:100%;max-width:120px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab span.tab-label.modified{font-weight:700}.o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab span.tab-label.modified:after{content:\"*\"}.o-form-layout-tabgroup .mat-mdc-tab-group .mdc-tab .mat-icon{height:14px;width:14px;font-size:8px;margin-left:6px;vertical-align:middle}.o-form-layout-tabgroup .mat-mdc-tab-group .mat-mdc-tab-body-wrapper{flex:1 1 auto}.o-form-layout-tabgroup .mat-mdc-tab-group o-form-toolbar{padding:0;top:0px!important}.o-form-layout-tabgroup .mat-mdc-tab-group o-form-toolbar .mat-toolbar{box-shadow:none;border-radius:0}.o-form-layout-tabgroup .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ComponentFactoryResolver }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: OFormLayoutManagerBase, decorators: [{
+        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: OFormLayoutManagerBase, decorators: [{
                     type: Inject,
                     args: [forwardRef(() => OFormLayoutManagerBase)]
                 }] }]; }, propDecorators: { stretchTabs: [], tabGroup: [{
@@ -14146,10 +14142,9 @@ class OFormLayoutSplitPaneComponent {
             this._options = value;
         }
     }
-    constructor(injector, elementRef, componentFactoryResolver, renderer, formLayoutManager) {
+    constructor(injector, elementRef, renderer, formLayoutManager) {
         this.injector = injector;
         this.elementRef = elementRef;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.renderer = renderer;
         this.formLayoutManager = formLayoutManager;
         this.showLoading = new BehaviorSubject(false);
@@ -14201,11 +14196,11 @@ class OFormLayoutSplitPaneComponent {
             this.contentDirective.viewContainerRef.clear();
             return;
         }
-        const componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.data.component);
-        if (this.contentDirective && componentFactory) {
+        const component = this.data.component;
+        if (this.contentDirective && component) {
             const viewContainerRef = this.contentDirective.viewContainerRef;
             viewContainerRef.clear();
-            viewContainerRef.createComponent(componentFactory);
+            viewContainerRef.createComponent(component);
         }
     }
     getDataToStore() {
@@ -14271,14 +14266,14 @@ class OFormLayoutSplitPaneComponent {
         return 'split-pane';
     }
 }
-OFormLayoutSplitPaneComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutSplitPaneComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Renderer2 }, { token: forwardRef(() => OFormLayoutManagerBase) }], target: i0.ɵɵFactoryTarget.Component });
+OFormLayoutSplitPaneComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutSplitPaneComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: forwardRef(() => OFormLayoutManagerBase) }], target: i0.ɵɵFactoryTarget.Component });
 OFormLayoutSplitPaneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OFormLayoutSplitPaneComponent, selector: "o-form-layout-split-pane", inputs: { options: "options" }, host: { properties: { "class.o-form-layout-split-pane": "true" } }, viewQueries: [{ propertyName: "contentDirective", first: true, predicate: OFormLayoutManagerContentDirective, descendants: true }, { propertyName: "mainWrapper", first: true, predicate: ["mainWrapper"], descendants: true, read: ElementRef }, { propertyName: "detailWrapper", first: true, predicate: ["detailWrapper"], descendants: true, read: ElementRef }], ngImport: i0, template: "\n  <div fxLayout=\"row\" class=\"o-split-pane-row-wrapper\">\n    <div #mainWrapper fxFlex fxLayout=\"row\" class=\"o-split-pane-main-content\">\n      <ng-content></ng-content>\n    </div>\n\n    <div #detailWrapper class=\"o-split-pane-content-wrapper mwlResizable\" mwlResizable [enableGhostResize]=\"true\"\n      (resizeEnd)=\"onResizeEnd('width', $event, detailWrapper)\">\n\n      <div class=\"o-split-pane-resize-handle\" mwlResizeHandle [resizeEdges]=\"{ left: true }\">\n        <div class=\"o-split-pane-resize-border\">\n          <div></div>\n        </div>\n      </div>\n\n      <div class=\"o-split-pane-secondary-content\" fxLayout=\"column\" fxLayoutAlign=\"center stretch\" fxFlex>\n        <ng-template o-form-layout-manager-content></ng-template>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"showLoading | async\" class=\"spinner-container\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n    <mat-progress-spinner mode=\"indeterminate\" strokeWidth=\"3\"></mat-progress-spinner>\n  </div>\n", styles: [".o-form-layout-split-pane .o-split-pane-row-wrapper{height:100%}.o-form-layout-split-pane .o-split-pane-content-wrapper{z-index:1000;min-width:15%}.o-form-layout-split-pane .o-split-pane-content-wrapper>.o-split-pane-resize-handle{width:8px;position:relative;cursor:col-resize}.o-form-layout-split-pane .o-split-pane-content-wrapper>.o-split-pane-resize-handle>.o-split-pane-resize-border{position:absolute;height:100%;width:2px;left:3px;background-color:#929292}.o-form-layout-split-pane .o-split-pane-content-wrapper>.o-split-pane-resize-handle>.o-split-pane-resize-border>div{width:4px;height:32px;position:absolute;top:calc(50% - 16px);left:-1px;background-color:#666}.o-form-layout-split-pane .o-split-pane-content-wrapper:not(.resized){width:50%}.o-form-layout-split-pane .mwlResizable{box-sizing:border-box}.o-form-layout-split-pane .o-split-pane-secondary-content{padding:0 8px;overflow:auto}.o-form-layout-split-pane .o-split-pane-secondary-content>*{height:100%}.o-form-layout-split-pane .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i5$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i4$2.ResizableDirective, selector: "[mwlResizable]", inputs: ["resizeEdges", "enableGhostResize", "resizeSnapGrid", "resizeCursors", "resizeCursorPrecision", "ghostElementPositioning", "allowNegativeResizes", "mouseMoveThrottleMS", "validateResize"], outputs: ["resizeStart", "resizing", "resizeEnd"] }, { kind: "directive", type: i4$2.ResizeHandleDirective, selector: "[mwlResizeHandle]", inputs: ["resizeEdges"] }, { kind: "directive", type: OFormLayoutManagerContentDirective, selector: "[o-form-layout-manager-content]", inputs: ["index"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutSplitPaneComponent, decorators: [{
             type: Component,
             args: [{ selector: 'o-form-layout-split-pane', inputs: DEFAULT_INPUTS_O_FORM_LAYOUT_SPLIT_PANE, outputs: DEFAULT_OUTPUTS_O_FORM_LAYOUT_SPLIT_PANE, encapsulation: ViewEncapsulation.None, host: {
                         '[class.o-form-layout-split-pane]': 'true'
                     }, template: "\n  <div fxLayout=\"row\" class=\"o-split-pane-row-wrapper\">\n    <div #mainWrapper fxFlex fxLayout=\"row\" class=\"o-split-pane-main-content\">\n      <ng-content></ng-content>\n    </div>\n\n    <div #detailWrapper class=\"o-split-pane-content-wrapper mwlResizable\" mwlResizable [enableGhostResize]=\"true\"\n      (resizeEnd)=\"onResizeEnd('width', $event, detailWrapper)\">\n\n      <div class=\"o-split-pane-resize-handle\" mwlResizeHandle [resizeEdges]=\"{ left: true }\">\n        <div class=\"o-split-pane-resize-border\">\n          <div></div>\n        </div>\n      </div>\n\n      <div class=\"o-split-pane-secondary-content\" fxLayout=\"column\" fxLayoutAlign=\"center stretch\" fxFlex>\n        <ng-template o-form-layout-manager-content></ng-template>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"showLoading | async\" class=\"spinner-container\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n    <mat-progress-spinner mode=\"indeterminate\" strokeWidth=\"3\"></mat-progress-spinner>\n  </div>\n", styles: [".o-form-layout-split-pane .o-split-pane-row-wrapper{height:100%}.o-form-layout-split-pane .o-split-pane-content-wrapper{z-index:1000;min-width:15%}.o-form-layout-split-pane .o-split-pane-content-wrapper>.o-split-pane-resize-handle{width:8px;position:relative;cursor:col-resize}.o-form-layout-split-pane .o-split-pane-content-wrapper>.o-split-pane-resize-handle>.o-split-pane-resize-border{position:absolute;height:100%;width:2px;left:3px;background-color:#929292}.o-form-layout-split-pane .o-split-pane-content-wrapper>.o-split-pane-resize-handle>.o-split-pane-resize-border>div{width:4px;height:32px;position:absolute;top:calc(50% - 16px);left:-1px;background-color:#666}.o-form-layout-split-pane .o-split-pane-content-wrapper:not(.resized){width:50%}.o-form-layout-split-pane .mwlResizable{box-sizing:border-box}.o-form-layout-split-pane .o-split-pane-secondary-content{padding:0 8px;overflow:auto}.o-form-layout-split-pane .o-split-pane-secondary-content>*{height:100%}.o-form-layout-split-pane .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Renderer2 }, { type: OFormLayoutManagerBase, decorators: [{
+        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: OFormLayoutManagerBase, decorators: [{
                     type: Inject,
                     args: [forwardRef(() => OFormLayoutManagerBase)]
                 }] }]; }, propDecorators: { contentDirective: [{
@@ -14306,7 +14301,8 @@ const DEFAULT_INPUTS_O_FORM_LAYOUT_MANAGER = [
     'dialogHeight: dialog-height',
     'dialogMinHeight: dialog-min-height',
     'dialogMaxHeight dialog-max-height',
-    'dialogClass: dialog-class'
+    'dialogClass: dialog-class',
+    'dialogTitleSeparator: dialog-title-separator'
 ];
 const DEFAULT_OUTPUTS_O_FORM_LAYOUT_MANAGER = [
     'onMainTabSelected',
@@ -14369,6 +14365,9 @@ class OFormLayoutManagerComponent {
         if (value.hasOwnProperty('separator')) {
             this.separator = value['separator'];
         }
+        if (value.hasOwnProperty('dialogTitleSeparator')) {
+            this.dialogTitleSeparator = value['dialogTitleSeparator'];
+        }
     }
     get splitPaneOptions() {
         return this._splitPaneOptions;
@@ -14389,6 +14388,7 @@ class OFormLayoutManagerComponent {
         this._separator = ' ';
         this.storeState = true;
         this.dialogClass = '';
+        this.dialogTitleSeparator = ':';
         this.onMainTabSelected = new EventEmitter();
         this.onSelectedTabChange = new EventEmitter();
         this.onCloseTab = new EventEmitter();
@@ -14565,7 +14565,8 @@ class OFormLayoutManagerComponent {
             data: {
                 data: detailComp,
                 layoutManagerComponent: this,
-                title: dialogOptions.title || this.title,
+                title: (this.title || dialogOptions.title),
+                dialogTitleSeparator: this.dialogTitleSeparator
             },
             width: dialogOptions.width || this.dialogWidth,
             minWidth: dialogOptions.minWidth || this.dialogMinWidth,
@@ -14754,7 +14755,7 @@ OFormLayoutManagerComponent.DIALOG_MODE = 'dialog';
 OFormLayoutManagerComponent.TAB_MODE = 'tab';
 OFormLayoutManagerComponent.SPLIT_PANE_MODE = 'split-pane';
 OFormLayoutManagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutManagerComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i1$1.MatDialog }, { token: i0.ElementRef }, { token: OFormLayoutManagerBase, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
-OFormLayoutManagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OFormLayoutManagerComponent, selector: "o-form-layout-manager", inputs: { oattr: ["attr", "oattr"], mode: "mode", storeState: ["store-state", "storeState"], title: "title", labelColumns: ["label-columns", "labelColumns"], separator: "separator", titleDataOrigin: ["title-data-origin", "titleDataOrigin"], dialogWidth: ["dialog-width", "dialogWidth"], dialogMinWidth: ["dialog-min-width", "dialogMinWidth"], dialogMaxWidth: ["dialog-max-width", "dialogMaxWidth"], dialogHeight: ["dialog-height", "dialogHeight"], dialogMinHeight: ["dialog-min-height", "dialogMinHeight"], "dialogMaxHeight dialog-max-height": "dialogMaxHeight dialog-max-height", dialogClass: ["dialog-class", "dialogClass"] }, outputs: { onMainTabSelected: "onMainTabSelected", onSelectedTabChange: "onSelectedTabChange", onCloseTab: "onCloseTab" }, host: { listeners: { "window:beforeunload": "beforeunloadHandler()" }, properties: { "class.o-form-layout-manager": "true" } }, providers: [
+OFormLayoutManagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OFormLayoutManagerComponent, selector: "o-form-layout-manager", inputs: { oattr: ["attr", "oattr"], mode: "mode", storeState: ["store-state", "storeState"], title: "title", labelColumns: ["label-columns", "labelColumns"], separator: "separator", titleDataOrigin: ["title-data-origin", "titleDataOrigin"], dialogWidth: ["dialog-width", "dialogWidth"], dialogMinWidth: ["dialog-min-width", "dialogMinWidth"], dialogMaxWidth: ["dialog-max-width", "dialogMaxWidth"], dialogHeight: ["dialog-height", "dialogHeight"], dialogMinHeight: ["dialog-min-height", "dialogMinHeight"], "dialogMaxHeight dialog-max-height": "dialogMaxHeight dialog-max-height", dialogClass: ["dialog-class", "dialogClass"], dialogTitleSeparator: ["dialog-title-separator", "dialogTitleSeparator"] }, outputs: { onMainTabSelected: "onMainTabSelected", onSelectedTabChange: "onSelectedTabChange", onCloseTab: "onCloseTab" }, host: { listeners: { "window:beforeunload": "beforeunloadHandler()" }, properties: { "class.o-form-layout-manager": "true" } }, providers: [
         ComponentStateServiceProvider,
         { provide: O_COMPONENT_STATE_SERVICE, useClass: OFormLayoutManagerComponentStateService },
         { provide: OFormLayoutManagerBase, useExisting: OFormLayoutManagerComponent }
@@ -15308,6 +15309,7 @@ class AbstractOServiceComponent extends AbstractOServiceBaseComponent {
         this.recursiveInsert = false;
         this._filterCaseSensitive = false;
         this._quickFilter = true;
+        this.quickFilterPlaceholder = '';
         this.onClick = new EventEmitter();
         this.onDoubleClick = new EventEmitter();
         this.onDataLoaded = new EventEmitter();
@@ -27291,12 +27293,12 @@ class OTableFilterByColumnDataDialogComponent {
     }
 }
 OTableFilterByColumnDataDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableFilterByColumnDataDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-OTableFilterByColumnDataDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableFilterByColumnDataDialogComponent, selector: "o-table-filter-by-column-data-dialog", host: { properties: { "class.o-filter-by-column-dialog": "true" } }, viewQueries: [{ propertyName: "filter", first: true, predicate: ["filter"], descendants: true }, { propertyName: "filterValueList", first: true, predicate: ["filterValueList"], descendants: true }], ngImport: i0, template: "<span mat-dialog-title>{{ 'TABLE.BUTTONS.FILTER_BY_COLUMN' | oTranslate }}: {{ column.title | oTranslate }}</span>\n<div mat-dialog-content fxLayout=\"row\" fxLayoutAlign=\"space-between stretch\" class=\"dialog-list-container\">\n  <div fxLayout=\"column\" class=\"content-wrapper\" [class.content-wrapper-fixed-dimension]=\"getFixedDimensionClass()\">\n    <mat-slide-toggle #customFilterSlide (change)=\"onSlideChange($event)\" [checked]=\"(isCustomFilter | async)\" *ngIf=\"isDefaultFilter | async\">\n      {{ 'TABLE.FILTER_BY_COLUMN.CUSTOM_FILTER' | oTranslate }}\n    </mat-slide-toggle>\n    <div fxFlex *ngIf=\"!(isCustomFilter | async);else customFilterTemplate\" fxLayout=\"column\">\n      <mat-form-field class=\"hinted\">\n        <mat-icon matPrefix svgIcon=\"ontimize:search\"></mat-icon>\n        <input matInput #filter placeholder=\"{{ 'TABLE.FILTER' | oTranslate }}\">\n        <mat-hint>{{ 'TABLE.FILTER_BY_COLUMN.HINT_STAR' | oTranslate }}</mat-hint>\n      </mat-form-field>\n      <div *ngIf=\"(listData | async).length > 0; else emptyListData\" fxLayout=\"row\" fxLayoutAlign=\"space-between start\">\n        <div fxLayout=\"row\" fxLayoutAlign=\"start start\">\n          <mat-checkbox (change)=\"onSelectAllChange($event)\" [checked]=\"areAllSelected()\" [indeterminate]=\"isIndeterminate()\" [disabled]=\"!listData\"\n            class=\"select-all-checkbox\">\n            {{ 'TABLE.FILTER_BY_COLUMN.CHECK_ALL' | oTranslate }}\n          </mat-checkbox>\n          <span *ngIf=\"!listData\" class=\"column-filter-empty-list\">\n            {{ 'TABLE.FILTER_BY_COLUMN.LIST_EMPTY_FILTER' | oTranslate }}\n          </span>\n        </div>\n        <button type=\"button\" mat-icon-button (click)=\"onClickSortValues()\">\n          <mat-icon [svgIcon]=\"getSortByAlphaIcon()\"></mat-icon>\n        </button>\n      </div>\n\n      <ng-template #emptyListData>\n        <span class=\"column-filter-empty-list\">\n          {{ 'TABLE.FILTER_BY_COLUMN.LIST_EMPTY' | oTranslate }}\n        </span>\n      </ng-template>\n\n      <mat-selection-list *ngIf=\"preloadValues || listData\" #filterValueList fxFlex fxLayout=\"column\" class=\"select-values-list\"\n        (selectionChange)=\"onSelect($event)\">\n        <mat-list-option *ngFor=\"let record of (listData | async); let i = index\" checkboxPosition=\"before\" [selected]=\"record.selected\"\n          [value]=\"record\">\n          <ng-container *ngIf=\"!column.renderer\">\n            {{ record.value || ('TABLE.FILTER_BY_COLUMN.EMPTY_VALUE' | oTranslate) }}\n          </ng-container>\n          <ng-template *ngIf=\"column.renderer\" [ngTemplateOutlet]=\"column.renderer.templateref\"\n            [ngTemplateOutletContext]=\"{ cellvalue: record.value, rowvalue: record.rowValue }\">\n          </ng-template>\n        </mat-list-option>\n      </mat-selection-list>\n    </div>\n  </div>\n</div>\n\n\n<mat-dialog-actions fxLayoutAlign=\"space-between center\">\n  <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"clearAction\" class=\"o-button-info\">\n    {{ 'TABLE.BUTTONS.FILTER_CLEAR' | oTranslate }} </button>\n  <span align=\"end\">\n    <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"cancelAction\" class=\"o-button-default cancel\">\n      {{ 'CANCEL' | oTranslate }} </button>\n    <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"acceptAction\" class=\"o-button-primary\">\n      {{ 'ACCEPT' | oTranslate }} </button>\n  </span>\n</mat-dialog-actions>\n\n<!-- TEMPLATE CUSTOM FILTER-->\n<ng-template #customFilterTemplate>\n  <div *ngIf=\"isTextType()\">\n    <mat-form-field fxFlex class=\"hinted\">\n      <input matInput #filterText [formControl]=\"fcText\" placeholder=\"{{ 'TABLE.FILTER' | oTranslate }}\">\n      <mat-hint>{{ 'TABLE.FILTER_BY_COLUMN.HINT_STAR' | oTranslate }}</mat-hint>\n      <button type=\"button\" matSuffix mat-icon-button (click)=\"clearValues()\">\n        <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n      </button>\n    </mat-form-field>\n  </div>\n  <div *ngIf=\"isNumericType()\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"12px\">\n    <mat-form-field>\n      <input matInput [formControl]=\"fcFrom\" placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.FROM' | oTranslate }}\">\n    </mat-form-field>\n    <mat-form-field>\n      <input matInput [formControl]=\"fcTo\" placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.TO' | oTranslate }}\">\n    </mat-form-field>\n    <button type=\"button\" mat-icon-button (click)=\"clearValues()\">\n      <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n    </button>\n  </div>\n  <div *ngIf=\"isDateType()\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"12px\">\n    <mat-form-field>\n      <input matInput [matDatepicker]=\"datepickerFrom\" [max]=\"fcTo.value\" [formControl]=\"fcFrom\"\n        placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.FROM' | oTranslate }}\">\n      <mat-datepicker-toggle matSuffix [for]=\"datepickerFrom\">\n        <mat-icon matDatepickerToggleIcon>today</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #datepickerFrom [startView]=\"getStartedViewDatepicker()\"></mat-datepicker>\n    </mat-form-field>\n    <mat-form-field>\n      <input matInput [matDatepicker]=\"datepickerTo\" [min]=\"fcFrom.value\" [formControl]=\"fcTo\"\n        placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.TO' | oTranslate }}\">\n      <mat-datepicker-toggle matSuffix [for]=\"datepickerTo\">\n        <mat-icon matDatepickerToggleIcon>today</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #datepickerTo [startView]=\"getStartedViewDatepicker()\"></mat-datepicker>\n    </mat-form-field>\n    <button type=\"button\" matSuffix mat-icon-button (click)=\"clearValues()\">\n      <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n    </button>\n  </div>\n\n</ng-template>\n", styles: [".o-filter-by-column-dialog .mat-mdc-slide-toggle{padding-bottom:24px}.o-filter-by-column-dialog .content-wrapper{padding:24px 0 12px;margin:0}.o-filter-by-column-dialog .content-wrapper.content-wrapper-fixed-dimension{max-height:430px;min-height:430px;min-width:250px;width:100%}.o-filter-by-column-dialog .content-wrapper .mat-mdc-form-field.hinted{margin-bottom:24px}.o-filter-by-column-dialog .content-wrapper .select-all-checkbox{padding-bottom:6px}.o-filter-by-column-dialog .content-wrapper .select-values-list{padding-top:0;overflow-y:auto;overflow-x:hidden;outline:none}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item{height:30px}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item .mat-mdc-list-item{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item .mat-mdc-list-item .mat-icon{font-size:24px}.o-filter-by-column-dialog .content-wrapper .column-filter-empty-list{text-align:center}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i3$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i7$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i7$2.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i8.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5$1.MatSelectionList, selector: "mat-selection-list", inputs: ["color", "compareWith", "multiple", "hideSingleSelectionIndicator", "disabled"], outputs: ["selectionChange"], exportAs: ["matSelectionList"] }, { kind: "component", type: i5$1.MatListOption, selector: "mat-list-option", inputs: ["togglePosition", "checkboxPosition", "color", "value", "selected"], outputs: ["selectedChange"], exportAs: ["matListOption"] }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+OTableFilterByColumnDataDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableFilterByColumnDataDialogComponent, selector: "o-table-filter-by-column-data-dialog", host: { properties: { "class.o-filter-by-column-dialog": "true" } }, viewQueries: [{ propertyName: "filter", first: true, predicate: ["filter"], descendants: true }, { propertyName: "filterValueList", first: true, predicate: ["filterValueList"], descendants: true }], ngImport: i0, template: "<span mat-dialog-title>{{ 'TABLE.BUTTONS.FILTER_BY_COLUMN' | oTranslate }}: {{ column.title | oTranslate }}</span>\n<div mat-dialog-content class=\"dialog-list-container\">\n  <div fxLayout=\"column\" class=\"content-wrapper\" [class.content-wrapper-fixed-dimension]=\"getFixedDimensionClass()\">\n    <mat-slide-toggle #customFilterSlide (change)=\"onSlideChange($event)\" [checked]=\"(isCustomFilter | async)\" *ngIf=\"isDefaultFilter | async\">\n      {{ 'TABLE.FILTER_BY_COLUMN.CUSTOM_FILTER' | oTranslate }}\n    </mat-slide-toggle>\n    <div fxFill *ngIf=\"!(isCustomFilter | async);else customFilterTemplate\" fxLayout=\"column\">\n      <mat-form-field class=\"hinted\">\n        <mat-icon matPrefix svgIcon=\"ontimize:search\"></mat-icon>\n        <input matInput #filter placeholder=\"{{ 'TABLE.FILTER' | oTranslate }}\">\n        <mat-hint>{{ 'TABLE.FILTER_BY_COLUMN.HINT_STAR' | oTranslate }}</mat-hint>\n      </mat-form-field>\n      <div *ngIf=\"(listData | async).length > 0; else emptyListData\" fxLayout=\"row\" fxLayoutAlign=\"space-between start\">\n        <div fxLayout=\"row\" fxLayoutAlign=\"start start\">\n          <mat-checkbox (change)=\"onSelectAllChange($event)\" [checked]=\"areAllSelected()\" [indeterminate]=\"isIndeterminate()\" [disabled]=\"!listData\"\n            class=\"select-all-checkbox\">\n            {{ 'TABLE.FILTER_BY_COLUMN.CHECK_ALL' | oTranslate }}\n          </mat-checkbox>\n          <span *ngIf=\"!listData\" class=\"column-filter-empty-list\">\n            {{ 'TABLE.FILTER_BY_COLUMN.LIST_EMPTY_FILTER' | oTranslate }}\n          </span>\n        </div>\n        <button type=\"button\" mat-icon-button (click)=\"onClickSortValues()\">\n          <mat-icon [svgIcon]=\"getSortByAlphaIcon()\"></mat-icon>\n        </button>\n      </div>\n\n      <ng-template #emptyListData>\n        <span class=\"column-filter-empty-list\">\n          {{ 'TABLE.FILTER_BY_COLUMN.LIST_EMPTY' | oTranslate }}\n        </span>\n      </ng-template>\n\n      <mat-selection-list *ngIf=\"preloadValues || listData\" #filterValueList class=\"select-values-list\" (selectionChange)=\"onSelect($event)\">\n        <mat-list-option *ngFor=\"let record of (listData | async); let i = index\" checkboxPosition=\"before\" [selected]=\"record.selected\"\n          [value]=\"record\">\n          <ng-container *ngIf=\"!column.renderer\">\n            {{ record.value || ('TABLE.FILTER_BY_COLUMN.EMPTY_VALUE' | oTranslate) }}\n          </ng-container>\n          <ng-template *ngIf=\"column.renderer\" [ngTemplateOutlet]=\"column.renderer.templateref\"\n            [ngTemplateOutletContext]=\"{ cellvalue: record.value, rowvalue: record.rowValue }\">\n          </ng-template>\n        </mat-list-option>\n      </mat-selection-list>\n    </div>\n  </div>\n</div>\n\n\n<mat-dialog-actions fxLayoutAlign=\"space-between center\">\n  <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"clearAction\" class=\"o-button-info\">\n    {{ 'TABLE.BUTTONS.FILTER_CLEAR' | oTranslate }} </button>\n  <span align=\"end\">\n    <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"cancelAction\" class=\"o-button-default cancel\">\n      {{ 'CANCEL' | oTranslate }} </button>\n    <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"acceptAction\" class=\"o-button-primary\">\n      {{ 'ACCEPT' | oTranslate }} </button>\n  </span>\n</mat-dialog-actions>\n\n<!-- TEMPLATE CUSTOM FILTER-->\n<ng-template #customFilterTemplate>\n  <div *ngIf=\"isTextType()\">\n    <mat-form-field fxFlex class=\"hinted\">\n      <input matInput #filterText [formControl]=\"fcText\" placeholder=\"{{ 'TABLE.FILTER' | oTranslate }}\">\n      <mat-hint>{{ 'TABLE.FILTER_BY_COLUMN.HINT_STAR' | oTranslate }}</mat-hint>\n      <button type=\"button\" matSuffix mat-icon-button (click)=\"clearValues()\">\n        <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n      </button>\n    </mat-form-field>\n  </div>\n  <div *ngIf=\"isNumericType()\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"12px\">\n    <mat-form-field>\n      <input matInput [formControl]=\"fcFrom\" placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.FROM' | oTranslate }}\">\n    </mat-form-field>\n    <mat-form-field>\n      <input matInput [formControl]=\"fcTo\" placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.TO' | oTranslate }}\">\n    </mat-form-field>\n    <button type=\"button\" mat-icon-button (click)=\"clearValues()\">\n      <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n    </button>\n  </div>\n  <div *ngIf=\"isDateType()\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"12px\">\n    <mat-form-field>\n      <input matInput [matDatepicker]=\"datepickerFrom\" [max]=\"fcTo.value\" [formControl]=\"fcFrom\"\n        placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.FROM' | oTranslate }}\">\n      <mat-datepicker-toggle matSuffix [for]=\"datepickerFrom\">\n        <mat-icon matDatepickerToggleIcon>today</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #datepickerFrom [startView]=\"getStartedViewDatepicker()\"></mat-datepicker>\n    </mat-form-field>\n    <mat-form-field>\n      <input matInput [matDatepicker]=\"datepickerTo\" [min]=\"fcFrom.value\" [formControl]=\"fcTo\"\n        placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.TO' | oTranslate }}\">\n      <mat-datepicker-toggle matSuffix [for]=\"datepickerTo\">\n        <mat-icon matDatepickerToggleIcon>today</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #datepickerTo [startView]=\"getStartedViewDatepicker()\"></mat-datepicker>\n    </mat-form-field>\n    <button type=\"button\" matSuffix mat-icon-button (click)=\"clearValues()\">\n      <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n    </button>\n  </div>\n\n</ng-template>\n", styles: [".o-filter-by-column-dialog .mat-mdc-slide-toggle{padding-bottom:24px;padding-left:14px}.o-filter-by-column-dialog .content-wrapper{padding:24px 0 12px;margin:0}.o-filter-by-column-dialog .content-wrapper.content-wrapper-fixed-dimension{max-height:430px;min-height:430px;min-width:250px;width:100%}.o-filter-by-column-dialog .content-wrapper .mat-mdc-form-field.hinted{margin-bottom:24px}.o-filter-by-column-dialog .content-wrapper .select-all-checkbox{padding-bottom:6px}.o-filter-by-column-dialog .content-wrapper .select-values-list{padding-top:0;overflow-y:auto;overflow-x:hidden;outline:none}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item{height:30px}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item .mat-mdc-list-item{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item .mat-mdc-list-item .mat-icon{font-size:24px}.o-filter-by-column-dialog .content-wrapper .column-filter-empty-list{text-align:center}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i3$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i7$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i7$2.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i8.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5$1.MatSelectionList, selector: "mat-selection-list", inputs: ["color", "compareWith", "multiple", "hideSingleSelectionIndicator", "disabled"], outputs: ["selectionChange"], exportAs: ["matSelectionList"] }, { kind: "component", type: i5$1.MatListOption, selector: "mat-list-option", inputs: ["togglePosition", "checkboxPosition", "color", "value", "selected"], outputs: ["selectedChange"], exportAs: ["matListOption"] }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableFilterByColumnDataDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'o-table-filter-by-column-data-dialog', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[class.o-filter-by-column-dialog]': 'true'
-                    }, template: "<span mat-dialog-title>{{ 'TABLE.BUTTONS.FILTER_BY_COLUMN' | oTranslate }}: {{ column.title | oTranslate }}</span>\n<div mat-dialog-content fxLayout=\"row\" fxLayoutAlign=\"space-between stretch\" class=\"dialog-list-container\">\n  <div fxLayout=\"column\" class=\"content-wrapper\" [class.content-wrapper-fixed-dimension]=\"getFixedDimensionClass()\">\n    <mat-slide-toggle #customFilterSlide (change)=\"onSlideChange($event)\" [checked]=\"(isCustomFilter | async)\" *ngIf=\"isDefaultFilter | async\">\n      {{ 'TABLE.FILTER_BY_COLUMN.CUSTOM_FILTER' | oTranslate }}\n    </mat-slide-toggle>\n    <div fxFlex *ngIf=\"!(isCustomFilter | async);else customFilterTemplate\" fxLayout=\"column\">\n      <mat-form-field class=\"hinted\">\n        <mat-icon matPrefix svgIcon=\"ontimize:search\"></mat-icon>\n        <input matInput #filter placeholder=\"{{ 'TABLE.FILTER' | oTranslate }}\">\n        <mat-hint>{{ 'TABLE.FILTER_BY_COLUMN.HINT_STAR' | oTranslate }}</mat-hint>\n      </mat-form-field>\n      <div *ngIf=\"(listData | async).length > 0; else emptyListData\" fxLayout=\"row\" fxLayoutAlign=\"space-between start\">\n        <div fxLayout=\"row\" fxLayoutAlign=\"start start\">\n          <mat-checkbox (change)=\"onSelectAllChange($event)\" [checked]=\"areAllSelected()\" [indeterminate]=\"isIndeterminate()\" [disabled]=\"!listData\"\n            class=\"select-all-checkbox\">\n            {{ 'TABLE.FILTER_BY_COLUMN.CHECK_ALL' | oTranslate }}\n          </mat-checkbox>\n          <span *ngIf=\"!listData\" class=\"column-filter-empty-list\">\n            {{ 'TABLE.FILTER_BY_COLUMN.LIST_EMPTY_FILTER' | oTranslate }}\n          </span>\n        </div>\n        <button type=\"button\" mat-icon-button (click)=\"onClickSortValues()\">\n          <mat-icon [svgIcon]=\"getSortByAlphaIcon()\"></mat-icon>\n        </button>\n      </div>\n\n      <ng-template #emptyListData>\n        <span class=\"column-filter-empty-list\">\n          {{ 'TABLE.FILTER_BY_COLUMN.LIST_EMPTY' | oTranslate }}\n        </span>\n      </ng-template>\n\n      <mat-selection-list *ngIf=\"preloadValues || listData\" #filterValueList fxFlex fxLayout=\"column\" class=\"select-values-list\"\n        (selectionChange)=\"onSelect($event)\">\n        <mat-list-option *ngFor=\"let record of (listData | async); let i = index\" checkboxPosition=\"before\" [selected]=\"record.selected\"\n          [value]=\"record\">\n          <ng-container *ngIf=\"!column.renderer\">\n            {{ record.value || ('TABLE.FILTER_BY_COLUMN.EMPTY_VALUE' | oTranslate) }}\n          </ng-container>\n          <ng-template *ngIf=\"column.renderer\" [ngTemplateOutlet]=\"column.renderer.templateref\"\n            [ngTemplateOutletContext]=\"{ cellvalue: record.value, rowvalue: record.rowValue }\">\n          </ng-template>\n        </mat-list-option>\n      </mat-selection-list>\n    </div>\n  </div>\n</div>\n\n\n<mat-dialog-actions fxLayoutAlign=\"space-between center\">\n  <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"clearAction\" class=\"o-button-info\">\n    {{ 'TABLE.BUTTONS.FILTER_CLEAR' | oTranslate }} </button>\n  <span align=\"end\">\n    <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"cancelAction\" class=\"o-button-default cancel\">\n      {{ 'CANCEL' | oTranslate }} </button>\n    <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"acceptAction\" class=\"o-button-primary\">\n      {{ 'ACCEPT' | oTranslate }} </button>\n  </span>\n</mat-dialog-actions>\n\n<!-- TEMPLATE CUSTOM FILTER-->\n<ng-template #customFilterTemplate>\n  <div *ngIf=\"isTextType()\">\n    <mat-form-field fxFlex class=\"hinted\">\n      <input matInput #filterText [formControl]=\"fcText\" placeholder=\"{{ 'TABLE.FILTER' | oTranslate }}\">\n      <mat-hint>{{ 'TABLE.FILTER_BY_COLUMN.HINT_STAR' | oTranslate }}</mat-hint>\n      <button type=\"button\" matSuffix mat-icon-button (click)=\"clearValues()\">\n        <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n      </button>\n    </mat-form-field>\n  </div>\n  <div *ngIf=\"isNumericType()\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"12px\">\n    <mat-form-field>\n      <input matInput [formControl]=\"fcFrom\" placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.FROM' | oTranslate }}\">\n    </mat-form-field>\n    <mat-form-field>\n      <input matInput [formControl]=\"fcTo\" placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.TO' | oTranslate }}\">\n    </mat-form-field>\n    <button type=\"button\" mat-icon-button (click)=\"clearValues()\">\n      <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n    </button>\n  </div>\n  <div *ngIf=\"isDateType()\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"12px\">\n    <mat-form-field>\n      <input matInput [matDatepicker]=\"datepickerFrom\" [max]=\"fcTo.value\" [formControl]=\"fcFrom\"\n        placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.FROM' | oTranslate }}\">\n      <mat-datepicker-toggle matSuffix [for]=\"datepickerFrom\">\n        <mat-icon matDatepickerToggleIcon>today</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #datepickerFrom [startView]=\"getStartedViewDatepicker()\"></mat-datepicker>\n    </mat-form-field>\n    <mat-form-field>\n      <input matInput [matDatepicker]=\"datepickerTo\" [min]=\"fcFrom.value\" [formControl]=\"fcTo\"\n        placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.TO' | oTranslate }}\">\n      <mat-datepicker-toggle matSuffix [for]=\"datepickerTo\">\n        <mat-icon matDatepickerToggleIcon>today</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #datepickerTo [startView]=\"getStartedViewDatepicker()\"></mat-datepicker>\n    </mat-form-field>\n    <button type=\"button\" matSuffix mat-icon-button (click)=\"clearValues()\">\n      <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n    </button>\n  </div>\n\n</ng-template>\n", styles: [".o-filter-by-column-dialog .mat-mdc-slide-toggle{padding-bottom:24px}.o-filter-by-column-dialog .content-wrapper{padding:24px 0 12px;margin:0}.o-filter-by-column-dialog .content-wrapper.content-wrapper-fixed-dimension{max-height:430px;min-height:430px;min-width:250px;width:100%}.o-filter-by-column-dialog .content-wrapper .mat-mdc-form-field.hinted{margin-bottom:24px}.o-filter-by-column-dialog .content-wrapper .select-all-checkbox{padding-bottom:6px}.o-filter-by-column-dialog .content-wrapper .select-values-list{padding-top:0;overflow-y:auto;overflow-x:hidden;outline:none}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item{height:30px}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item .mat-mdc-list-item{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item .mat-mdc-list-item .mat-icon{font-size:24px}.o-filter-by-column-dialog .content-wrapper .column-filter-empty-list{text-align:center}\n"] }]
+                    }, template: "<span mat-dialog-title>{{ 'TABLE.BUTTONS.FILTER_BY_COLUMN' | oTranslate }}: {{ column.title | oTranslate }}</span>\n<div mat-dialog-content class=\"dialog-list-container\">\n  <div fxLayout=\"column\" class=\"content-wrapper\" [class.content-wrapper-fixed-dimension]=\"getFixedDimensionClass()\">\n    <mat-slide-toggle #customFilterSlide (change)=\"onSlideChange($event)\" [checked]=\"(isCustomFilter | async)\" *ngIf=\"isDefaultFilter | async\">\n      {{ 'TABLE.FILTER_BY_COLUMN.CUSTOM_FILTER' | oTranslate }}\n    </mat-slide-toggle>\n    <div fxFill *ngIf=\"!(isCustomFilter | async);else customFilterTemplate\" fxLayout=\"column\">\n      <mat-form-field class=\"hinted\">\n        <mat-icon matPrefix svgIcon=\"ontimize:search\"></mat-icon>\n        <input matInput #filter placeholder=\"{{ 'TABLE.FILTER' | oTranslate }}\">\n        <mat-hint>{{ 'TABLE.FILTER_BY_COLUMN.HINT_STAR' | oTranslate }}</mat-hint>\n      </mat-form-field>\n      <div *ngIf=\"(listData | async).length > 0; else emptyListData\" fxLayout=\"row\" fxLayoutAlign=\"space-between start\">\n        <div fxLayout=\"row\" fxLayoutAlign=\"start start\">\n          <mat-checkbox (change)=\"onSelectAllChange($event)\" [checked]=\"areAllSelected()\" [indeterminate]=\"isIndeterminate()\" [disabled]=\"!listData\"\n            class=\"select-all-checkbox\">\n            {{ 'TABLE.FILTER_BY_COLUMN.CHECK_ALL' | oTranslate }}\n          </mat-checkbox>\n          <span *ngIf=\"!listData\" class=\"column-filter-empty-list\">\n            {{ 'TABLE.FILTER_BY_COLUMN.LIST_EMPTY_FILTER' | oTranslate }}\n          </span>\n        </div>\n        <button type=\"button\" mat-icon-button (click)=\"onClickSortValues()\">\n          <mat-icon [svgIcon]=\"getSortByAlphaIcon()\"></mat-icon>\n        </button>\n      </div>\n\n      <ng-template #emptyListData>\n        <span class=\"column-filter-empty-list\">\n          {{ 'TABLE.FILTER_BY_COLUMN.LIST_EMPTY' | oTranslate }}\n        </span>\n      </ng-template>\n\n      <mat-selection-list *ngIf=\"preloadValues || listData\" #filterValueList class=\"select-values-list\" (selectionChange)=\"onSelect($event)\">\n        <mat-list-option *ngFor=\"let record of (listData | async); let i = index\" checkboxPosition=\"before\" [selected]=\"record.selected\"\n          [value]=\"record\">\n          <ng-container *ngIf=\"!column.renderer\">\n            {{ record.value || ('TABLE.FILTER_BY_COLUMN.EMPTY_VALUE' | oTranslate) }}\n          </ng-container>\n          <ng-template *ngIf=\"column.renderer\" [ngTemplateOutlet]=\"column.renderer.templateref\"\n            [ngTemplateOutletContext]=\"{ cellvalue: record.value, rowvalue: record.rowValue }\">\n          </ng-template>\n        </mat-list-option>\n      </mat-selection-list>\n    </div>\n  </div>\n</div>\n\n\n<mat-dialog-actions fxLayoutAlign=\"space-between center\">\n  <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"clearAction\" class=\"o-button-info\">\n    {{ 'TABLE.BUTTONS.FILTER_CLEAR' | oTranslate }} </button>\n  <span align=\"end\">\n    <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"cancelAction\" class=\"o-button-default cancel\">\n      {{ 'CANCEL' | oTranslate }} </button>\n    <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"acceptAction\" class=\"o-button-primary\">\n      {{ 'ACCEPT' | oTranslate }} </button>\n  </span>\n</mat-dialog-actions>\n\n<!-- TEMPLATE CUSTOM FILTER-->\n<ng-template #customFilterTemplate>\n  <div *ngIf=\"isTextType()\">\n    <mat-form-field fxFlex class=\"hinted\">\n      <input matInput #filterText [formControl]=\"fcText\" placeholder=\"{{ 'TABLE.FILTER' | oTranslate }}\">\n      <mat-hint>{{ 'TABLE.FILTER_BY_COLUMN.HINT_STAR' | oTranslate }}</mat-hint>\n      <button type=\"button\" matSuffix mat-icon-button (click)=\"clearValues()\">\n        <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n      </button>\n    </mat-form-field>\n  </div>\n  <div *ngIf=\"isNumericType()\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"12px\">\n    <mat-form-field>\n      <input matInput [formControl]=\"fcFrom\" placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.FROM' | oTranslate }}\">\n    </mat-form-field>\n    <mat-form-field>\n      <input matInput [formControl]=\"fcTo\" placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.TO' | oTranslate }}\">\n    </mat-form-field>\n    <button type=\"button\" mat-icon-button (click)=\"clearValues()\">\n      <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n    </button>\n  </div>\n  <div *ngIf=\"isDateType()\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"12px\">\n    <mat-form-field>\n      <input matInput [matDatepicker]=\"datepickerFrom\" [max]=\"fcTo.value\" [formControl]=\"fcFrom\"\n        placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.FROM' | oTranslate }}\">\n      <mat-datepicker-toggle matSuffix [for]=\"datepickerFrom\">\n        <mat-icon matDatepickerToggleIcon>today</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #datepickerFrom [startView]=\"getStartedViewDatepicker()\"></mat-datepicker>\n    </mat-form-field>\n    <mat-form-field>\n      <input matInput [matDatepicker]=\"datepickerTo\" [min]=\"fcFrom.value\" [formControl]=\"fcTo\"\n        placeholder=\"{{ 'TABLE.FILTER_BY_COLUMN.TO' | oTranslate }}\">\n      <mat-datepicker-toggle matSuffix [for]=\"datepickerTo\">\n        <mat-icon matDatepickerToggleIcon>today</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #datepickerTo [startView]=\"getStartedViewDatepicker()\"></mat-datepicker>\n    </mat-form-field>\n    <button type=\"button\" matSuffix mat-icon-button (click)=\"clearValues()\">\n      <mat-icon svgIcon=\"ontimize:close\"></mat-icon>\n    </button>\n  </div>\n\n</ng-template>\n", styles: [".o-filter-by-column-dialog .mat-mdc-slide-toggle{padding-bottom:24px;padding-left:14px}.o-filter-by-column-dialog .content-wrapper{padding:24px 0 12px;margin:0}.o-filter-by-column-dialog .content-wrapper.content-wrapper-fixed-dimension{max-height:430px;min-height:430px;min-width:250px;width:100%}.o-filter-by-column-dialog .content-wrapper .mat-mdc-form-field.hinted{margin-bottom:24px}.o-filter-by-column-dialog .content-wrapper .select-all-checkbox{padding-bottom:6px}.o-filter-by-column-dialog .content-wrapper .select-values-list{padding-top:0;overflow-y:auto;overflow-x:hidden;outline:none}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item{height:30px}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item .mat-mdc-list-item{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-filter-by-column-dialog .content-wrapper .select-values-list .mat-mdc-list-item .mat-mdc-list-item .mat-icon{font-size:24px}.o-filter-by-column-dialog .content-wrapper .column-filter-empty-list{text-align:center}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -27749,13 +27751,15 @@ class DefaultOTableDataSource extends DataSource {
                 data = this.getVirtualScrollData(this.renderedData, x);
             }
             else {
-                if (this.existsAnyCalculatedColumn()) {
-                    data = this.getColumnCalculatedData(data);
-                }
-                if (!this.table.pageable) {
-                    data = this.getColumnValueFilterData(data);
-                    data = this.getQuickFilterData(data);
-                    data = this.getSortedData(data);
+                if (Array.isArray(data) && data.length > 0) {
+                    if (this.existsAnyCalculatedColumn()) {
+                        data = this.getColumnCalculatedData(data);
+                    }
+                    if (!this.table.pageable) {
+                        data = this.getColumnValueFilterData(data);
+                        data = this.getQuickFilterData(data);
+                        data = this.getSortedData(data);
+                    }
                 }
                 this.filteredData = Object.assign([], data);
                 if (this.table.pageable) {
@@ -27880,7 +27884,24 @@ class DefaultOTableDataSource extends DataSource {
         return searchStr.indexOf(filter) !== -1;
     }
     getSortedData(data) {
-        return this._sort.getSortedData(data);
+        const rendererData = this.getDataToSort(data);
+        const sortedData = this._sort.getSortedData(rendererData);
+        const tableKeys = this.table.getKeys();
+        const originalDataSorted = [];
+        sortedData.forEach(sortedElement => {
+            const keysValuesInSortData = tableKeys.map(element => sortedElement[element]);
+            let i = 0;
+            let found = false;
+            while (i < data.length && !found) {
+                const keysValuesInData = tableKeys.map(element => data[i][element]);
+                if (Util.isArrayEqual(keysValuesInSortData, keysValuesInData)) {
+                    originalDataSorted.push(data[i]);
+                    found = true;
+                }
+                i++;
+            }
+        });
+        return originalDataSorted;
     }
     getTableData() {
         return this._database.data;
@@ -27914,6 +27935,24 @@ class DefaultOTableDataSource extends DataSource {
             return obj;
         });
     }
+    getDataToSort(data) {
+        const sortColumns = this._tableOptions.columns.filter(oCol => oCol.visible && this._sort.activeArray.map(x => x.id).indexOf(oCol.attr) > -1);
+        const existColumnToTrasformToSort = sortColumns.filter((oCol) => (oCol.type === 'translate' || oCol.type === 'service')).length > 0;
+        if (!existColumnToTrasformToSort) {
+            return data;
+        }
+        this.table.getKeys().forEach(key => {
+            sortColumns.push(this.table.getOColumn(key));
+        });
+        return data.map((row) => {
+            const obj = {};
+            sortColumns.forEach((oCol) => {
+                const useRenderer = oCol.renderer && (oCol.type === 'translate' || oCol.type === 'service') && oCol.renderer.getCellData;
+                obj[oCol.attr] = useRenderer ? oCol.renderer.getCellData(row[oCol.attr], row) : row[oCol.attr];
+            });
+            return obj;
+        });
+    }
     getAllData(usingRendererers, onlyVisibleColumns) {
         let tableColumns = this._tableOptions.columns;
         if (onlyVisibleColumns) {
@@ -29711,7 +29750,7 @@ class OTableQuickfilterComponent {
         this.injector = injector;
         this.elRef = elRef;
         this.table = table;
-        this._placeholder = 'TABLE.FILTER';
+        this._placeholder = undefined;
         this.onChange = new EventEmitter();
         this.formControl = new UntypedFormControl();
     }
@@ -29858,12 +29897,12 @@ class OTableQuickfilterComponent {
     }
 }
 OTableQuickfilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableQuickfilterComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: forwardRef(() => OTableBase) }], target: i0.ɵɵFactoryTarget.Component });
-OTableQuickfilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableQuickfilterComponent, selector: "o-table-quickfilter", inputs: { placeholder: "placeholder" }, outputs: { onChange: "onChange" }, host: { properties: { "class.o-table-quickfilter": "true" } }, viewQueries: [{ propertyName: "filter", first: true, predicate: ["filter"], descendants: true }, { propertyName: "matMenu", first: true, predicate: ["menu"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"quickFilter\" fxLayout=\"row\">\n\n  <mat-form-field appearance=\"outline\">\n    <input matInput #filter [formControl]=\"formControl\" (click)=\"$event.stopPropagation()\" placeholder=\"{{ placeholder | oTranslate }}\">\n    <div matPrefix>\n      <mat-icon svgIcon=\"ontimize:search\" [matBadge]=\"areAllColumnsChecked()?'':getCountColumnsChecked()\" matBadgeSize=\"small\"></mat-icon>\n      <button mat-icon-button [matMenuTriggerFor]=\"menu\" (menuClosed)=\"onMenuClosed()\" (click)=\"$event.stopPropagation()\">\n        <mat-icon class=\"search-icon\">expand_more</mat-icon>\n      </button>\n    </div>\n\n    <mat-menu #menu=\"matMenu\" class=\"o-table-quickfilter-menu\">\n      <div fxLayout=\"column\" class=\"checkbox-container\">\n\n        <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"areAllColumnsChecked()\" (change)=\"onSelectAllChange($event)\">\n          {{ 'SELECT_ALL' | oTranslate}}\n        </mat-checkbox>\n        <mat-divider></mat-divider>\n\n        <ng-container *ngFor=\"let column of quickFilterColumns\">\n          <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"isChecked(column)\" (change)=\"onCheckboxChange(column, $event)\">\n            {{ column.title | oTranslate }}\n          </mat-checkbox>\n        </ng-container>\n\n        <ng-container *ngIf=\"showCaseSensitiveCheckbox()\">\n          <mat-divider></mat-divider>\n          <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"oTableOptions.filterCaseSensitive\"\n            (change)=\"oTableOptions.filterCaseSensitive = $event.checked\">\n            {{ 'TABLE.FILTER.CASE_SENSITIVE' | oTranslate}}\n          </mat-checkbox>\n        </ng-container>\n      </div>\n    </mat-menu>\n  </mat-form-field>\n</div>\n", styles: [".o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mdc-notched-outline__leading,.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mdc-notched-outline__trailing{border-radius:2px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-self:center;padding:0;min-height:30px;display:flex}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix{padding-left:10px;padding-right:10px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div{align-items:center;display:flex}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div .mat-icon,.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div button{margin-right:6px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div .mat-badge-content{background-color:#3c8500;width:14px;height:14px;line-height:14px;top:-4px;right:-4px}.o-table-quickfilter-menu .checkbox-container{padding:6px 12px}.o-table-quickfilter-menu .checkbox-container .mat-divider{margin:8px 0}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i3$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i11.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgeColor", "matBadgeOverlap", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+OTableQuickfilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableQuickfilterComponent, selector: "o-table-quickfilter", inputs: { placeholder: "placeholder" }, outputs: { onChange: "onChange" }, host: { properties: { "class.o-table-quickfilter": "true" } }, viewQueries: [{ propertyName: "filter", first: true, predicate: ["filter"], descendants: true }, { propertyName: "matMenu", first: true, predicate: ["menu"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"quickFilter\" fxLayout=\"row\">\n\n  <mat-form-field appearance=\"outline\">\n    <input matInput #filter [formControl]=\"formControl\" (click)=\"$event.stopPropagation()\" placeholder=\"{{ placeholder | oTranslate }}\">\n    <div matPrefix>\n      <mat-icon svgIcon=\"ontimize:search\" [matBadge]=\"areAllColumnsChecked()?'':getCountColumnsChecked()\" matBadgeSize=\"small\"></mat-icon>\n      <button mat-icon-button [matMenuTriggerFor]=\"menu\" (menuClosed)=\"onMenuClosed()\" (click)=\"$event.stopPropagation()\">\n        <mat-icon class=\"search-icon\">expand_more</mat-icon>\n      </button>\n    </div>\n\n    <mat-menu #menu=\"matMenu\" class=\"o-table-quickfilter-menu\">\n      <div fxLayout=\"column\" class=\"checkbox-container\">\n\n        <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"areAllColumnsChecked()\" (change)=\"onSelectAllChange($event)\">\n          {{ 'SELECT_ALL' | oTranslate}}\n        </mat-checkbox>\n        <mat-divider></mat-divider>\n\n        <ng-container *ngFor=\"let column of quickFilterColumns\">\n          <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"isChecked(column)\" (change)=\"onCheckboxChange(column, $event)\">\n            {{ column.title | oTranslate }}\n          </mat-checkbox>\n        </ng-container>\n\n        <ng-container *ngIf=\"showCaseSensitiveCheckbox()\">\n          <mat-divider></mat-divider>\n          <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"oTableOptions.filterCaseSensitive\"\n            (change)=\"oTableOptions.filterCaseSensitive = $event.checked\">\n            {{ 'TABLE.FILTER.CASE_SENSITIVE' | oTranslate}}\n          </mat-checkbox>\n        </ng-container>\n      </div>\n    </mat-menu>\n  </mat-form-field>\n</div>\n", styles: [".o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-self:center;padding:0;min-height:30px;display:flex}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix{padding-left:10px;padding-right:10px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div{align-items:center;display:flex}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div .mat-icon,.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div button{margin-right:6px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div .mat-badge-content{background-color:#3c8500;width:14px;height:14px;line-height:14px;top:-4px;right:-4px}.o-table-quickfilter-menu .checkbox-container{padding:6px 12px}.o-table-quickfilter-menu .checkbox-container .mat-divider{margin:8px 0}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i3$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i11.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgeColor", "matBadgeOverlap", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableQuickfilterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'o-table-quickfilter', inputs: DEFAULT_INPUTS_O_TABLE_QUICKFILTER, outputs: DEFAULT_OUTPUTS_O_TABLE_QUICKFILTER, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[class.o-table-quickfilter]': 'true',
-                    }, template: "<div class=\"quickFilter\" fxLayout=\"row\">\n\n  <mat-form-field appearance=\"outline\">\n    <input matInput #filter [formControl]=\"formControl\" (click)=\"$event.stopPropagation()\" placeholder=\"{{ placeholder | oTranslate }}\">\n    <div matPrefix>\n      <mat-icon svgIcon=\"ontimize:search\" [matBadge]=\"areAllColumnsChecked()?'':getCountColumnsChecked()\" matBadgeSize=\"small\"></mat-icon>\n      <button mat-icon-button [matMenuTriggerFor]=\"menu\" (menuClosed)=\"onMenuClosed()\" (click)=\"$event.stopPropagation()\">\n        <mat-icon class=\"search-icon\">expand_more</mat-icon>\n      </button>\n    </div>\n\n    <mat-menu #menu=\"matMenu\" class=\"o-table-quickfilter-menu\">\n      <div fxLayout=\"column\" class=\"checkbox-container\">\n\n        <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"areAllColumnsChecked()\" (change)=\"onSelectAllChange($event)\">\n          {{ 'SELECT_ALL' | oTranslate}}\n        </mat-checkbox>\n        <mat-divider></mat-divider>\n\n        <ng-container *ngFor=\"let column of quickFilterColumns\">\n          <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"isChecked(column)\" (change)=\"onCheckboxChange(column, $event)\">\n            {{ column.title | oTranslate }}\n          </mat-checkbox>\n        </ng-container>\n\n        <ng-container *ngIf=\"showCaseSensitiveCheckbox()\">\n          <mat-divider></mat-divider>\n          <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"oTableOptions.filterCaseSensitive\"\n            (change)=\"oTableOptions.filterCaseSensitive = $event.checked\">\n            {{ 'TABLE.FILTER.CASE_SENSITIVE' | oTranslate}}\n          </mat-checkbox>\n        </ng-container>\n      </div>\n    </mat-menu>\n  </mat-form-field>\n</div>\n", styles: [".o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mdc-notched-outline__leading,.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mdc-notched-outline__trailing{border-radius:2px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-self:center;padding:0;min-height:30px;display:flex}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix{padding-left:10px;padding-right:10px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div{align-items:center;display:flex}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div .mat-icon,.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div button{margin-right:6px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div .mat-badge-content{background-color:#3c8500;width:14px;height:14px;line-height:14px;top:-4px;right:-4px}.o-table-quickfilter-menu .checkbox-container{padding:6px 12px}.o-table-quickfilter-menu .checkbox-container .mat-divider{margin:8px 0}\n"] }]
+                    }, template: "<div class=\"quickFilter\" fxLayout=\"row\">\n\n  <mat-form-field appearance=\"outline\">\n    <input matInput #filter [formControl]=\"formControl\" (click)=\"$event.stopPropagation()\" placeholder=\"{{ placeholder | oTranslate }}\">\n    <div matPrefix>\n      <mat-icon svgIcon=\"ontimize:search\" [matBadge]=\"areAllColumnsChecked()?'':getCountColumnsChecked()\" matBadgeSize=\"small\"></mat-icon>\n      <button mat-icon-button [matMenuTriggerFor]=\"menu\" (menuClosed)=\"onMenuClosed()\" (click)=\"$event.stopPropagation()\">\n        <mat-icon class=\"search-icon\">expand_more</mat-icon>\n      </button>\n    </div>\n\n    <mat-menu #menu=\"matMenu\" class=\"o-table-quickfilter-menu\">\n      <div fxLayout=\"column\" class=\"checkbox-container\">\n\n        <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"areAllColumnsChecked()\" (change)=\"onSelectAllChange($event)\">\n          {{ 'SELECT_ALL' | oTranslate}}\n        </mat-checkbox>\n        <mat-divider></mat-divider>\n\n        <ng-container *ngFor=\"let column of quickFilterColumns\">\n          <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"isChecked(column)\" (change)=\"onCheckboxChange(column, $event)\">\n            {{ column.title | oTranslate }}\n          </mat-checkbox>\n        </ng-container>\n\n        <ng-container *ngIf=\"showCaseSensitiveCheckbox()\">\n          <mat-divider></mat-divider>\n          <mat-checkbox (click)=\"$event.stopPropagation()\" [checked]=\"oTableOptions.filterCaseSensitive\"\n            (change)=\"oTableOptions.filterCaseSensitive = $event.checked\">\n            {{ 'TABLE.FILTER.CASE_SENSITIVE' | oTranslate}}\n          </mat-checkbox>\n        </ng-container>\n      </div>\n    </mat-menu>\n  </mat-form-field>\n</div>\n", styles: [".o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-self:center;padding:0;min-height:30px;display:flex}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix{padding-left:10px;padding-right:10px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div{align-items:center;display:flex}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div .mat-icon,.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div button{margin-right:6px}.o-table-quickfilter .quickFilter .mat-mdc-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-prefix div .mat-badge-content{background-color:#3c8500;width:14px;height:14px;line-height:14px;top:-4px;right:-4px}.o-table-quickfilter-menu .checkbox-container{padding:6px 12px}.o-table-quickfilter-menu .checkbox-container .mat-divider{margin:8px 0}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: OTableBase, decorators: [{
                     type: Inject,
                     args: [forwardRef(() => OTableBase)]
@@ -30556,13 +30595,12 @@ class OTableComponent extends AbstractOServiceComponent {
     set isColumnFiltersActive(val) {
         this._isColumnFiltersActive = val;
     }
-    constructor(injector, elRef, dialog, _viewContainerRef, appRef, _componentFactoryResolver, form, scrollStrategy) {
+    constructor(injector, elRef, dialog, _viewContainerRef, appRef, form, scrollStrategy) {
         super(injector, elRef, form);
         this.injector = injector;
         this.dialog = dialog;
         this._viewContainerRef = _viewContainerRef;
         this.appRef = appRef;
-        this._componentFactoryResolver = _componentFactoryResolver;
         this.scrollStrategy = scrollStrategy;
         this.DETAIL_MODE_NONE = Codes.DETAIL_MODE_NONE;
         this.EDIT_MODE_NONE = Codes.EDITION_MODE_NONE;
@@ -31263,7 +31301,7 @@ class OTableComponent extends AbstractOServiceComponent {
             this.tableRowExpandable.onCollapsed.emit(eventTableRowExpandableChange);
         }
         else {
-            this.portalHost[rowIndex] = new DomPortalOutlet(this.elRef.nativeElement.querySelector('.' + this.getExpandedRowContainerClass(rowIndex)), this._componentFactoryResolver, this.appRef, this.injector);
+            this.portalHost[rowIndex] = new DomPortalOutlet(this.elRef.nativeElement.querySelector('.' + this.getExpandedRowContainerClass(rowIndex)), null, this.appRef, this.injector);
             const templatePortal = new TemplatePortal(this.tableRowExpandable.templateRef, this._viewContainerRef, { $implicit: item });
             this.portalHost[rowIndex].attachTemplatePortal(templatePortal);
             const eventTableRowExpandableChange = this.emitTableRowExpandableChangeEvent(item, rowIndex);
@@ -32657,7 +32695,7 @@ class OTableComponent extends AbstractOServiceComponent {
     }
     queryCellRenderers() {
         const quickFilterValue = this.getQuickFilterValue();
-        if (Util.isDefined(quickFilterValue) && quickFilterValue.length > 0) {
+        if ((Util.isDefined(quickFilterValue) && quickFilterValue.length > 0) || this.sortColArray.length > 0) {
             const queries = this.oTableOptions.columns
                 .filter(oCol => oCol.searching && this.isInstanceOfOTableCellRendererServiceComponent(oCol.renderer))
                 .map(oCol => oCol.renderer.queryAllData());
@@ -32712,7 +32750,7 @@ class OTableComponent extends AbstractOServiceComponent {
     }
     getColumnsNotIncluded() {
         let colsNotIncluded = [];
-        colsNotIncluded = this.oTableOptions.columns.filter(c => void 0 !== c.renderer && c.type === 'image').map(c => c.attr);
+        colsNotIncluded = this.oTableOptions.columns.filter(c => void 0 !== c.renderer && (c.type === 'image' || c.type === 'action')).map(c => c.attr);
         colsNotIncluded.push(Codes.NAME_COLUMN_SELECT);
         colsNotIncluded.push(Codes.NAME_COLUMN_EXPANDABLE);
         return colsNotIncluded;
@@ -32755,7 +32793,7 @@ OTableComponent.FIRST_LAST_CELL_PADDING = 24;
 OTableComponent.EXPANDED_ROW_CONTAINER_CLASS = 'expanded-row-container-';
 OTableComponent.AVAILABLE_GROUPING_COLUMNS_RENDERERS = ['currency', 'integer', 'real'];
 OTableComponent.DEFAULT_ROW_HEIGHT = 36;
-OTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1$1.MatDialog }, { token: i0.ViewContainerRef }, { token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }, { token: forwardRef(() => OFormComponent), optional: true }, { token: VIRTUAL_SCROLL_STRATEGY, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+OTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i1$1.MatDialog }, { token: i0.ViewContainerRef }, { token: i0.ApplicationRef }, { token: forwardRef(() => OFormComponent), optional: true }, { token: VIRTUAL_SCROLL_STRATEGY, optional: true }], target: i0.ɵɵFactoryTarget.Component });
 OTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableComponent, selector: "o-table", inputs: { visibleColumns: ["visible-columns", "visibleColumns"], defaultVisibleColumns: ["default-visible-columns", "defaultVisibleColumns"], sortColumns: ["sort-columns", "sortColumns"], quickFilterCallback: ["quick-filter-function", "quickFilterCallback"], deleteButton: ["delete-button", "deleteButton"], refreshButton: ["refresh-button", "refreshButton"], columnsVisibilityButton: ["columns-visibility-button", "columnsVisibilityButton"], exportButton: ["export-button", "exportButton"], showConfigurationOption: ["show-configuration-option", "showConfigurationOption"], showButtonsText: ["show-buttons-text", "showButtonsText"], selectAllCheckbox: ["select-all-checkbox", "selectAllCheckbox"], paginationControls: ["pagination-controls", "paginationControls"], fixedHeader: ["fixed-header", "fixedHeader"], showTitle: ["show-title", "showTitle"], editionMode: ["edition-mode", "editionMode"], selectionMode: ["selection-mode", "selectionMode"], horizontalScroll: ["horizontal-scroll", "horizontalScroll"], showPaginatorFirstLastButtons: ["show-paginator-first-last-buttons", "showPaginatorFirstLastButtons"], autoAlignTitles: ["auto-align-titles", "autoAlignTitles"], multipleSort: ["multiple-sort", "multipleSort"], selectAllCheckboxVisible: ["select-all-checkbox-visible", "selectAllCheckboxVisible"], orderable: "orderable", resizable: "resizable", keepSelectedItems: ["keep-selected-items", "keepSelectedItems"], exportMode: ["export-mode", "exportMode"], exportServiceType: ["export-service-type", "exportServiceType"], autoAdjust: ["auto-adjust", "autoAdjust"], showFilterOption: ["show-filter-option", "showFilterOption"], visibleExportDialogButtons: ["visible-export-dialog-buttons", "visibleExportDialogButtons"], rowClass: ["row-class", "rowClass"], filterColumnActiveByDefault: ["filter-column-active-by-default", "filterColumnActiveByDefault"], groupedColumns: ["grouped-columns", "groupedColumns"], groupable: "groupable", expandGroupsSameLevel: ["expand-groups-same-level", "expandGroupsSameLevel"], collapseGroupedColumns: ["collapse-grouped-columns", "collapseGroupedColumns"], virtualScroll: ["virtual-scroll", "virtualScroll"], contextMenu: ["context-menu", "contextMenu"], showExpandableIconFunction: ["show-expandable-icon-function", "showExpandableIconFunction"], showReportOnDemandOption: ["show-report-on-demand-option", "showReportOnDemandOption"], showChartsOnDemandOption: ["show-charts-on-demand-option", "showChartsOnDemandOption"], showResetWidthOption: ["show-reset-width-option", "showResetWidthOption"], disableSelectionFunction: ["disable-selection-function", "disableSelectionFunction"] }, outputs: { onRowSelected: "onRowSelected", onRowDeselected: "onRowDeselected", onRowDeleted: "onRowDeleted" }, host: { listeners: { "document:click": "handleDOMClick($event)", "window:resize": "updateScrolledState()" }, properties: { "class.o-table": "true", "class.ontimize-table": "true", "class.o-table-fixed": "fixedHeader", "class.o-table-disabled": "!enabled" } }, providers: [
         OntimizeServiceProvider,
         ComponentStateServiceProvider,
@@ -32763,7 +32801,7 @@ OTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
         { provide: O_COMPONENT_STATE_SERVICE, useClass: OTableComponentStateService },
         { provide: VIRTUAL_SCROLL_STRATEGY, useClass: OTableVirtualScrollStrategy },
         { provide: OTableBase, useExisting: forwardRef(() => OTableComponent) }
-    ], queries: [{ propertyName: "tableRowExpandable", first: true, predicate: OTableRowExpandableComponent, descendants: true }, { propertyName: "quickfilterContentChild", first: true, predicate: ["o-table-quickfilter"], descendants: true, static: true }, { propertyName: "tableColumnSelectAllContentChild", first: true, predicate: OTableColumnSelectAllDirective, descendants: true }, { propertyName: "contextMenuContentChild", first: true, predicate: OTableContextMenuComponent, descendants: true, static: true }, { propertyName: "tableOptions", predicate: OTableOptionComponent }, { propertyName: "tableButtons", predicate: OTableButtonComponent }], viewQueries: [{ propertyName: "sort", first: true, predicate: OMatSort, descendants: true }, { propertyName: "cdkVirtualScrollViewport", first: true, predicate: ["virtualScrollViewPort"], descendants: true }, { propertyName: "spinnerContainer", first: true, predicate: ["spinnerContainer"], descendants: true, read: ElementRef }, { propertyName: "tableBodyEl", first: true, predicate: ["tableBody"], descendants: true }, { propertyName: "tableHeaderEl", first: true, predicate: ["tableHeader"], descendants: true, read: ElementRef }, { propertyName: "tableToolbarEl", first: true, predicate: ["tableToolbar"], descendants: true, read: ElementRef }, { propertyName: "oTableMenu", first: true, predicate: ["tableMenu"], descendants: true }, { propertyName: "exportOptsTemplate", first: true, predicate: ["exportOptsTemplate"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"o-table-container\" fxLayout=\"column\" fxLayoutAlign=\"start stretch\" [style.display]=\"isVisible()? '' : 'none'\"\n  [class.block-events]=\"showLoading | async\">\n\n  <o-data-toolbar #tableToolbar *ngIf=\"hasControls()\" [title]=\"title\" [show-title]=\"showTitle\" class=\"o-table-toolbar\">\n    <ng-container o-data-toolbar-projection-start>\n      <o-table-buttons #tableButtons [insert-button]=\"insertButton\" [refresh-button]=\"refreshButton\" [delete-button]=\"showDeleteButton\">\n        <ng-content select=\"o-table-button\"></ng-content>\n      </o-table-buttons>\n    </ng-container>\n    <ng-content select=\"[o-table-toolbar][position=start]\" ngProjectAs=\"[o-data-toolbar-custom-projection-start]\">\n    </ng-content>\n    <ng-content select=\"[o-table-toolbar][position=end]\" ngProjectAs=\"[o-data-toolbar-custom-projection-end]\">\n    </ng-content>\n    <ng-content select=\"[o-table-toolbar]\" ngProjectAs=\"[o-data-toolbar-custom-projection-start]\">\n    </ng-content>\n    <ng-container o-data-toolbar-projection-end>\n      <ng-container *ngIf=\"quickfilterContentChild; else defaultQuickFilter\">\n        <ng-content select=\"o-table-quickfilter\"></ng-content>\n      </ng-container>\n      <ng-template #defaultQuickFilter>\n        <ng-container *ngIf=\"quickFilter\">\n          <o-table-quickfilter (onChange)=\"tableQuickFilterChanged($event)\">\n          </o-table-quickfilter>\n        </ng-container>\n      </ng-template>\n      <button type=\"button\" *ngIf=\"showTableMenuButton\" mat-icon-button class=\"o-table-menu-button\" [matMenuTriggerFor]=\"tableMenu.matMenu\"\n        (click)=\"$event.stopPropagation()\">\n        <mat-icon svgIcon=\"ontimize:more_vert\"></mat-icon>\n      </button>\n      <o-table-menu #tableMenu [select-all-checkbox]=\"selectAllCheckbox\" [export-button]=\"exportButton\"\n        [columns-visibility-button]=\"columnsVisibilityButton\" [show-configuration-option]=\"showConfigurationOption\"\n        [show-filter-option]=\"showFilterOption\" [show-report-on-demand-option]=\"showReportOnDemandOption\"\n        [show-charts-on-demand-option]=\"showChartsOnDemandOption\" [show-reset-width-option]=\"showResetWidthOption\" [show-group-by-option]=\"groupable\">\n        <ng-content select=\"o-table-option\"></ng-content>\n      </o-table-menu>\n      <ng-template #exportOptsTemplate>\n        <ng-content select=\"o-table-export-button\"></ng-content>\n      </ng-template>\n    </ng-container>\n  </o-data-toolbar>\n\n  <div #tableBody class=\"o-table-body o-scroll\" [class.horizontal-scroll]=\"horizontalScroll\" [class.scrolled]=\"horizontalScrolled\">\n    <ng-container *ngIf=\"!enabledVirtualScroll; else tableWithVirtualScroll\">\n      <div class=\"o-table-overflow o-scroll\">\n        <ng-template *ngTemplateOutlet=\"table\"></ng-template>\n      </div>\n    </ng-container>\n    <ng-template #tableWithVirtualScroll>\n      <cdk-virtual-scroll-viewport #virtualScrollViewPort fxFlex>\n        <ng-template *ngTemplateOutlet=\"table\"></ng-template>\n      </cdk-virtual-scroll-viewport>\n    </ng-template>\n  </div>\n  <!--TABLE PAGINATOR-->\n  <mat-paginator *ngIf=\"paginator\" #matpaginator [length]=\"dataSource?.resultsLength\" [pageIndex]=\"paginator.pageIndex\" [pageSize]=\"queryRows\"\n    [pageSizeOptions]=\"paginator.pageSizeOptions\" (page)=\"onChangePage($event)\" [showFirstLastButtons]=\"paginator.showFirstLastButtons\">\n  </mat-paginator>\n\n  <!--LOADING-->\n  <div #spinnerContainer *ngIf=\"showLoading | async\" fxLayout=\"column\" fxLayoutAlign=\"center center\" [ngStyle]=\"{'top.px': headerHeight}\"\n    class=\"spinner-container\" [class.spinner-container-scrollable]=\"loadingScroll | async\">\n    <mat-progress-spinner mode=\"indeterminate\" strokeWidth=\"3\" [diameter]=\"diameterSpinner\"></mat-progress-spinner>\n  </div>\n\n  <!-- Disable blocker -->\n  <div *ngIf=\"!enabled\" class=\"o-table-disabled-blocker\"></div>\n</div>\n\n<ng-template #table>\n\n  <table mat-table #table [class.autoadjusted]=\"autoAdjust\" [trackBy]=\"getTrackByFunction()\" [dataSource]=\"dataSource\" oMatSort\n    [oMatSortColumns]=\"sortColArray\" [ngClass]=\"rowHeightObservable | async\" (cdkObserveContent)=\"projectContentChanged()\"\n    [oTableExpandedFooter]=\"!(loading | async)\" [oTableExpandedFooterColspan]=\"visibleColArray.length\" [multiTemplateDataRows]=\"showExpandableRow()\"\n    aria-describedby=\"ontimize-web table\">\n\n    <!--Checkbox Column -->\n    <ng-container [matColumnDef]=\"oTableOptions.selectColumn.name\" *ngIf=\"oTableOptions.selectColumn.visible\">\n      <ng-container *ngIf=\"!tableColumnSelectAllContentChild; else customHeaderSelectAllTemplate\">\n        <th mat-header-cell *matHeaderCellDef>\n          <div class=\"content\">\n            <o-table-header-select-all [column]=\"oTableOptions.selectColumn\"></o-table-header-select-all>\n          </div>\n        </th>\n        <td mat-cell *matCellDef=\"let row\">\n          <mat-checkbox name=\"id[]\" (click)=\"$event.stopPropagation()\" [disabled]=\"isDisableCheckbox(row)\"\n            (change)=\"selectionCheckboxToggle($event, row)\" [checked]=\"isRowSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-container>\n      <ng-template #customHeaderSelectAllTemplate>\n        <th mat-header-cell *matHeaderCellDef [class.resizable]=\"resizable\"\n          class=\"mat-header-select-all-with-title o-center\" [style.width]=\"oTableOptions.selectColumn.width\"\n          [style.min-width]=\"getMinWidthColumn(oTableOptions.selectColumn)\" [style.max-width]=\"oTableOptions.selectColumn.maxWidth\">\n          <div class=\"content\">\n            <o-table-header-select-all [column]=\"oTableOptions.selectColumn\"></o-table-header-select-all>\n          </div>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" class=\"o-center\" [style.width]=\"oTableOptions.selectColumn.width\"\n          [style.min-width]=\"getMinWidthColumn(oTableOptions.selectColumn)\" [style.max-width]=\"oTableOptions.selectColumn.maxWidth\">\n          <mat-checkbox name=\"id[]\" (click)=\"$event.stopPropagation()\" [disabled]=\"isDisableCheckbox(row)\"\n            (change)=\"selectionCheckboxToggle($event, row)\" [checked]=\"isRowSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-template>\n\n\n      <td mat-footer-cell *matFooterCellDef></td>\n    </ng-container>\n\n    <!--Expandable Column -->\n    <ng-container [matColumnDef]=\"oTableOptions.expandableColumn.name\" *ngIf=\"isColumnExpandable()\">\n      <th mat-header-cell *matHeaderCellDef>\n        {{ oTableOptions.expandableColumn.title }}\n      </th>\n      <td mat-cell *matCellDef=\"let row;let rowIndex = dataIndex\">\n        <mat-icon *ngIf=\"showExpandableIcon(row, rowIndex) | async\" (click)=\"toogleRowExpandable(row, rowIndex, $event)\">\n          <ng-container *ngIf=\"isExpanded(row)\">{{ tableRowExpandable.iconCollapse }}</ng-container>\n          <ng-container *ngIf=\"!isExpanded(row)\">{{ tableRowExpandable.iconExpand }}</ng-container>\n        </mat-icon>\n      </td>\n    </ng-container>\n\n    <!-- Generic column definition -->\n    <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"column.name\">\n      <!--Define header-cell-->\n\n      <th mat-header-cell *matHeaderCellDef [ngClass]=\"getTitleAlignClass(column)\" [class.resizable]=\"resizable\" [style.width]=\"column.width\"\n        [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\">\n\n        <div class=\"content\">\n          <o-table-header [column]=\"column\"></o-table-header>\n        </div>\n      </th>\n\n\n      <!--Define mat-cell-->\n      <ng-container *ngIf=\"!table.multiTemplateDataRows; else cellTemplateMultiTemplateDataRows\">\n        <td #cell mat-cell *matCellDef=\"let row;let rowIndex = index \" [ngClass]=\"[column.className, getCellAlignClass(column)]\"\n          (click)=\"handleClick(row, column, rowIndex, cell, $event)\" (dblclick)=\"handleDoubleClick(row, column, rowIndex, cell, $event)\"\n          [class.empty-cell]=\"isEmpty(row[column.name])\" [matTooltipDisabled]=\"!column.hasTooltip()\" [matTooltip]=\"column.getTooltip(row)\"\n          matTooltipPosition=\"below\" matTooltipShowDelay=\"750\" matTooltipClass=\"o-table-cell-tooltip\"\n          [class.o-mat-cell-multiline]=\"(column.isMultiline | async)\" [oContextMenu]=\"tableContextMenu\"\n          [oContextMenuData]=\"{ cellName:column.name, rowValue:row, rowIndex:rowIndex}\" [style.width]=\"column.width\"\n          [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\"\n          [class.o-table-editing-cell]=\"isRowSelected(row) && column.editing\">\n          <ng-container *ngTemplateOutlet=\"cellRenderer;context:{column:column,row:row}\"></ng-container>\n        </td>\n      </ng-container>\n      <ng-template #cellTemplateMultiTemplateDataRows>\n        <td #cell mat-cell *matCellDef=\"let row;let rowIndex = dataIndex \" [ngClass]=\"[column.className, getCellAlignClass(column)]\"\n          (click)=\"handleClick(row, column, rowIndex, cell, $event)\" (dblclick)=\"handleDoubleClick(row, column, rowIndex, cell, $event)\"\n          [class.empty-cell]=\"isEmpty(row[column.name])\" [matTooltipDisabled]=\"!column.hasTooltip()\" [matTooltip]=\"column.getTooltip(row)\"\n          matTooltipPosition=\"below\" matTooltipShowDelay=\"750\" matTooltipClass=\"o-table-cell-tooltip\"\n          [class.o-mat-cell-multiline]=\"(column.isMultiline | async)\" [oContextMenu]=\"tableContextMenu\"\n          [oContextMenuData]=\"{ cellName:column.name, rowValue:row, rowIndex:rowIndex}\" [style.width]=\"column.width\"\n          [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\"\n          [class.o-table-editing-cell]=\"isRowSelected(row) && column.editing\">\n          <ng-container *ngTemplateOutlet=\"cellRenderer;context:{column:column,row:row}\"></ng-container>\n\n        </td>\n      </ng-template>\n      <!--Define mat-footer-cell-->\n      <ng-container *ngIf=\"showTotals | async\">\n        <td mat-footer-cell *matFooterCellDef [ngClass]=\"column.className\">\n          <div class=\"title\" *ngIf=\"column.aggregate && column.aggregate.title\">\n            {{ column.aggregate.title | oTranslate }}\n          </div>\n          <ng-container *ngIf=\"!column.renderer\">\n            {{ dataSource.getAggregateData(column) }}\n          </ng-container>\n          <ng-template *ngIf=\"column.renderer && column.aggregate\" [ngTemplateOutlet]=\"column.renderer.templateref\"\n            [ngTemplateOutletContext]=\"{cellvalue: dataSource.getAggregateData(column)}\"></ng-template>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <!-- Expanded Content Column - The detail row is made up of this one column that spans across all columns -->\n    <ng-container *ngIf=\"hasExpandedRow\">\n      <ng-container matColumnDef=\"expandedDetail\">\n        <td mat-cell *matCellDef=\"let row;let rowIndex= dataIndex\" [attr.colspan]=\"oTableOptions.visibleColumns.length\">\n          <div [ngClass]=\"getExpandedRowContainerClass(rowIndex)\" [@detailExpand]=\"getStateExpand(row)\">\n          </div>\n        </td>\n      </ng-container>\n    </ng-container>\n\n    <!--FOOTER-INSERTABLE-->\n    <ng-container *ngIf=\"showLastInsertableRow && oTableInsertableRowComponent\">\n      <ng-container [matColumnDef]=\"oTableOptions.selectColumn.name + getSuffixColumnInsertable()\" *ngIf=\"oTableOptions.selectColumn.visible\">\n        <td mat-footer-cell *matFooterCellDef>\n        </td>\n      </ng-container>\n      <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"column.name+ getSuffixColumnInsertable()\">\n\n        <td mat-footer-cell *matFooterCellDef [ngClass]=\"column.className\">\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && !oTableInsertableRowComponent.useCellEditor(column)\">\n            <mat-form-field class=\"insertable-form-field o-table-cell-editor-text o-table-cell-editor\" [hideRequiredMarker]=\"false\">\n              <input matInput type=\"text\" [placeholder]=\"oTableInsertableRowComponent.getPlaceholder(column)\" [id]=\"column.attr\"\n                [formControl]=\"oTableInsertableRowComponent.getControl(column)\" [required]=\"oTableInsertableRowComponent.isColumnRequired(column)\">\n              <mat-error *oMatError=\"oTableInsertableRowComponent.columnHasError(column, 'required')\">\n                {{ 'FORM_VALIDATION.REQUIRED' | oTranslate }}\n              </mat-error>\n            </mat-form-field>\n          </ng-container>\n\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && oTableInsertableRowComponent.useCellEditor(column)\">\n            <ng-template [ngTemplateOutlet]=\"oTableInsertableRowComponent.columnEditors[column.attr].templateref\"\n              [ngTemplateOutletContext]=\"{ rowvalue: oTableInsertableRowComponent.rowData }\">\n            </ng-template>\n          </ng-container>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <ng-container *ngIf=\"showFirstInsertableRow && oTableInsertableRowComponent\">\n      <ng-container [matColumnDef]=\"getColumnInsertable(oTableOptions.selectColumn.name)\" *ngIf=\"oTableOptions.selectColumn.visible\">\n        <td mat-header-cell *matHeaderCellDef>\n        </td>\n      </ng-container>\n      <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"getColumnInsertable(column.name)\">\n\n        <td mat-header-cell *matHeaderCellDef [ngClass]=\"column.className\">\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && !oTableInsertableRowComponent.useCellEditor(column)\">\n            <mat-form-field class=\"insertable-form-field\" [hideRequiredMarker]=\"false\">\n              <input matInput type=\"text\" [placeholder]=\"oTableInsertableRowComponent.getPlaceholder(column)\" [id]=\"column.attr\"\n                [formControl]=\"oTableInsertableRowComponent.getControl(column)\" [required]=\"oTableInsertableRowComponent.isColumnRequired(column)\">\n              <mat-error *oMatError=\"oTableInsertableRowComponent.columnHasError(column, 'required')\">\n                {{ 'FORM_VALIDATION.REQUIRED' | oTranslate }}\n              </mat-error>\n            </mat-form-field>\n          </ng-container>\n\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && oTableInsertableRowComponent.useCellEditor(column)\">\n            <ng-template [ngTemplateOutlet]=\"oTableInsertableRowComponent.columnEditors[column.attr].templateref\"\n              [ngTemplateOutletContext]=\"{ rowvalue: oTableInsertableRowComponent.rowData }\">\n            </ng-template>\n          </ng-container>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <!-- Definition column group header -->\n    <ng-container *ngFor=\"let column of groupingHeadersRows; let i = index\" [matColumnDef]=\"column\">\n      <td mat-cell *matCellDef=\"let group\" class=\"grouping-row\" [oContextMenu]=\"tableContextMenu\"\n        [oContextMenuData]=\"{ cellName:column, rowValue:group, rowIndex:i}\" [ngClass]=\"getGroupHeaderCellAlignClass(column)\">\n        <div *ngIf=\"i===0\" class=\"grouping-title-wrapper\" [ngStyle]=\"{'padding-left': 20*(group.level-1)+'px'}\">\n          <mat-icon>{{ group.expanded ? 'expand_more' : 'chevron_right' }}</mat-icon>\n          {{ group.title }}\n        </div>\n        <div class=\"grouping-aggregate\" *ngIf=\"group.hasActiveAggregate(visibleColArray[i])\">\n          {{ group.getColumnActiveAggregateTitle(visibleColArray[i]) | oTranslate }} :\n          <ng-container *ngIf=\"!getOColumnFromGroupHeaderColumn(column).renderer\">\n            {{ group.getColumnAggregateValue(visibleColArray[i])}}\n          </ng-container>\n          <ng-container *ngIf=\"getOColumnFromGroupHeaderColumn(column).renderer\">\n            <ng-template\n              *ngTemplateOutlet=\"getOColumnFromGroupHeaderColumn(column).renderer?.templateref; context:{ cellvalue:  group.getColumnAggregateValue(visibleColArray[i]) }\">\n            </ng-template>\n          </ng-container>\n        </div>\n      </td>\n    </ng-container>\n\n    <ng-container matColumnDef=\"position\">\n      <td mat-cell *matCellDef=\"let row\"> {{row}} </td>\n    </ng-container>\n\n    <tr #tableHeader mat-header-row *matHeaderRowDef=\"oTableOptions.visibleColumns; sticky: fixedHeader\"></tr>\n\n    <ng-container *ngIf=\"!table.multiTemplateDataRows; else rowTemplateMultiTemplateDataRows\">\n      <tr mat-row oTableRow *matRowDef=\"let row; columns: oTableOptions.visibleColumns; when:isNotGroup; let rowIndex = index\"\n        [class.selected]=\"isRowSelected(row)\" [ngClass]=\"row | oTableRowClass: rowIndex: rowClass\">\n      </tr>\n    </ng-container>\n    <ng-template #rowTemplateMultiTemplateDataRows>\n      <tr mat-row oTableRow *matRowDef=\"let row; columns: oTableOptions.visibleColumns; when:isNotGroup; let rowIndex = dataIndex\"\n        [class.selected]=\"isRowSelected(row)\" [ngClass]=\"row | oTableRowClass: rowIndex: rowClass\">\n      </tr>\n    </ng-template>\n\n    <!-- Row Group header -->\n    <tr mat-row *matRowDef=\"let row; columns: groupingHeadersRows; when:isGroup\" (click)=\"groupHeaderClick(row)\"\n      [ngClass]=\"getClassNameGroupHeader(row)\">\n    </tr>\n\n    <!-- Expanded detail row-->\n    <ng-container *ngIf=\"hasExpandedRow\">\n      <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"o-table-row-expanded\"></tr>\n    </ng-container>\n\n    <ng-container *ngIf=\"showLastInsertableRow\">\n      <tr mat-footer-row *matFooterRowDef=\"oTableOptions.columnsInsertables; sticky: true\"\n        (keyup)=\"oTableInsertableRowComponent.handleKeyboardEvent($event)\" class=\"o-table-insertable\"></tr>\n    </ng-container>\n    <ng-container *ngIf=\"showFirstInsertableRow\">\n      <tr mat-header-row *matHeaderRowDef=\"oTableOptions.columnsInsertables; sticky: true\"\n        (keyup)=\"oTableInsertableRowComponent.handleKeyboardEvent($event)\" class=\"o-table-insertable\"> </tr>\n    </ng-container>\n    <ng-container *ngIf=\"showTotals | async\">\n      <tr mat-footer-row *matFooterRowDef=\"oTableOptions.visibleColumns; sticky: true\" class=\"o-table-aggregate\">\n      </tr>\n    </ng-container>\n  </table>\n\n</ng-template>\n\n<ng-container *ngIf=\"!contextMenuContentChild && contextMenu\">\n  <o-table-context-menu [insert]=\"insertButton\" [edit]=\"editionMode !== EDIT_MODE_NONE\" [view-detail]=\"detailMode !== DETAIL_MODE_NONE\"\n    [refresh]=\"refreshButton\" [delete]=\"deleteButton\" [filter]=\"showFilterOption\" [group-by-row]=\"groupable\">\n  </o-table-context-menu>\n</ng-container>\n\n<ng-template #cellRenderer let-row=\"row\" let-column=\"column\">\n  <div class=\"content\">\n\n    <ng-container [ngSwitch]=\"true\">\n      <ng-container *ngSwitchCase=\"column.renderer != null && (!column.editing || column.editing && !isRowSelected(row))\">\n        <ng-template *ngTemplateOutlet=\"column.renderer?.templateref; context:{ cellvalue: row[column.name], rowvalue:row }\">\n        </ng-template>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"isRowSelected(row) && column.editing\">\n        <ng-template *ngTemplateOutlet=\"column.editor?.templateref; context:{ cellvalue: row[column.name], rowvalue:row }\">\n        </ng-template>\n      </ng-container>\n\n      <ng-container *ngSwitchCase=\"column.type === 'editButtonInRow' || column.type === 'detailButtonInRow'\">\n        <div fxLayoutAlign=\"center center\" class=\"o-action-cell-renderer\" (click)=\"onDetailButtonClick(column, row, $event)\">\n          <mat-icon>{{ getDetailButtonIcon(column) }}</mat-icon>\n        </div>\n      </ng-container>\n      <ng-container *ngSwitchDefault>{{ row[column.name] }}</ng-container>\n    </ng-container>\n\n  </div>\n</ng-template>\n", styles: [".o-table{height:100%;max-height:100%;width:100%}.o-table.o-table-disabled{opacity:.4}.o-table .o-table-container{height:100%;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;align-items:flex-start;align-content:stretch;min-width:100%;min-height:400px;position:relative;padding:0 .5%}.o-table .o-table-container .o-table-body{display:flex;flex:1 1 auto}.o-table .o-table-container .o-table-body .o-table-overflow{overflow-y:auto;overflow-x:hidden;min-width:100%}.o-table .o-table-container .o-table-body.horizontal-scroll .o-table-overflow{overflow-x:auto}.o-table .o-table-container .o-table-body thead .mat-mdc-header-row th:last-child .o-table-column-resizer{display:none}.o-table .o-table-container.block-events{pointer-events:none}.o-table .o-table-container.block-events>.o-table-toolbar,.o-table .o-table-container.block-events>.o-table-body .mat-mdc-header-row{opacity:.75}.o-table .o-table-container .o-table-toolbar{height:40px}.o-table .o-table-container .o-table-toolbar>div{max-height:100%}.o-table .o-table-container .o-table-toolbar .buttons{margin:0 10px 0 4px}.o-table .o-table-container .o-table-body{max-width:100%;height:100%;overflow:hidden;position:relative}.o-table .o-table-container .o-table-body .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}.o-table .o-table-container .o-table-body.horizontal-scroll{overflow-x:auto;padding-bottom:16px}.o-table .o-table-container .o-table-body.horizontal-scroll .mat-mdc-header-cell{width:150px}.o-table .o-table-container .o-table-body .o-table-no-results{cursor:default;text-align:center}.o-table .o-table-container .o-table-body .o-table-no-results td{text-align:center}.o-table .o-table-container .mat-mdc-table{table-layout:fixed;width:100%}.o-table .o-table-container .mat-mdc-table.autoadjusted{table-layout:auto}.o-table .o-table-container .mat-mdc-table td .content,.o-table .o-table-container .mat-mdc-table th .content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table.small .mat-mdc-header-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-header-row .mat-mdc-header-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-row .mat-mdc-header-cell .image-avatar{width:24px;height:24px}.o-table .o-table-container .mat-mdc-table.large .column-filter-icon{margin-top:4px}.o-table .o-table-container .mat-mdc-table.large .mat-sort-header-arrow{margin-top:7px}.o-table .o-table-container .mat-mdc-table tr.mat-mdc-row.o-table-row-expanded{height:0}.o-table .o-table-container .mat-mdc-table tr.o-table-insertable td{height:1px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row{box-sizing:border-box;transition:background-color .2s;position:relative;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell{padding:0 12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell:not(.o-column-image):first-of-type,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell:not(.o-column-image):first-of-type{padding-left:24px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell:last-of-type,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell:last-of-type{padding-right:24px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row{padding-top:30px;cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row .grouping-title-wrapper,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row .grouping-title-wrapper{position:absolute;width:100%;left:0;top:0;text-align:left}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row .grouping-aggregate,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row .grouping-aggregate{font-weight:700;font-size:14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-bottom:8px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.empty-cell,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.empty-cell{min-height:16px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .action-cell-renderer,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .action-cell-renderer{cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-start,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-start{text-align:start}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-center,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-center{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-end,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-end{text-align:end}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell *,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell *{vertical-align:middle}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-mat-cell-multiline:not(.mat-mdc-header-cell),.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-mat-cell-multiline:not(.mat-mdc-header-cell){padding:6px 12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-mat-cell-multiline .content,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-mat-cell-multiline .content{overflow:initial;white-space:normal;text-overflow:unset}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .image-avatar{width:32px;height:32px;margin:1px auto;overflow:hidden;border-radius:50%;position:relative;z-index:1}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .image-avatar img,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .image-avatar img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-width:inherit;max-height:inherit}.o-table .o-table-container .mat-mdc-table .o-action-cell-renderer{display:inline-block;cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell{overflow:hidden;position:relative;box-sizing:border-box;padding:0 12px;vertical-align:middle}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select.mat-header-select-all-with-title{padding-right:12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:first-of-type{padding-left:0}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:not(.o-column-image){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .o-table-header-indicator-numbered{font-size:8px;position:absolute;text-align:center;display:inline-block;width:18px;height:18px;line-height:18px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;bottom:-10px;right:-9px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .column-filter-icon{cursor:pointer;font-size:18px;width:18px;height:18px;line-height:1}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .mat-sort-header-button{flex:1;display:block;place-content:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .header-title-container{cursor:default;min-height:20px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .header-title-container,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .mat-sort-header-button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.start,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.start .mat-sort-header-button{text-align:left}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.center,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.center .mat-sort-header-button{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.end,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.end .mat-sort-header-button{text-align:right}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select{box-sizing:content-box;overflow:initial}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select:not(.mat-header-select-all-with-title),.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select:not(.mat-header-select-all-with-title){width:18px}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select .mat-checkbox-layout,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select .mat-checkbox-layout{text-overflow:ellipsis;overflow:hidden;display:inline}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-expandable,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-expandable{width:40px;box-sizing:content-box;padding:0 0 0 24px;overflow:initial}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell .row-container-expanded{overflow:hidden;display:flex}.o-table .o-table-container .o-table-disabled-blocker{bottom:0;left:0;position:absolute;right:0;top:0;z-index:100}.o-table .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}.o-table .spinner-container-scrollable{position:relative}.o-table.o-table-fixed{display:flex}.o-table.o-table-fixed .o-table-container{display:flex;flex-direction:column}.o-table.o-table-fixed .o-table-body{display:flex;flex:1}.o-table.o-table-fixed .o-table-body .o-table-overflow{flex:1;overflow-y:auto}.mat-mdc-tooltip.o-table-cell-tooltip{word-wrap:break-word;overflow:hidden;min-width:140px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i4$1.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i4$1.DefaultStyleDirective, selector: "  [ngStyle],  [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],  [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],  [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { kind: "directive", type: i3$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: OMatErrorDirective, selector: "[oMatError]", inputs: ["oMatError"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i5$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i15.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i15.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i15.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i15.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i15.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i15.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i15.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i15.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i15.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i15.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i15.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i15.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i15.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i15.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "component", type: i11$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i7$3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: OContextMenuDirective, selector: "[oContextMenu]", inputs: ["oContextMenu", "oContextMenuData"] }, { kind: "directive", type: i19.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }, { kind: "directive", type: OMatSort, selector: "[oMatSort]", inputs: ["oMatSortDisabled", "oMatSortColumns"], outputs: ["matSortChange"], exportAs: ["oMatSort"] }, { kind: "component", type: ODataToolbarComponent, selector: "o-data-toolbar", inputs: ["show-title", "title"] }, { kind: "component", type: OTableContextMenuComponent, selector: "o-table-context-menu", inputs: ["context-menu", "insert", "edit", "view-detail", "copy", "select-all", "refresh", "delete", "filter", "group-by-row"] }, { kind: "directive", type: OTableRowDirective, selector: "[oTableRow]" }, { kind: "directive", type: OTableExpandedFooterDirective, selector: "[oTableExpandedFooter]", inputs: ["oTableExpandedFooter", "oTableExpandedFooterColspan"] }, { kind: "component", type: OTableButtonsComponent, selector: "o-table-buttons", inputs: ["insert-button", "refresh-button", "delete-button"] }, { kind: "component", type: OTableMenuComponent, selector: "o-table-menu", inputs: ["select-all-checkbox", "export-button", "columns-visibility-button", "show-configuration-option", "show-filter-option", "show-group-by-option", "show-reset-width-option", "show-report-on-demand-option", "show-charts-on-demand-option"] }, { kind: "component", type: OTableQuickfilterComponent, selector: "o-table-quickfilter", inputs: ["placeholder"], outputs: ["onChange"] }, { kind: "component", type: OTableHeaderComponent, selector: "o-table-header", inputs: ["column"] }, { kind: "component", type: OTableHeaderSelectAllComponent, selector: "o-table-header-select-all", inputs: ["column"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }, { kind: "pipe", type: OTableRowClassPipe, name: "oTableRowClass" }], animations: [
+    ], queries: [{ propertyName: "tableRowExpandable", first: true, predicate: OTableRowExpandableComponent, descendants: true }, { propertyName: "quickfilterContentChild", first: true, predicate: ["o-table-quickfilter"], descendants: true, static: true }, { propertyName: "tableColumnSelectAllContentChild", first: true, predicate: OTableColumnSelectAllDirective, descendants: true }, { propertyName: "contextMenuContentChild", first: true, predicate: OTableContextMenuComponent, descendants: true, static: true }, { propertyName: "tableOptions", predicate: OTableOptionComponent }, { propertyName: "tableButtons", predicate: OTableButtonComponent }], viewQueries: [{ propertyName: "sort", first: true, predicate: OMatSort, descendants: true }, { propertyName: "cdkVirtualScrollViewport", first: true, predicate: ["virtualScrollViewPort"], descendants: true }, { propertyName: "spinnerContainer", first: true, predicate: ["spinnerContainer"], descendants: true, read: ElementRef }, { propertyName: "tableBodyEl", first: true, predicate: ["tableBody"], descendants: true }, { propertyName: "tableHeaderEl", first: true, predicate: ["tableHeader"], descendants: true, read: ElementRef }, { propertyName: "tableToolbarEl", first: true, predicate: ["tableToolbar"], descendants: true, read: ElementRef }, { propertyName: "oTableMenu", first: true, predicate: ["tableMenu"], descendants: true }, { propertyName: "exportOptsTemplate", first: true, predicate: ["exportOptsTemplate"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"o-table-container\" fxLayout=\"column\" fxLayoutAlign=\"start stretch\" [style.display]=\"isVisible()? '' : 'none'\"\n  [class.block-events]=\"showLoading | async\">\n\n  <o-data-toolbar #tableToolbar *ngIf=\"hasControls()\" [title]=\"title\" [show-title]=\"showTitle\" class=\"o-table-toolbar\">\n    <ng-container o-data-toolbar-projection-start>\n      <o-table-buttons #tableButtons [insert-button]=\"insertButton\" [refresh-button]=\"refreshButton\" [delete-button]=\"showDeleteButton\">\n        <ng-content select=\"o-table-button\"></ng-content>\n      </o-table-buttons>\n    </ng-container>\n    <ng-content select=\"[o-table-toolbar][position=start]\" ngProjectAs=\"[o-data-toolbar-custom-projection-start]\">\n    </ng-content>\n    <ng-content select=\"[o-table-toolbar][position=end]\" ngProjectAs=\"[o-data-toolbar-custom-projection-end]\">\n    </ng-content>\n    <ng-content select=\"[o-table-toolbar]\" ngProjectAs=\"[o-data-toolbar-custom-projection-start]\">\n    </ng-content>\n    <ng-container o-data-toolbar-projection-end>\n      <ng-container *ngIf=\"quickfilterContentChild; else defaultQuickFilter\">\n        <ng-content select=\"o-table-quickfilter\"></ng-content>\n      </ng-container>\n      <ng-template #defaultQuickFilter>\n        <ng-container *ngIf=\"quickFilter\">\n          <o-table-quickfilter (onChange)=\"tableQuickFilterChanged($event)\">\n          </o-table-quickfilter>\n        </ng-container>\n      </ng-template>\n      <button type=\"button\" *ngIf=\"showTableMenuButton\" mat-icon-button class=\"o-table-menu-button\" [matMenuTriggerFor]=\"tableMenu.matMenu\"\n        (click)=\"$event.stopPropagation()\">\n        <mat-icon svgIcon=\"ontimize:more_vert\"></mat-icon>\n      </button>\n      <o-table-menu #tableMenu [select-all-checkbox]=\"selectAllCheckbox\" [export-button]=\"exportButton\"\n        [columns-visibility-button]=\"columnsVisibilityButton\" [show-configuration-option]=\"showConfigurationOption\"\n        [show-filter-option]=\"showFilterOption\" [show-report-on-demand-option]=\"showReportOnDemandOption\"\n        [show-charts-on-demand-option]=\"showChartsOnDemandOption\" [show-reset-width-option]=\"showResetWidthOption\" [show-group-by-option]=\"groupable\">\n        <ng-content select=\"o-table-option\"></ng-content>\n      </o-table-menu>\n      <ng-template #exportOptsTemplate>\n        <ng-content select=\"o-table-export-button\"></ng-content>\n      </ng-template>\n    </ng-container>\n  </o-data-toolbar>\n\n  <div #tableBody class=\"o-table-body o-scroll\" [class.horizontal-scroll]=\"horizontalScroll\" [class.scrolled]=\"horizontalScrolled\">\n    <ng-container *ngIf=\"!enabledVirtualScroll; else tableWithVirtualScroll\">\n      <div class=\"o-table-overflow o-scroll\">\n        <ng-template *ngTemplateOutlet=\"table\"></ng-template>\n      </div>\n    </ng-container>\n    <ng-template #tableWithVirtualScroll>\n      <cdk-virtual-scroll-viewport #virtualScrollViewPort fxFlex>\n        <ng-template *ngTemplateOutlet=\"table\"></ng-template>\n      </cdk-virtual-scroll-viewport>\n    </ng-template>\n  </div>\n  <!--TABLE PAGINATOR-->\n  <mat-paginator *ngIf=\"paginator\" #matpaginator [length]=\"dataSource?.resultsLength\" [pageIndex]=\"paginator.pageIndex\" [pageSize]=\"queryRows\"\n    [pageSizeOptions]=\"paginator.pageSizeOptions\" (page)=\"onChangePage($event)\" [showFirstLastButtons]=\"paginator.showFirstLastButtons\">\n  </mat-paginator>\n\n  <!--LOADING-->\n  <div #spinnerContainer *ngIf=\"showLoading | async\" fxLayout=\"column\" fxLayoutAlign=\"center center\" [ngStyle]=\"{'top.px': headerHeight}\"\n    class=\"spinner-container\" [class.spinner-container-scrollable]=\"loadingScroll | async\">\n    <mat-progress-spinner mode=\"indeterminate\" strokeWidth=\"3\" [diameter]=\"diameterSpinner\"></mat-progress-spinner>\n  </div>\n\n  <!-- Disable blocker -->\n  <div *ngIf=\"!enabled\" class=\"o-table-disabled-blocker\"></div>\n</div>\n\n<ng-template #table>\n\n  <table mat-table #table [class.autoadjusted]=\"autoAdjust\" [trackBy]=\"getTrackByFunction()\" [dataSource]=\"dataSource\" oMatSort\n    [oMatSortColumns]=\"sortColArray\" [ngClass]=\"rowHeightObservable | async\" (cdkObserveContent)=\"projectContentChanged()\"\n    [oTableExpandedFooter]=\"!(loading | async)\" [oTableExpandedFooterColspan]=\"visibleColArray.length\" [multiTemplateDataRows]=\"showExpandableRow()\"\n    aria-describedby=\"ontimize-web table\">\n\n    <!--Checkbox Column -->\n    <ng-container [matColumnDef]=\"oTableOptions.selectColumn.name\" *ngIf=\"oTableOptions.selectColumn.visible\">\n      <ng-container *ngIf=\"!tableColumnSelectAllContentChild; else customHeaderSelectAllTemplate\">\n        <th mat-header-cell *matHeaderCellDef>\n          <div class=\"content\">\n            <o-table-header-select-all [column]=\"oTableOptions.selectColumn\"></o-table-header-select-all>\n          </div>\n        </th>\n        <td mat-cell *matCellDef=\"let row\">\n          <mat-checkbox name=\"id[]\" (click)=\"$event.stopPropagation()\" [disabled]=\"isDisableCheckbox(row)\"\n            (change)=\"selectionCheckboxToggle($event, row)\" [checked]=\"isRowSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-container>\n      <ng-template #customHeaderSelectAllTemplate>\n        <th mat-header-cell *matHeaderCellDef [class.resizable]=\"resizable\" class=\"mat-header-select-all-with-title o-center\"\n          [style.width]=\"oTableOptions.selectColumn.width\" [style.min-width]=\"getMinWidthColumn(oTableOptions.selectColumn)\"\n          [style.max-width]=\"oTableOptions.selectColumn.maxWidth\">\n          <div class=\"content\">\n            <o-table-header-select-all [column]=\"oTableOptions.selectColumn\"></o-table-header-select-all>\n          </div>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" class=\"o-center\" [style.width]=\"oTableOptions.selectColumn.width\"\n          [style.min-width]=\"getMinWidthColumn(oTableOptions.selectColumn)\" [style.max-width]=\"oTableOptions.selectColumn.maxWidth\">\n          <mat-checkbox name=\"id[]\" (click)=\"$event.stopPropagation()\" [disabled]=\"isDisableCheckbox(row)\"\n            (change)=\"selectionCheckboxToggle($event, row)\" [checked]=\"isRowSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-template>\n\n\n      <td mat-footer-cell *matFooterCellDef></td>\n    </ng-container>\n\n    <!--Expandable Column -->\n    <ng-container [matColumnDef]=\"oTableOptions.expandableColumn.name\" *ngIf=\"isColumnExpandable()\">\n      <th mat-header-cell *matHeaderCellDef>\n        {{ oTableOptions.expandableColumn.title }}\n      </th>\n      <td mat-cell *matCellDef=\"let row;let rowIndex = dataIndex\">\n        <mat-icon *ngIf=\"showExpandableIcon(row, rowIndex) | async\" (click)=\"toogleRowExpandable(row, rowIndex, $event)\">\n          <ng-container *ngIf=\"isExpanded(row)\">{{ tableRowExpandable.iconCollapse }}</ng-container>\n          <ng-container *ngIf=\"!isExpanded(row)\">{{ tableRowExpandable.iconExpand }}</ng-container>\n        </mat-icon>\n      </td>\n    </ng-container>\n\n    <!-- Generic column definition -->\n    <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"column.name\">\n      <!--Define header-cell-->\n\n      <th mat-header-cell *matHeaderCellDef [ngClass]=\"getTitleAlignClass(column)\" [class.resizable]=\"resizable\" [style.width]=\"column.width\"\n        [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\">\n\n        <div class=\"content\">\n          <o-table-header [column]=\"column\"></o-table-header>\n        </div>\n      </th>\n\n\n      <!--Define mat-cell-->\n      <ng-container *ngIf=\"!table.multiTemplateDataRows; else cellTemplateMultiTemplateDataRows\">\n        <td #cell mat-cell *matCellDef=\"let row;let rowIndex = index \" [ngClass]=\"[column.className, getCellAlignClass(column)]\"\n          (click)=\"handleClick(row, column, rowIndex, cell, $event)\" (dblclick)=\"handleDoubleClick(row, column, rowIndex, cell, $event)\"\n          [class.empty-cell]=\"isEmpty(row[column.name])\" [matTooltipDisabled]=\"!column.hasTooltip()\" [matTooltip]=\"column.getTooltip(row)\"\n          matTooltipPosition=\"below\" matTooltipShowDelay=\"750\" matTooltipClass=\"o-table-cell-tooltip\"\n          [class.o-mat-cell-multiline]=\"(column.isMultiline | async)\" [oContextMenu]=\"tableContextMenu\"\n          [oContextMenuData]=\"{ cellName:column.name, rowValue:row, rowIndex:rowIndex}\" [style.width]=\"column.width\"\n          [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\"\n          [class.o-table-editing-cell]=\"isRowSelected(row) && column.editing\">\n          <ng-container *ngTemplateOutlet=\"cellRenderer;context:{column:column,row:row}\"></ng-container>\n        </td>\n      </ng-container>\n      <ng-template #cellTemplateMultiTemplateDataRows>\n        <td #cell mat-cell *matCellDef=\"let row;let rowIndex = dataIndex \" [ngClass]=\"[column.className, getCellAlignClass(column)]\"\n          (click)=\"handleClick(row, column, rowIndex, cell, $event)\" (dblclick)=\"handleDoubleClick(row, column, rowIndex, cell, $event)\"\n          [class.empty-cell]=\"isEmpty(row[column.name])\" [matTooltipDisabled]=\"!column.hasTooltip()\" [matTooltip]=\"column.getTooltip(row)\"\n          matTooltipPosition=\"below\" matTooltipShowDelay=\"750\" matTooltipClass=\"o-table-cell-tooltip\"\n          [class.o-mat-cell-multiline]=\"(column.isMultiline | async)\" [oContextMenu]=\"tableContextMenu\"\n          [oContextMenuData]=\"{ cellName:column.name, rowValue:row, rowIndex:rowIndex}\" [style.width]=\"column.width\"\n          [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\"\n          [class.o-table-editing-cell]=\"isRowSelected(row) && column.editing\">\n          <ng-container *ngTemplateOutlet=\"cellRenderer;context:{column:column,row:row}\"></ng-container>\n\n        </td>\n      </ng-template>\n      <!--Define mat-footer-cell-->\n      <ng-container *ngIf=\"showTotals | async\">\n        <td mat-footer-cell *matFooterCellDef [ngClass]=\"column.className\">\n          <div class=\"title\" *ngIf=\"column.aggregate && column.aggregate.title\">\n            {{ column.aggregate.title | oTranslate }}\n          </div>\n          <ng-container *ngIf=\"!column.renderer\">\n            {{ dataSource.getAggregateData(column) }}\n          </ng-container>\n          <ng-template *ngIf=\"column.renderer && column.aggregate\" [ngTemplateOutlet]=\"column.renderer.templateref\"\n            [ngTemplateOutletContext]=\"{cellvalue: dataSource.getAggregateData(column)}\"></ng-template>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <!-- Expanded Content Column - The detail row is made up of this one column that spans across all columns -->\n    <ng-container *ngIf=\"hasExpandedRow\">\n      <ng-container matColumnDef=\"expandedDetail\">\n        <td mat-cell *matCellDef=\"let row;let rowIndex= dataIndex\" [attr.colspan]=\"oTableOptions.visibleColumns.length\">\n          <div [ngClass]=\"getExpandedRowContainerClass(rowIndex)\" [@detailExpand]=\"getStateExpand(row)\">\n          </div>\n        </td>\n      </ng-container>\n    </ng-container>\n\n    <!--FOOTER-INSERTABLE-->\n    <ng-container *ngIf=\"showLastInsertableRow && oTableInsertableRowComponent\">\n      <ng-container [matColumnDef]=\"oTableOptions.selectColumn.name + getSuffixColumnInsertable()\" *ngIf=\"oTableOptions.selectColumn.visible\">\n        <td mat-footer-cell *matFooterCellDef>\n        </td>\n      </ng-container>\n      <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"column.name+ getSuffixColumnInsertable()\">\n\n        <td mat-footer-cell *matFooterCellDef [ngClass]=\"column.className\">\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && !oTableInsertableRowComponent.useCellEditor(column)\">\n            <mat-form-field class=\"insertable-form-field o-table-cell-editor-text o-table-cell-editor\" [hideRequiredMarker]=\"false\">\n              <input matInput type=\"text\" [placeholder]=\"oTableInsertableRowComponent.getPlaceholder(column)\" [id]=\"column.attr\"\n                [formControl]=\"oTableInsertableRowComponent.getControl(column)\" [required]=\"oTableInsertableRowComponent.isColumnRequired(column)\">\n              <mat-error *oMatError=\"oTableInsertableRowComponent.columnHasError(column, 'required')\">\n                {{ 'FORM_VALIDATION.REQUIRED' | oTranslate }}\n              </mat-error>\n            </mat-form-field>\n          </ng-container>\n\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && oTableInsertableRowComponent.useCellEditor(column)\">\n            <ng-template [ngTemplateOutlet]=\"oTableInsertableRowComponent.columnEditors[column.attr].templateref\"\n              [ngTemplateOutletContext]=\"{ rowvalue: oTableInsertableRowComponent.rowData }\">\n            </ng-template>\n          </ng-container>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <ng-container *ngIf=\"showFirstInsertableRow && oTableInsertableRowComponent\">\n      <ng-container [matColumnDef]=\"getColumnInsertable(oTableOptions.selectColumn.name)\" *ngIf=\"oTableOptions.selectColumn.visible\">\n        <td mat-header-cell *matHeaderCellDef>\n        </td>\n      </ng-container>\n      <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"getColumnInsertable(column.name)\">\n\n        <td mat-header-cell *matHeaderCellDef [ngClass]=\"column.className\">\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && !oTableInsertableRowComponent.useCellEditor(column)\">\n            <mat-form-field class=\"insertable-form-field\" [hideRequiredMarker]=\"false\">\n              <input matInput type=\"text\" [placeholder]=\"oTableInsertableRowComponent.getPlaceholder(column)\" [id]=\"column.attr\"\n                [formControl]=\"oTableInsertableRowComponent.getControl(column)\" [required]=\"oTableInsertableRowComponent.isColumnRequired(column)\">\n              <mat-error *oMatError=\"oTableInsertableRowComponent.columnHasError(column, 'required')\">\n                {{ 'FORM_VALIDATION.REQUIRED' | oTranslate }}\n              </mat-error>\n            </mat-form-field>\n          </ng-container>\n\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && oTableInsertableRowComponent.useCellEditor(column)\">\n            <ng-template [ngTemplateOutlet]=\"oTableInsertableRowComponent.columnEditors[column.attr].templateref\"\n              [ngTemplateOutletContext]=\"{ rowvalue: oTableInsertableRowComponent.rowData }\">\n            </ng-template>\n          </ng-container>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <!-- Definition column group header -->\n    <ng-container *ngFor=\"let column of groupingHeadersRows; let i = index\" [matColumnDef]=\"column\">\n      <td mat-cell *matCellDef=\"let group\" class=\"grouping-row\" [oContextMenu]=\"tableContextMenu\"\n        [oContextMenuData]=\"{ cellName:column, rowValue:group, rowIndex:i}\" [ngClass]=\"getGroupHeaderCellAlignClass(column)\">\n        <div *ngIf=\"i===0\" class=\"grouping-title-wrapper\" [ngStyle]=\"{'padding-left': 20*(group.level-1)+'px'}\">\n          <mat-icon>{{ group.expanded ? 'expand_more' : 'chevron_right' }}</mat-icon>\n          {{ group.title }}\n        </div>\n        <div class=\"grouping-aggregate\" *ngIf=\"group.hasActiveAggregate(visibleColArray[i])\">\n          {{ group.getColumnActiveAggregateTitle(visibleColArray[i]) | oTranslate }} :\n          <ng-container *ngIf=\"!getOColumnFromGroupHeaderColumn(column).renderer\">\n            {{ group.getColumnAggregateValue(visibleColArray[i])}}\n          </ng-container>\n          <ng-container *ngIf=\"getOColumnFromGroupHeaderColumn(column).renderer\">\n            <ng-template\n              *ngTemplateOutlet=\"getOColumnFromGroupHeaderColumn(column).renderer?.templateref; context:{ cellvalue:  group.getColumnAggregateValue(visibleColArray[i]) }\">\n            </ng-template>\n          </ng-container>\n        </div>\n      </td>\n    </ng-container>\n\n    <ng-container matColumnDef=\"position\">\n      <td mat-cell *matCellDef=\"let row\"> {{row}} </td>\n    </ng-container>\n\n    <tr #tableHeader mat-header-row *matHeaderRowDef=\"oTableOptions.visibleColumns; sticky: fixedHeader\"></tr>\n\n    <ng-container *ngIf=\"!table.multiTemplateDataRows; else rowTemplateMultiTemplateDataRows\">\n      <tr mat-row oTableRow *matRowDef=\"let row; columns: oTableOptions.visibleColumns; when:isNotGroup; let rowIndex = index\"\n        [class.selected]=\"isRowSelected(row)\" [ngClass]=\"row | oTableRowClass: rowIndex: rowClass\">\n      </tr>\n    </ng-container>\n    <ng-template #rowTemplateMultiTemplateDataRows>\n      <tr mat-row oTableRow *matRowDef=\"let row; columns: oTableOptions.visibleColumns; when:isNotGroup; let rowIndex = dataIndex\"\n        [class.selected]=\"isRowSelected(row)\" [ngClass]=\"row | oTableRowClass: rowIndex: rowClass\">\n      </tr>\n    </ng-template>\n\n    <!-- Row Group header -->\n    <tr mat-row *matRowDef=\"let row; columns: groupingHeadersRows; when:isGroup\" (click)=\"groupHeaderClick(row)\"\n      [ngClass]=\"getClassNameGroupHeader(row)\">\n    </tr>\n\n    <!-- Expanded detail row-->\n    <ng-container *ngIf=\"hasExpandedRow\">\n      <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"o-table-row-expanded\"></tr>\n    </ng-container>\n\n    <ng-container *ngIf=\"showLastInsertableRow\">\n      <tr mat-footer-row *matFooterRowDef=\"oTableOptions.columnsInsertables; sticky: true\"\n        (keyup)=\"oTableInsertableRowComponent.handleKeyboardEvent($event)\" class=\"o-table-insertable\"></tr>\n    </ng-container>\n    <ng-container *ngIf=\"showFirstInsertableRow\">\n      <tr mat-header-row *matHeaderRowDef=\"oTableOptions.columnsInsertables; sticky: true\"\n        (keyup)=\"oTableInsertableRowComponent.handleKeyboardEvent($event)\" class=\"o-table-insertable\"> </tr>\n    </ng-container>\n    <ng-container *ngIf=\"showTotals | async\">\n      <tr mat-footer-row *matFooterRowDef=\"oTableOptions.visibleColumns; sticky: true\" class=\"o-table-aggregate\">\n      </tr>\n    </ng-container>\n  </table>\n\n</ng-template>\n\n<ng-container *ngIf=\"!contextMenuContentChild && contextMenu\">\n  <o-table-context-menu [insert]=\"insertButton\" [edit]=\"editionMode !== EDIT_MODE_NONE\" [view-detail]=\"detailMode !== DETAIL_MODE_NONE\"\n    [refresh]=\"refreshButton\" [delete]=\"deleteButton\" [filter]=\"showFilterOption\" [group-by-row]=\"groupable\">\n  </o-table-context-menu>\n</ng-container>\n\n<ng-template #cellRenderer let-row=\"row\" let-column=\"column\">\n  <div class=\"content\">\n\n    <ng-container [ngSwitch]=\"true\">\n      <ng-container *ngSwitchCase=\"column.renderer != null && (!column.editing || column.editing && !isRowSelected(row))\">\n        <ng-template *ngTemplateOutlet=\"column.renderer?.templateref; context:{ cellvalue: row[column.name], rowvalue:row }\">\n        </ng-template>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"isRowSelected(row) && column.editing\">\n        <ng-template *ngTemplateOutlet=\"column.editor?.templateref; context:{ cellvalue: row[column.name], rowvalue:row }\">\n        </ng-template>\n      </ng-container>\n\n      <ng-container *ngSwitchCase=\"column.type === 'editButtonInRow' || column.type === 'detailButtonInRow'\">\n        <div fxLayoutAlign=\"center center\" class=\"o-action-cell-renderer\" (click)=\"onDetailButtonClick(column, row, $event)\">\n          <mat-icon>{{ getDetailButtonIcon(column) }}</mat-icon>\n        </div>\n      </ng-container>\n      <ng-container *ngSwitchDefault>{{ row[column.name] }}</ng-container>\n    </ng-container>\n\n  </div>\n</ng-template>\n", styles: [".o-table{height:100%;max-height:100%;width:100%}.o-table.o-table-disabled{opacity:.4}.o-table .o-table-container{height:100%;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;align-items:flex-start;align-content:stretch;min-width:100%;min-height:400px;position:relative;padding:0 .5%}.o-table .o-table-container .o-table-body{display:flex;flex:1 1 auto}.o-table .o-table-container .o-table-body .o-table-overflow{overflow-y:auto;overflow-x:hidden;min-width:100%}.o-table .o-table-container .o-table-body.horizontal-scroll .o-table-overflow{overflow-x:auto}.o-table .o-table-container .o-table-body thead .mat-mdc-header-row th:last-child .o-table-column-resizer{display:none}.o-table .o-table-container.block-events{pointer-events:none}.o-table .o-table-container.block-events>.o-table-toolbar,.o-table .o-table-container.block-events>.o-table-body .mat-mdc-header-row{opacity:.75}.o-table .o-table-container .o-table-toolbar{height:40px}.o-table .o-table-container .o-table-toolbar>div{max-height:100%}.o-table .o-table-container .o-table-toolbar .buttons{margin:0 10px 0 4px}.o-table .o-table-container .o-table-body{max-width:100%;height:100%;overflow:hidden;position:relative}.o-table .o-table-container .o-table-body .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}.o-table .o-table-container .o-table-body.horizontal-scroll{overflow-x:auto;padding-bottom:16px}.o-table .o-table-container .o-table-body.horizontal-scroll .mat-mdc-header-cell{width:150px}.o-table .o-table-container .o-table-body .o-table-no-results{cursor:default;text-align:center}.o-table .o-table-container .o-table-body .o-table-no-results td{text-align:center}.o-table .o-table-container .mat-mdc-table{table-layout:fixed;width:100%}.o-table .o-table-container .mat-mdc-table.autoadjusted{table-layout:auto}.o-table .o-table-container .mat-mdc-table td .content,.o-table .o-table-container .mat-mdc-table th .content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table.small .mat-mdc-header-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-header-row .mat-mdc-header-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-row .mat-mdc-header-cell .image-avatar{width:24px;height:24px}.o-table .o-table-container .mat-mdc-table.large .column-filter-icon{margin-top:4px}.o-table .o-table-container .mat-mdc-table.large .mat-sort-header-arrow{margin-top:7px}.o-table .o-table-container .mat-mdc-table tr.mat-mdc-row.o-table-row-expanded{height:0}.o-table .o-table-container .mat-mdc-table tr.o-table-insertable td{height:1px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row{box-sizing:border-box;transition:background-color .2s;position:relative;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell{padding:0 12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell:not(.o-column-image):first-of-type,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell:not(.o-column-image):first-of-type{padding-left:24px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell:last-of-type,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell:last-of-type{padding-right:24px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row{padding-top:30px;cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row .grouping-title-wrapper,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row .grouping-title-wrapper{position:absolute;width:100%;left:0;top:0;text-align:left}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row .grouping-aggregate,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row .grouping-aggregate{font-weight:700;font-size:14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-bottom:8px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.empty-cell,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.empty-cell{min-height:16px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .action-cell-renderer,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .action-cell-renderer{cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-start,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-start{text-align:start}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-center,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-center{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-end,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-end{text-align:end}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell *,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell *{vertical-align:middle}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-mat-cell-multiline:not(.mat-mdc-header-cell),.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-mat-cell-multiline:not(.mat-mdc-header-cell){padding:6px 12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-mat-cell-multiline .content,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-mat-cell-multiline .content{overflow:initial;white-space:normal;text-overflow:unset}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .image-avatar{width:32px;height:32px;margin:1px auto;overflow:hidden;border-radius:50%;position:relative;z-index:1}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .image-avatar img,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .image-avatar img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-width:inherit;max-height:inherit}.o-table .o-table-container .mat-mdc-table .o-action-cell-renderer{display:inline-block;cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell{overflow:hidden;position:relative;box-sizing:border-box;padding:0 12px;vertical-align:middle}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select.mat-header-select-all-with-title{padding-right:12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:first-of-type{padding-left:0}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:not(.o-column-image){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .o-table-header-indicator-numbered{font-size:8px;position:absolute;text-align:center;display:inline-block;width:18px;height:18px;line-height:18px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;bottom:-10px;right:-9px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .column-filter-icon{cursor:pointer;font-size:18px;width:18px;height:18px;line-height:1}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .mat-sort-header-button{flex:1;display:block;place-content:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .header-title-container{cursor:default;min-height:20px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .header-title-container,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .mat-sort-header-button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.start,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.start .mat-sort-header-button{text-align:left}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.center,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.center .mat-sort-header-button{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.end,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.end .mat-sort-header-button{text-align:right}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select{box-sizing:content-box;overflow:initial}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select:not(.mat-header-select-all-with-title),.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select:not(.mat-header-select-all-with-title){width:18px}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select .mat-checkbox-layout,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select .mat-checkbox-layout{text-overflow:ellipsis;overflow:hidden;display:inline}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-expandable,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-expandable{width:40px;box-sizing:content-box;padding:0 0 0 24px;overflow:initial}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell .row-container-expanded{overflow:hidden;display:flex}.o-table .o-table-container .o-table-disabled-blocker{bottom:0;left:0;position:absolute;right:0;top:0;z-index:100}.o-table .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}.o-table .spinner-container-scrollable{position:relative}.o-table.o-table-fixed{display:flex}.o-table.o-table-fixed .o-table-container{display:flex;flex-direction:column}.o-table.o-table-fixed .o-table-body{display:flex;flex:1}.o-table.o-table-fixed .o-table-body .o-table-overflow{flex:1;overflow-y:auto}.mat-mdc-tooltip.o-table-cell-tooltip{word-wrap:break-word;overflow:hidden;min-width:140px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i4$1.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i4$1.DefaultStyleDirective, selector: "  [ngStyle],  [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],  [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],  [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { kind: "directive", type: i3$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: OMatErrorDirective, selector: "[oMatError]", inputs: ["oMatError"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i5$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i15.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i15.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i15.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i15.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i15.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i15.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i15.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i15.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i15.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i15.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i15.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i15.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i15.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i15.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "component", type: i11$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i7$3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: OContextMenuDirective, selector: "[oContextMenu]", inputs: ["oContextMenu", "oContextMenuData"] }, { kind: "directive", type: i19.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }, { kind: "directive", type: OMatSort, selector: "[oMatSort]", inputs: ["oMatSortDisabled", "oMatSortColumns"], outputs: ["matSortChange"], exportAs: ["oMatSort"] }, { kind: "component", type: ODataToolbarComponent, selector: "o-data-toolbar", inputs: ["show-title", "title"] }, { kind: "component", type: OTableContextMenuComponent, selector: "o-table-context-menu", inputs: ["context-menu", "insert", "edit", "view-detail", "copy", "select-all", "refresh", "delete", "filter", "group-by-row"] }, { kind: "directive", type: OTableRowDirective, selector: "[oTableRow]" }, { kind: "directive", type: OTableExpandedFooterDirective, selector: "[oTableExpandedFooter]", inputs: ["oTableExpandedFooter", "oTableExpandedFooterColspan"] }, { kind: "component", type: OTableButtonsComponent, selector: "o-table-buttons", inputs: ["insert-button", "refresh-button", "delete-button"] }, { kind: "component", type: OTableMenuComponent, selector: "o-table-menu", inputs: ["select-all-checkbox", "export-button", "columns-visibility-button", "show-configuration-option", "show-filter-option", "show-group-by-option", "show-reset-width-option", "show-report-on-demand-option", "show-charts-on-demand-option"] }, { kind: "component", type: OTableQuickfilterComponent, selector: "o-table-quickfilter", inputs: ["placeholder"], outputs: ["onChange"] }, { kind: "component", type: OTableHeaderComponent, selector: "o-table-header", inputs: ["column"] }, { kind: "component", type: OTableHeaderSelectAllComponent, selector: "o-table-header-select-all", inputs: ["column"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }, { kind: "pipe", type: OTableRowClassPipe, name: "oTableRowClass" }], animations: [
         trigger('detailExpand', [
             state('collapsed', style({ height: '0px', minHeight: '0' })),
             state('expanded', style({ height: '*' })),
@@ -32904,8 +32942,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                         '[class.o-table-fixed]': 'fixedHeader',
                         '[class.o-table-disabled]': '!enabled',
                         '(document:click)': 'handleDOMClick($event)'
-                    }, template: "<div class=\"o-table-container\" fxLayout=\"column\" fxLayoutAlign=\"start stretch\" [style.display]=\"isVisible()? '' : 'none'\"\n  [class.block-events]=\"showLoading | async\">\n\n  <o-data-toolbar #tableToolbar *ngIf=\"hasControls()\" [title]=\"title\" [show-title]=\"showTitle\" class=\"o-table-toolbar\">\n    <ng-container o-data-toolbar-projection-start>\n      <o-table-buttons #tableButtons [insert-button]=\"insertButton\" [refresh-button]=\"refreshButton\" [delete-button]=\"showDeleteButton\">\n        <ng-content select=\"o-table-button\"></ng-content>\n      </o-table-buttons>\n    </ng-container>\n    <ng-content select=\"[o-table-toolbar][position=start]\" ngProjectAs=\"[o-data-toolbar-custom-projection-start]\">\n    </ng-content>\n    <ng-content select=\"[o-table-toolbar][position=end]\" ngProjectAs=\"[o-data-toolbar-custom-projection-end]\">\n    </ng-content>\n    <ng-content select=\"[o-table-toolbar]\" ngProjectAs=\"[o-data-toolbar-custom-projection-start]\">\n    </ng-content>\n    <ng-container o-data-toolbar-projection-end>\n      <ng-container *ngIf=\"quickfilterContentChild; else defaultQuickFilter\">\n        <ng-content select=\"o-table-quickfilter\"></ng-content>\n      </ng-container>\n      <ng-template #defaultQuickFilter>\n        <ng-container *ngIf=\"quickFilter\">\n          <o-table-quickfilter (onChange)=\"tableQuickFilterChanged($event)\">\n          </o-table-quickfilter>\n        </ng-container>\n      </ng-template>\n      <button type=\"button\" *ngIf=\"showTableMenuButton\" mat-icon-button class=\"o-table-menu-button\" [matMenuTriggerFor]=\"tableMenu.matMenu\"\n        (click)=\"$event.stopPropagation()\">\n        <mat-icon svgIcon=\"ontimize:more_vert\"></mat-icon>\n      </button>\n      <o-table-menu #tableMenu [select-all-checkbox]=\"selectAllCheckbox\" [export-button]=\"exportButton\"\n        [columns-visibility-button]=\"columnsVisibilityButton\" [show-configuration-option]=\"showConfigurationOption\"\n        [show-filter-option]=\"showFilterOption\" [show-report-on-demand-option]=\"showReportOnDemandOption\"\n        [show-charts-on-demand-option]=\"showChartsOnDemandOption\" [show-reset-width-option]=\"showResetWidthOption\" [show-group-by-option]=\"groupable\">\n        <ng-content select=\"o-table-option\"></ng-content>\n      </o-table-menu>\n      <ng-template #exportOptsTemplate>\n        <ng-content select=\"o-table-export-button\"></ng-content>\n      </ng-template>\n    </ng-container>\n  </o-data-toolbar>\n\n  <div #tableBody class=\"o-table-body o-scroll\" [class.horizontal-scroll]=\"horizontalScroll\" [class.scrolled]=\"horizontalScrolled\">\n    <ng-container *ngIf=\"!enabledVirtualScroll; else tableWithVirtualScroll\">\n      <div class=\"o-table-overflow o-scroll\">\n        <ng-template *ngTemplateOutlet=\"table\"></ng-template>\n      </div>\n    </ng-container>\n    <ng-template #tableWithVirtualScroll>\n      <cdk-virtual-scroll-viewport #virtualScrollViewPort fxFlex>\n        <ng-template *ngTemplateOutlet=\"table\"></ng-template>\n      </cdk-virtual-scroll-viewport>\n    </ng-template>\n  </div>\n  <!--TABLE PAGINATOR-->\n  <mat-paginator *ngIf=\"paginator\" #matpaginator [length]=\"dataSource?.resultsLength\" [pageIndex]=\"paginator.pageIndex\" [pageSize]=\"queryRows\"\n    [pageSizeOptions]=\"paginator.pageSizeOptions\" (page)=\"onChangePage($event)\" [showFirstLastButtons]=\"paginator.showFirstLastButtons\">\n  </mat-paginator>\n\n  <!--LOADING-->\n  <div #spinnerContainer *ngIf=\"showLoading | async\" fxLayout=\"column\" fxLayoutAlign=\"center center\" [ngStyle]=\"{'top.px': headerHeight}\"\n    class=\"spinner-container\" [class.spinner-container-scrollable]=\"loadingScroll | async\">\n    <mat-progress-spinner mode=\"indeterminate\" strokeWidth=\"3\" [diameter]=\"diameterSpinner\"></mat-progress-spinner>\n  </div>\n\n  <!-- Disable blocker -->\n  <div *ngIf=\"!enabled\" class=\"o-table-disabled-blocker\"></div>\n</div>\n\n<ng-template #table>\n\n  <table mat-table #table [class.autoadjusted]=\"autoAdjust\" [trackBy]=\"getTrackByFunction()\" [dataSource]=\"dataSource\" oMatSort\n    [oMatSortColumns]=\"sortColArray\" [ngClass]=\"rowHeightObservable | async\" (cdkObserveContent)=\"projectContentChanged()\"\n    [oTableExpandedFooter]=\"!(loading | async)\" [oTableExpandedFooterColspan]=\"visibleColArray.length\" [multiTemplateDataRows]=\"showExpandableRow()\"\n    aria-describedby=\"ontimize-web table\">\n\n    <!--Checkbox Column -->\n    <ng-container [matColumnDef]=\"oTableOptions.selectColumn.name\" *ngIf=\"oTableOptions.selectColumn.visible\">\n      <ng-container *ngIf=\"!tableColumnSelectAllContentChild; else customHeaderSelectAllTemplate\">\n        <th mat-header-cell *matHeaderCellDef>\n          <div class=\"content\">\n            <o-table-header-select-all [column]=\"oTableOptions.selectColumn\"></o-table-header-select-all>\n          </div>\n        </th>\n        <td mat-cell *matCellDef=\"let row\">\n          <mat-checkbox name=\"id[]\" (click)=\"$event.stopPropagation()\" [disabled]=\"isDisableCheckbox(row)\"\n            (change)=\"selectionCheckboxToggle($event, row)\" [checked]=\"isRowSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-container>\n      <ng-template #customHeaderSelectAllTemplate>\n        <th mat-header-cell *matHeaderCellDef [class.resizable]=\"resizable\"\n          class=\"mat-header-select-all-with-title o-center\" [style.width]=\"oTableOptions.selectColumn.width\"\n          [style.min-width]=\"getMinWidthColumn(oTableOptions.selectColumn)\" [style.max-width]=\"oTableOptions.selectColumn.maxWidth\">\n          <div class=\"content\">\n            <o-table-header-select-all [column]=\"oTableOptions.selectColumn\"></o-table-header-select-all>\n          </div>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" class=\"o-center\" [style.width]=\"oTableOptions.selectColumn.width\"\n          [style.min-width]=\"getMinWidthColumn(oTableOptions.selectColumn)\" [style.max-width]=\"oTableOptions.selectColumn.maxWidth\">\n          <mat-checkbox name=\"id[]\" (click)=\"$event.stopPropagation()\" [disabled]=\"isDisableCheckbox(row)\"\n            (change)=\"selectionCheckboxToggle($event, row)\" [checked]=\"isRowSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-template>\n\n\n      <td mat-footer-cell *matFooterCellDef></td>\n    </ng-container>\n\n    <!--Expandable Column -->\n    <ng-container [matColumnDef]=\"oTableOptions.expandableColumn.name\" *ngIf=\"isColumnExpandable()\">\n      <th mat-header-cell *matHeaderCellDef>\n        {{ oTableOptions.expandableColumn.title }}\n      </th>\n      <td mat-cell *matCellDef=\"let row;let rowIndex = dataIndex\">\n        <mat-icon *ngIf=\"showExpandableIcon(row, rowIndex) | async\" (click)=\"toogleRowExpandable(row, rowIndex, $event)\">\n          <ng-container *ngIf=\"isExpanded(row)\">{{ tableRowExpandable.iconCollapse }}</ng-container>\n          <ng-container *ngIf=\"!isExpanded(row)\">{{ tableRowExpandable.iconExpand }}</ng-container>\n        </mat-icon>\n      </td>\n    </ng-container>\n\n    <!-- Generic column definition -->\n    <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"column.name\">\n      <!--Define header-cell-->\n\n      <th mat-header-cell *matHeaderCellDef [ngClass]=\"getTitleAlignClass(column)\" [class.resizable]=\"resizable\" [style.width]=\"column.width\"\n        [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\">\n\n        <div class=\"content\">\n          <o-table-header [column]=\"column\"></o-table-header>\n        </div>\n      </th>\n\n\n      <!--Define mat-cell-->\n      <ng-container *ngIf=\"!table.multiTemplateDataRows; else cellTemplateMultiTemplateDataRows\">\n        <td #cell mat-cell *matCellDef=\"let row;let rowIndex = index \" [ngClass]=\"[column.className, getCellAlignClass(column)]\"\n          (click)=\"handleClick(row, column, rowIndex, cell, $event)\" (dblclick)=\"handleDoubleClick(row, column, rowIndex, cell, $event)\"\n          [class.empty-cell]=\"isEmpty(row[column.name])\" [matTooltipDisabled]=\"!column.hasTooltip()\" [matTooltip]=\"column.getTooltip(row)\"\n          matTooltipPosition=\"below\" matTooltipShowDelay=\"750\" matTooltipClass=\"o-table-cell-tooltip\"\n          [class.o-mat-cell-multiline]=\"(column.isMultiline | async)\" [oContextMenu]=\"tableContextMenu\"\n          [oContextMenuData]=\"{ cellName:column.name, rowValue:row, rowIndex:rowIndex}\" [style.width]=\"column.width\"\n          [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\"\n          [class.o-table-editing-cell]=\"isRowSelected(row) && column.editing\">\n          <ng-container *ngTemplateOutlet=\"cellRenderer;context:{column:column,row:row}\"></ng-container>\n        </td>\n      </ng-container>\n      <ng-template #cellTemplateMultiTemplateDataRows>\n        <td #cell mat-cell *matCellDef=\"let row;let rowIndex = dataIndex \" [ngClass]=\"[column.className, getCellAlignClass(column)]\"\n          (click)=\"handleClick(row, column, rowIndex, cell, $event)\" (dblclick)=\"handleDoubleClick(row, column, rowIndex, cell, $event)\"\n          [class.empty-cell]=\"isEmpty(row[column.name])\" [matTooltipDisabled]=\"!column.hasTooltip()\" [matTooltip]=\"column.getTooltip(row)\"\n          matTooltipPosition=\"below\" matTooltipShowDelay=\"750\" matTooltipClass=\"o-table-cell-tooltip\"\n          [class.o-mat-cell-multiline]=\"(column.isMultiline | async)\" [oContextMenu]=\"tableContextMenu\"\n          [oContextMenuData]=\"{ cellName:column.name, rowValue:row, rowIndex:rowIndex}\" [style.width]=\"column.width\"\n          [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\"\n          [class.o-table-editing-cell]=\"isRowSelected(row) && column.editing\">\n          <ng-container *ngTemplateOutlet=\"cellRenderer;context:{column:column,row:row}\"></ng-container>\n\n        </td>\n      </ng-template>\n      <!--Define mat-footer-cell-->\n      <ng-container *ngIf=\"showTotals | async\">\n        <td mat-footer-cell *matFooterCellDef [ngClass]=\"column.className\">\n          <div class=\"title\" *ngIf=\"column.aggregate && column.aggregate.title\">\n            {{ column.aggregate.title | oTranslate }}\n          </div>\n          <ng-container *ngIf=\"!column.renderer\">\n            {{ dataSource.getAggregateData(column) }}\n          </ng-container>\n          <ng-template *ngIf=\"column.renderer && column.aggregate\" [ngTemplateOutlet]=\"column.renderer.templateref\"\n            [ngTemplateOutletContext]=\"{cellvalue: dataSource.getAggregateData(column)}\"></ng-template>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <!-- Expanded Content Column - The detail row is made up of this one column that spans across all columns -->\n    <ng-container *ngIf=\"hasExpandedRow\">\n      <ng-container matColumnDef=\"expandedDetail\">\n        <td mat-cell *matCellDef=\"let row;let rowIndex= dataIndex\" [attr.colspan]=\"oTableOptions.visibleColumns.length\">\n          <div [ngClass]=\"getExpandedRowContainerClass(rowIndex)\" [@detailExpand]=\"getStateExpand(row)\">\n          </div>\n        </td>\n      </ng-container>\n    </ng-container>\n\n    <!--FOOTER-INSERTABLE-->\n    <ng-container *ngIf=\"showLastInsertableRow && oTableInsertableRowComponent\">\n      <ng-container [matColumnDef]=\"oTableOptions.selectColumn.name + getSuffixColumnInsertable()\" *ngIf=\"oTableOptions.selectColumn.visible\">\n        <td mat-footer-cell *matFooterCellDef>\n        </td>\n      </ng-container>\n      <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"column.name+ getSuffixColumnInsertable()\">\n\n        <td mat-footer-cell *matFooterCellDef [ngClass]=\"column.className\">\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && !oTableInsertableRowComponent.useCellEditor(column)\">\n            <mat-form-field class=\"insertable-form-field o-table-cell-editor-text o-table-cell-editor\" [hideRequiredMarker]=\"false\">\n              <input matInput type=\"text\" [placeholder]=\"oTableInsertableRowComponent.getPlaceholder(column)\" [id]=\"column.attr\"\n                [formControl]=\"oTableInsertableRowComponent.getControl(column)\" [required]=\"oTableInsertableRowComponent.isColumnRequired(column)\">\n              <mat-error *oMatError=\"oTableInsertableRowComponent.columnHasError(column, 'required')\">\n                {{ 'FORM_VALIDATION.REQUIRED' | oTranslate }}\n              </mat-error>\n            </mat-form-field>\n          </ng-container>\n\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && oTableInsertableRowComponent.useCellEditor(column)\">\n            <ng-template [ngTemplateOutlet]=\"oTableInsertableRowComponent.columnEditors[column.attr].templateref\"\n              [ngTemplateOutletContext]=\"{ rowvalue: oTableInsertableRowComponent.rowData }\">\n            </ng-template>\n          </ng-container>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <ng-container *ngIf=\"showFirstInsertableRow && oTableInsertableRowComponent\">\n      <ng-container [matColumnDef]=\"getColumnInsertable(oTableOptions.selectColumn.name)\" *ngIf=\"oTableOptions.selectColumn.visible\">\n        <td mat-header-cell *matHeaderCellDef>\n        </td>\n      </ng-container>\n      <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"getColumnInsertable(column.name)\">\n\n        <td mat-header-cell *matHeaderCellDef [ngClass]=\"column.className\">\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && !oTableInsertableRowComponent.useCellEditor(column)\">\n            <mat-form-field class=\"insertable-form-field\" [hideRequiredMarker]=\"false\">\n              <input matInput type=\"text\" [placeholder]=\"oTableInsertableRowComponent.getPlaceholder(column)\" [id]=\"column.attr\"\n                [formControl]=\"oTableInsertableRowComponent.getControl(column)\" [required]=\"oTableInsertableRowComponent.isColumnRequired(column)\">\n              <mat-error *oMatError=\"oTableInsertableRowComponent.columnHasError(column, 'required')\">\n                {{ 'FORM_VALIDATION.REQUIRED' | oTranslate }}\n              </mat-error>\n            </mat-form-field>\n          </ng-container>\n\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && oTableInsertableRowComponent.useCellEditor(column)\">\n            <ng-template [ngTemplateOutlet]=\"oTableInsertableRowComponent.columnEditors[column.attr].templateref\"\n              [ngTemplateOutletContext]=\"{ rowvalue: oTableInsertableRowComponent.rowData }\">\n            </ng-template>\n          </ng-container>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <!-- Definition column group header -->\n    <ng-container *ngFor=\"let column of groupingHeadersRows; let i = index\" [matColumnDef]=\"column\">\n      <td mat-cell *matCellDef=\"let group\" class=\"grouping-row\" [oContextMenu]=\"tableContextMenu\"\n        [oContextMenuData]=\"{ cellName:column, rowValue:group, rowIndex:i}\" [ngClass]=\"getGroupHeaderCellAlignClass(column)\">\n        <div *ngIf=\"i===0\" class=\"grouping-title-wrapper\" [ngStyle]=\"{'padding-left': 20*(group.level-1)+'px'}\">\n          <mat-icon>{{ group.expanded ? 'expand_more' : 'chevron_right' }}</mat-icon>\n          {{ group.title }}\n        </div>\n        <div class=\"grouping-aggregate\" *ngIf=\"group.hasActiveAggregate(visibleColArray[i])\">\n          {{ group.getColumnActiveAggregateTitle(visibleColArray[i]) | oTranslate }} :\n          <ng-container *ngIf=\"!getOColumnFromGroupHeaderColumn(column).renderer\">\n            {{ group.getColumnAggregateValue(visibleColArray[i])}}\n          </ng-container>\n          <ng-container *ngIf=\"getOColumnFromGroupHeaderColumn(column).renderer\">\n            <ng-template\n              *ngTemplateOutlet=\"getOColumnFromGroupHeaderColumn(column).renderer?.templateref; context:{ cellvalue:  group.getColumnAggregateValue(visibleColArray[i]) }\">\n            </ng-template>\n          </ng-container>\n        </div>\n      </td>\n    </ng-container>\n\n    <ng-container matColumnDef=\"position\">\n      <td mat-cell *matCellDef=\"let row\"> {{row}} </td>\n    </ng-container>\n\n    <tr #tableHeader mat-header-row *matHeaderRowDef=\"oTableOptions.visibleColumns; sticky: fixedHeader\"></tr>\n\n    <ng-container *ngIf=\"!table.multiTemplateDataRows; else rowTemplateMultiTemplateDataRows\">\n      <tr mat-row oTableRow *matRowDef=\"let row; columns: oTableOptions.visibleColumns; when:isNotGroup; let rowIndex = index\"\n        [class.selected]=\"isRowSelected(row)\" [ngClass]=\"row | oTableRowClass: rowIndex: rowClass\">\n      </tr>\n    </ng-container>\n    <ng-template #rowTemplateMultiTemplateDataRows>\n      <tr mat-row oTableRow *matRowDef=\"let row; columns: oTableOptions.visibleColumns; when:isNotGroup; let rowIndex = dataIndex\"\n        [class.selected]=\"isRowSelected(row)\" [ngClass]=\"row | oTableRowClass: rowIndex: rowClass\">\n      </tr>\n    </ng-template>\n\n    <!-- Row Group header -->\n    <tr mat-row *matRowDef=\"let row; columns: groupingHeadersRows; when:isGroup\" (click)=\"groupHeaderClick(row)\"\n      [ngClass]=\"getClassNameGroupHeader(row)\">\n    </tr>\n\n    <!-- Expanded detail row-->\n    <ng-container *ngIf=\"hasExpandedRow\">\n      <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"o-table-row-expanded\"></tr>\n    </ng-container>\n\n    <ng-container *ngIf=\"showLastInsertableRow\">\n      <tr mat-footer-row *matFooterRowDef=\"oTableOptions.columnsInsertables; sticky: true\"\n        (keyup)=\"oTableInsertableRowComponent.handleKeyboardEvent($event)\" class=\"o-table-insertable\"></tr>\n    </ng-container>\n    <ng-container *ngIf=\"showFirstInsertableRow\">\n      <tr mat-header-row *matHeaderRowDef=\"oTableOptions.columnsInsertables; sticky: true\"\n        (keyup)=\"oTableInsertableRowComponent.handleKeyboardEvent($event)\" class=\"o-table-insertable\"> </tr>\n    </ng-container>\n    <ng-container *ngIf=\"showTotals | async\">\n      <tr mat-footer-row *matFooterRowDef=\"oTableOptions.visibleColumns; sticky: true\" class=\"o-table-aggregate\">\n      </tr>\n    </ng-container>\n  </table>\n\n</ng-template>\n\n<ng-container *ngIf=\"!contextMenuContentChild && contextMenu\">\n  <o-table-context-menu [insert]=\"insertButton\" [edit]=\"editionMode !== EDIT_MODE_NONE\" [view-detail]=\"detailMode !== DETAIL_MODE_NONE\"\n    [refresh]=\"refreshButton\" [delete]=\"deleteButton\" [filter]=\"showFilterOption\" [group-by-row]=\"groupable\">\n  </o-table-context-menu>\n</ng-container>\n\n<ng-template #cellRenderer let-row=\"row\" let-column=\"column\">\n  <div class=\"content\">\n\n    <ng-container [ngSwitch]=\"true\">\n      <ng-container *ngSwitchCase=\"column.renderer != null && (!column.editing || column.editing && !isRowSelected(row))\">\n        <ng-template *ngTemplateOutlet=\"column.renderer?.templateref; context:{ cellvalue: row[column.name], rowvalue:row }\">\n        </ng-template>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"isRowSelected(row) && column.editing\">\n        <ng-template *ngTemplateOutlet=\"column.editor?.templateref; context:{ cellvalue: row[column.name], rowvalue:row }\">\n        </ng-template>\n      </ng-container>\n\n      <ng-container *ngSwitchCase=\"column.type === 'editButtonInRow' || column.type === 'detailButtonInRow'\">\n        <div fxLayoutAlign=\"center center\" class=\"o-action-cell-renderer\" (click)=\"onDetailButtonClick(column, row, $event)\">\n          <mat-icon>{{ getDetailButtonIcon(column) }}</mat-icon>\n        </div>\n      </ng-container>\n      <ng-container *ngSwitchDefault>{{ row[column.name] }}</ng-container>\n    </ng-container>\n\n  </div>\n</ng-template>\n", styles: [".o-table{height:100%;max-height:100%;width:100%}.o-table.o-table-disabled{opacity:.4}.o-table .o-table-container{height:100%;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;align-items:flex-start;align-content:stretch;min-width:100%;min-height:400px;position:relative;padding:0 .5%}.o-table .o-table-container .o-table-body{display:flex;flex:1 1 auto}.o-table .o-table-container .o-table-body .o-table-overflow{overflow-y:auto;overflow-x:hidden;min-width:100%}.o-table .o-table-container .o-table-body.horizontal-scroll .o-table-overflow{overflow-x:auto}.o-table .o-table-container .o-table-body thead .mat-mdc-header-row th:last-child .o-table-column-resizer{display:none}.o-table .o-table-container.block-events{pointer-events:none}.o-table .o-table-container.block-events>.o-table-toolbar,.o-table .o-table-container.block-events>.o-table-body .mat-mdc-header-row{opacity:.75}.o-table .o-table-container .o-table-toolbar{height:40px}.o-table .o-table-container .o-table-toolbar>div{max-height:100%}.o-table .o-table-container .o-table-toolbar .buttons{margin:0 10px 0 4px}.o-table .o-table-container .o-table-body{max-width:100%;height:100%;overflow:hidden;position:relative}.o-table .o-table-container .o-table-body .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}.o-table .o-table-container .o-table-body.horizontal-scroll{overflow-x:auto;padding-bottom:16px}.o-table .o-table-container .o-table-body.horizontal-scroll .mat-mdc-header-cell{width:150px}.o-table .o-table-container .o-table-body .o-table-no-results{cursor:default;text-align:center}.o-table .o-table-container .o-table-body .o-table-no-results td{text-align:center}.o-table .o-table-container .mat-mdc-table{table-layout:fixed;width:100%}.o-table .o-table-container .mat-mdc-table.autoadjusted{table-layout:auto}.o-table .o-table-container .mat-mdc-table td .content,.o-table .o-table-container .mat-mdc-table th .content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table.small .mat-mdc-header-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-header-row .mat-mdc-header-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-row .mat-mdc-header-cell .image-avatar{width:24px;height:24px}.o-table .o-table-container .mat-mdc-table.large .column-filter-icon{margin-top:4px}.o-table .o-table-container .mat-mdc-table.large .mat-sort-header-arrow{margin-top:7px}.o-table .o-table-container .mat-mdc-table tr.mat-mdc-row.o-table-row-expanded{height:0}.o-table .o-table-container .mat-mdc-table tr.o-table-insertable td{height:1px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row{box-sizing:border-box;transition:background-color .2s;position:relative;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell{padding:0 12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell:not(.o-column-image):first-of-type,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell:not(.o-column-image):first-of-type{padding-left:24px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell:last-of-type,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell:last-of-type{padding-right:24px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row{padding-top:30px;cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row .grouping-title-wrapper,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row .grouping-title-wrapper{position:absolute;width:100%;left:0;top:0;text-align:left}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row .grouping-aggregate,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row .grouping-aggregate{font-weight:700;font-size:14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-bottom:8px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.empty-cell,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.empty-cell{min-height:16px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .action-cell-renderer,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .action-cell-renderer{cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-start,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-start{text-align:start}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-center,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-center{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-end,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-end{text-align:end}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell *,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell *{vertical-align:middle}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-mat-cell-multiline:not(.mat-mdc-header-cell),.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-mat-cell-multiline:not(.mat-mdc-header-cell){padding:6px 12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-mat-cell-multiline .content,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-mat-cell-multiline .content{overflow:initial;white-space:normal;text-overflow:unset}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .image-avatar{width:32px;height:32px;margin:1px auto;overflow:hidden;border-radius:50%;position:relative;z-index:1}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .image-avatar img,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .image-avatar img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-width:inherit;max-height:inherit}.o-table .o-table-container .mat-mdc-table .o-action-cell-renderer{display:inline-block;cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell{overflow:hidden;position:relative;box-sizing:border-box;padding:0 12px;vertical-align:middle}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select.mat-header-select-all-with-title{padding-right:12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:first-of-type{padding-left:0}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:not(.o-column-image){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .o-table-header-indicator-numbered{font-size:8px;position:absolute;text-align:center;display:inline-block;width:18px;height:18px;line-height:18px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;bottom:-10px;right:-9px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .column-filter-icon{cursor:pointer;font-size:18px;width:18px;height:18px;line-height:1}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .mat-sort-header-button{flex:1;display:block;place-content:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .header-title-container{cursor:default;min-height:20px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .header-title-container,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .mat-sort-header-button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.start,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.start .mat-sort-header-button{text-align:left}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.center,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.center .mat-sort-header-button{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.end,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.end .mat-sort-header-button{text-align:right}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select{box-sizing:content-box;overflow:initial}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select:not(.mat-header-select-all-with-title),.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select:not(.mat-header-select-all-with-title){width:18px}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select .mat-checkbox-layout,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select .mat-checkbox-layout{text-overflow:ellipsis;overflow:hidden;display:inline}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-expandable,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-expandable{width:40px;box-sizing:content-box;padding:0 0 0 24px;overflow:initial}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell .row-container-expanded{overflow:hidden;display:flex}.o-table .o-table-container .o-table-disabled-blocker{bottom:0;left:0;position:absolute;right:0;top:0;z-index:100}.o-table .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}.o-table .spinner-container-scrollable{position:relative}.o-table.o-table-fixed{display:flex}.o-table.o-table-fixed .o-table-container{display:flex;flex-direction:column}.o-table.o-table-fixed .o-table-body{display:flex;flex:1}.o-table.o-table-fixed .o-table-body .o-table-overflow{flex:1;overflow-y:auto}.mat-mdc-tooltip.o-table-cell-tooltip{word-wrap:break-word;overflow:hidden;min-width:140px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i1$1.MatDialog }, { type: i0.ViewContainerRef }, { type: i0.ApplicationRef }, { type: i0.ComponentFactoryResolver }, { type: OFormComponent, decorators: [{
+                    }, template: "<div class=\"o-table-container\" fxLayout=\"column\" fxLayoutAlign=\"start stretch\" [style.display]=\"isVisible()? '' : 'none'\"\n  [class.block-events]=\"showLoading | async\">\n\n  <o-data-toolbar #tableToolbar *ngIf=\"hasControls()\" [title]=\"title\" [show-title]=\"showTitle\" class=\"o-table-toolbar\">\n    <ng-container o-data-toolbar-projection-start>\n      <o-table-buttons #tableButtons [insert-button]=\"insertButton\" [refresh-button]=\"refreshButton\" [delete-button]=\"showDeleteButton\">\n        <ng-content select=\"o-table-button\"></ng-content>\n      </o-table-buttons>\n    </ng-container>\n    <ng-content select=\"[o-table-toolbar][position=start]\" ngProjectAs=\"[o-data-toolbar-custom-projection-start]\">\n    </ng-content>\n    <ng-content select=\"[o-table-toolbar][position=end]\" ngProjectAs=\"[o-data-toolbar-custom-projection-end]\">\n    </ng-content>\n    <ng-content select=\"[o-table-toolbar]\" ngProjectAs=\"[o-data-toolbar-custom-projection-start]\">\n    </ng-content>\n    <ng-container o-data-toolbar-projection-end>\n      <ng-container *ngIf=\"quickfilterContentChild; else defaultQuickFilter\">\n        <ng-content select=\"o-table-quickfilter\"></ng-content>\n      </ng-container>\n      <ng-template #defaultQuickFilter>\n        <ng-container *ngIf=\"quickFilter\">\n          <o-table-quickfilter (onChange)=\"tableQuickFilterChanged($event)\">\n          </o-table-quickfilter>\n        </ng-container>\n      </ng-template>\n      <button type=\"button\" *ngIf=\"showTableMenuButton\" mat-icon-button class=\"o-table-menu-button\" [matMenuTriggerFor]=\"tableMenu.matMenu\"\n        (click)=\"$event.stopPropagation()\">\n        <mat-icon svgIcon=\"ontimize:more_vert\"></mat-icon>\n      </button>\n      <o-table-menu #tableMenu [select-all-checkbox]=\"selectAllCheckbox\" [export-button]=\"exportButton\"\n        [columns-visibility-button]=\"columnsVisibilityButton\" [show-configuration-option]=\"showConfigurationOption\"\n        [show-filter-option]=\"showFilterOption\" [show-report-on-demand-option]=\"showReportOnDemandOption\"\n        [show-charts-on-demand-option]=\"showChartsOnDemandOption\" [show-reset-width-option]=\"showResetWidthOption\" [show-group-by-option]=\"groupable\">\n        <ng-content select=\"o-table-option\"></ng-content>\n      </o-table-menu>\n      <ng-template #exportOptsTemplate>\n        <ng-content select=\"o-table-export-button\"></ng-content>\n      </ng-template>\n    </ng-container>\n  </o-data-toolbar>\n\n  <div #tableBody class=\"o-table-body o-scroll\" [class.horizontal-scroll]=\"horizontalScroll\" [class.scrolled]=\"horizontalScrolled\">\n    <ng-container *ngIf=\"!enabledVirtualScroll; else tableWithVirtualScroll\">\n      <div class=\"o-table-overflow o-scroll\">\n        <ng-template *ngTemplateOutlet=\"table\"></ng-template>\n      </div>\n    </ng-container>\n    <ng-template #tableWithVirtualScroll>\n      <cdk-virtual-scroll-viewport #virtualScrollViewPort fxFlex>\n        <ng-template *ngTemplateOutlet=\"table\"></ng-template>\n      </cdk-virtual-scroll-viewport>\n    </ng-template>\n  </div>\n  <!--TABLE PAGINATOR-->\n  <mat-paginator *ngIf=\"paginator\" #matpaginator [length]=\"dataSource?.resultsLength\" [pageIndex]=\"paginator.pageIndex\" [pageSize]=\"queryRows\"\n    [pageSizeOptions]=\"paginator.pageSizeOptions\" (page)=\"onChangePage($event)\" [showFirstLastButtons]=\"paginator.showFirstLastButtons\">\n  </mat-paginator>\n\n  <!--LOADING-->\n  <div #spinnerContainer *ngIf=\"showLoading | async\" fxLayout=\"column\" fxLayoutAlign=\"center center\" [ngStyle]=\"{'top.px': headerHeight}\"\n    class=\"spinner-container\" [class.spinner-container-scrollable]=\"loadingScroll | async\">\n    <mat-progress-spinner mode=\"indeterminate\" strokeWidth=\"3\" [diameter]=\"diameterSpinner\"></mat-progress-spinner>\n  </div>\n\n  <!-- Disable blocker -->\n  <div *ngIf=\"!enabled\" class=\"o-table-disabled-blocker\"></div>\n</div>\n\n<ng-template #table>\n\n  <table mat-table #table [class.autoadjusted]=\"autoAdjust\" [trackBy]=\"getTrackByFunction()\" [dataSource]=\"dataSource\" oMatSort\n    [oMatSortColumns]=\"sortColArray\" [ngClass]=\"rowHeightObservable | async\" (cdkObserveContent)=\"projectContentChanged()\"\n    [oTableExpandedFooter]=\"!(loading | async)\" [oTableExpandedFooterColspan]=\"visibleColArray.length\" [multiTemplateDataRows]=\"showExpandableRow()\"\n    aria-describedby=\"ontimize-web table\">\n\n    <!--Checkbox Column -->\n    <ng-container [matColumnDef]=\"oTableOptions.selectColumn.name\" *ngIf=\"oTableOptions.selectColumn.visible\">\n      <ng-container *ngIf=\"!tableColumnSelectAllContentChild; else customHeaderSelectAllTemplate\">\n        <th mat-header-cell *matHeaderCellDef>\n          <div class=\"content\">\n            <o-table-header-select-all [column]=\"oTableOptions.selectColumn\"></o-table-header-select-all>\n          </div>\n        </th>\n        <td mat-cell *matCellDef=\"let row\">\n          <mat-checkbox name=\"id[]\" (click)=\"$event.stopPropagation()\" [disabled]=\"isDisableCheckbox(row)\"\n            (change)=\"selectionCheckboxToggle($event, row)\" [checked]=\"isRowSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-container>\n      <ng-template #customHeaderSelectAllTemplate>\n        <th mat-header-cell *matHeaderCellDef [class.resizable]=\"resizable\" class=\"mat-header-select-all-with-title o-center\"\n          [style.width]=\"oTableOptions.selectColumn.width\" [style.min-width]=\"getMinWidthColumn(oTableOptions.selectColumn)\"\n          [style.max-width]=\"oTableOptions.selectColumn.maxWidth\">\n          <div class=\"content\">\n            <o-table-header-select-all [column]=\"oTableOptions.selectColumn\"></o-table-header-select-all>\n          </div>\n        </th>\n        <td mat-cell *matCellDef=\"let row\" class=\"o-center\" [style.width]=\"oTableOptions.selectColumn.width\"\n          [style.min-width]=\"getMinWidthColumn(oTableOptions.selectColumn)\" [style.max-width]=\"oTableOptions.selectColumn.maxWidth\">\n          <mat-checkbox name=\"id[]\" (click)=\"$event.stopPropagation()\" [disabled]=\"isDisableCheckbox(row)\"\n            (change)=\"selectionCheckboxToggle($event, row)\" [checked]=\"isRowSelected(row)\">\n          </mat-checkbox>\n        </td>\n      </ng-template>\n\n\n      <td mat-footer-cell *matFooterCellDef></td>\n    </ng-container>\n\n    <!--Expandable Column -->\n    <ng-container [matColumnDef]=\"oTableOptions.expandableColumn.name\" *ngIf=\"isColumnExpandable()\">\n      <th mat-header-cell *matHeaderCellDef>\n        {{ oTableOptions.expandableColumn.title }}\n      </th>\n      <td mat-cell *matCellDef=\"let row;let rowIndex = dataIndex\">\n        <mat-icon *ngIf=\"showExpandableIcon(row, rowIndex) | async\" (click)=\"toogleRowExpandable(row, rowIndex, $event)\">\n          <ng-container *ngIf=\"isExpanded(row)\">{{ tableRowExpandable.iconCollapse }}</ng-container>\n          <ng-container *ngIf=\"!isExpanded(row)\">{{ tableRowExpandable.iconExpand }}</ng-container>\n        </mat-icon>\n      </td>\n    </ng-container>\n\n    <!-- Generic column definition -->\n    <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"column.name\">\n      <!--Define header-cell-->\n\n      <th mat-header-cell *matHeaderCellDef [ngClass]=\"getTitleAlignClass(column)\" [class.resizable]=\"resizable\" [style.width]=\"column.width\"\n        [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\">\n\n        <div class=\"content\">\n          <o-table-header [column]=\"column\"></o-table-header>\n        </div>\n      </th>\n\n\n      <!--Define mat-cell-->\n      <ng-container *ngIf=\"!table.multiTemplateDataRows; else cellTemplateMultiTemplateDataRows\">\n        <td #cell mat-cell *matCellDef=\"let row;let rowIndex = index \" [ngClass]=\"[column.className, getCellAlignClass(column)]\"\n          (click)=\"handleClick(row, column, rowIndex, cell, $event)\" (dblclick)=\"handleDoubleClick(row, column, rowIndex, cell, $event)\"\n          [class.empty-cell]=\"isEmpty(row[column.name])\" [matTooltipDisabled]=\"!column.hasTooltip()\" [matTooltip]=\"column.getTooltip(row)\"\n          matTooltipPosition=\"below\" matTooltipShowDelay=\"750\" matTooltipClass=\"o-table-cell-tooltip\"\n          [class.o-mat-cell-multiline]=\"(column.isMultiline | async)\" [oContextMenu]=\"tableContextMenu\"\n          [oContextMenuData]=\"{ cellName:column.name, rowValue:row, rowIndex:rowIndex}\" [style.width]=\"column.width\"\n          [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\"\n          [class.o-table-editing-cell]=\"isRowSelected(row) && column.editing\">\n          <ng-container *ngTemplateOutlet=\"cellRenderer;context:{column:column,row:row}\"></ng-container>\n        </td>\n      </ng-container>\n      <ng-template #cellTemplateMultiTemplateDataRows>\n        <td #cell mat-cell *matCellDef=\"let row;let rowIndex = dataIndex \" [ngClass]=\"[column.className, getCellAlignClass(column)]\"\n          (click)=\"handleClick(row, column, rowIndex, cell, $event)\" (dblclick)=\"handleDoubleClick(row, column, rowIndex, cell, $event)\"\n          [class.empty-cell]=\"isEmpty(row[column.name])\" [matTooltipDisabled]=\"!column.hasTooltip()\" [matTooltip]=\"column.getTooltip(row)\"\n          matTooltipPosition=\"below\" matTooltipShowDelay=\"750\" matTooltipClass=\"o-table-cell-tooltip\"\n          [class.o-mat-cell-multiline]=\"(column.isMultiline | async)\" [oContextMenu]=\"tableContextMenu\"\n          [oContextMenuData]=\"{ cellName:column.name, rowValue:row, rowIndex:rowIndex}\" [style.width]=\"column.width\"\n          [style.min-width]=\"getMinWidthColumn(column)\" [style.max-width]=\"column.maxWidth\"\n          [class.o-table-editing-cell]=\"isRowSelected(row) && column.editing\">\n          <ng-container *ngTemplateOutlet=\"cellRenderer;context:{column:column,row:row}\"></ng-container>\n\n        </td>\n      </ng-template>\n      <!--Define mat-footer-cell-->\n      <ng-container *ngIf=\"showTotals | async\">\n        <td mat-footer-cell *matFooterCellDef [ngClass]=\"column.className\">\n          <div class=\"title\" *ngIf=\"column.aggregate && column.aggregate.title\">\n            {{ column.aggregate.title | oTranslate }}\n          </div>\n          <ng-container *ngIf=\"!column.renderer\">\n            {{ dataSource.getAggregateData(column) }}\n          </ng-container>\n          <ng-template *ngIf=\"column.renderer && column.aggregate\" [ngTemplateOutlet]=\"column.renderer.templateref\"\n            [ngTemplateOutletContext]=\"{cellvalue: dataSource.getAggregateData(column)}\"></ng-template>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <!-- Expanded Content Column - The detail row is made up of this one column that spans across all columns -->\n    <ng-container *ngIf=\"hasExpandedRow\">\n      <ng-container matColumnDef=\"expandedDetail\">\n        <td mat-cell *matCellDef=\"let row;let rowIndex= dataIndex\" [attr.colspan]=\"oTableOptions.visibleColumns.length\">\n          <div [ngClass]=\"getExpandedRowContainerClass(rowIndex)\" [@detailExpand]=\"getStateExpand(row)\">\n          </div>\n        </td>\n      </ng-container>\n    </ng-container>\n\n    <!--FOOTER-INSERTABLE-->\n    <ng-container *ngIf=\"showLastInsertableRow && oTableInsertableRowComponent\">\n      <ng-container [matColumnDef]=\"oTableOptions.selectColumn.name + getSuffixColumnInsertable()\" *ngIf=\"oTableOptions.selectColumn.visible\">\n        <td mat-footer-cell *matFooterCellDef>\n        </td>\n      </ng-container>\n      <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"column.name+ getSuffixColumnInsertable()\">\n\n        <td mat-footer-cell *matFooterCellDef [ngClass]=\"column.className\">\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && !oTableInsertableRowComponent.useCellEditor(column)\">\n            <mat-form-field class=\"insertable-form-field o-table-cell-editor-text o-table-cell-editor\" [hideRequiredMarker]=\"false\">\n              <input matInput type=\"text\" [placeholder]=\"oTableInsertableRowComponent.getPlaceholder(column)\" [id]=\"column.attr\"\n                [formControl]=\"oTableInsertableRowComponent.getControl(column)\" [required]=\"oTableInsertableRowComponent.isColumnRequired(column)\">\n              <mat-error *oMatError=\"oTableInsertableRowComponent.columnHasError(column, 'required')\">\n                {{ 'FORM_VALIDATION.REQUIRED' | oTranslate }}\n              </mat-error>\n            </mat-form-field>\n          </ng-container>\n\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && oTableInsertableRowComponent.useCellEditor(column)\">\n            <ng-template [ngTemplateOutlet]=\"oTableInsertableRowComponent.columnEditors[column.attr].templateref\"\n              [ngTemplateOutletContext]=\"{ rowvalue: oTableInsertableRowComponent.rowData }\">\n            </ng-template>\n          </ng-container>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <ng-container *ngIf=\"showFirstInsertableRow && oTableInsertableRowComponent\">\n      <ng-container [matColumnDef]=\"getColumnInsertable(oTableOptions.selectColumn.name)\" *ngIf=\"oTableOptions.selectColumn.visible\">\n        <td mat-header-cell *matHeaderCellDef>\n        </td>\n      </ng-container>\n      <ng-container *ngFor=\"let column of oTableOptions.columns\" [matColumnDef]=\"getColumnInsertable(column.name)\">\n\n        <td mat-header-cell *matHeaderCellDef [ngClass]=\"column.className\">\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && !oTableInsertableRowComponent.useCellEditor(column)\">\n            <mat-form-field class=\"insertable-form-field\" [hideRequiredMarker]=\"false\">\n              <input matInput type=\"text\" [placeholder]=\"oTableInsertableRowComponent.getPlaceholder(column)\" [id]=\"column.attr\"\n                [formControl]=\"oTableInsertableRowComponent.getControl(column)\" [required]=\"oTableInsertableRowComponent.isColumnRequired(column)\">\n              <mat-error *oMatError=\"oTableInsertableRowComponent.columnHasError(column, 'required')\">\n                {{ 'FORM_VALIDATION.REQUIRED' | oTranslate }}\n              </mat-error>\n            </mat-form-field>\n          </ng-container>\n\n          <ng-container *ngIf=\"oTableInsertableRowComponent.isColumnInsertable(column) && oTableInsertableRowComponent.useCellEditor(column)\">\n            <ng-template [ngTemplateOutlet]=\"oTableInsertableRowComponent.columnEditors[column.attr].templateref\"\n              [ngTemplateOutletContext]=\"{ rowvalue: oTableInsertableRowComponent.rowData }\">\n            </ng-template>\n          </ng-container>\n        </td>\n      </ng-container>\n\n    </ng-container>\n\n    <!-- Definition column group header -->\n    <ng-container *ngFor=\"let column of groupingHeadersRows; let i = index\" [matColumnDef]=\"column\">\n      <td mat-cell *matCellDef=\"let group\" class=\"grouping-row\" [oContextMenu]=\"tableContextMenu\"\n        [oContextMenuData]=\"{ cellName:column, rowValue:group, rowIndex:i}\" [ngClass]=\"getGroupHeaderCellAlignClass(column)\">\n        <div *ngIf=\"i===0\" class=\"grouping-title-wrapper\" [ngStyle]=\"{'padding-left': 20*(group.level-1)+'px'}\">\n          <mat-icon>{{ group.expanded ? 'expand_more' : 'chevron_right' }}</mat-icon>\n          {{ group.title }}\n        </div>\n        <div class=\"grouping-aggregate\" *ngIf=\"group.hasActiveAggregate(visibleColArray[i])\">\n          {{ group.getColumnActiveAggregateTitle(visibleColArray[i]) | oTranslate }} :\n          <ng-container *ngIf=\"!getOColumnFromGroupHeaderColumn(column).renderer\">\n            {{ group.getColumnAggregateValue(visibleColArray[i])}}\n          </ng-container>\n          <ng-container *ngIf=\"getOColumnFromGroupHeaderColumn(column).renderer\">\n            <ng-template\n              *ngTemplateOutlet=\"getOColumnFromGroupHeaderColumn(column).renderer?.templateref; context:{ cellvalue:  group.getColumnAggregateValue(visibleColArray[i]) }\">\n            </ng-template>\n          </ng-container>\n        </div>\n      </td>\n    </ng-container>\n\n    <ng-container matColumnDef=\"position\">\n      <td mat-cell *matCellDef=\"let row\"> {{row}} </td>\n    </ng-container>\n\n    <tr #tableHeader mat-header-row *matHeaderRowDef=\"oTableOptions.visibleColumns; sticky: fixedHeader\"></tr>\n\n    <ng-container *ngIf=\"!table.multiTemplateDataRows; else rowTemplateMultiTemplateDataRows\">\n      <tr mat-row oTableRow *matRowDef=\"let row; columns: oTableOptions.visibleColumns; when:isNotGroup; let rowIndex = index\"\n        [class.selected]=\"isRowSelected(row)\" [ngClass]=\"row | oTableRowClass: rowIndex: rowClass\">\n      </tr>\n    </ng-container>\n    <ng-template #rowTemplateMultiTemplateDataRows>\n      <tr mat-row oTableRow *matRowDef=\"let row; columns: oTableOptions.visibleColumns; when:isNotGroup; let rowIndex = dataIndex\"\n        [class.selected]=\"isRowSelected(row)\" [ngClass]=\"row | oTableRowClass: rowIndex: rowClass\">\n      </tr>\n    </ng-template>\n\n    <!-- Row Group header -->\n    <tr mat-row *matRowDef=\"let row; columns: groupingHeadersRows; when:isGroup\" (click)=\"groupHeaderClick(row)\"\n      [ngClass]=\"getClassNameGroupHeader(row)\">\n    </tr>\n\n    <!-- Expanded detail row-->\n    <ng-container *ngIf=\"hasExpandedRow\">\n      <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"o-table-row-expanded\"></tr>\n    </ng-container>\n\n    <ng-container *ngIf=\"showLastInsertableRow\">\n      <tr mat-footer-row *matFooterRowDef=\"oTableOptions.columnsInsertables; sticky: true\"\n        (keyup)=\"oTableInsertableRowComponent.handleKeyboardEvent($event)\" class=\"o-table-insertable\"></tr>\n    </ng-container>\n    <ng-container *ngIf=\"showFirstInsertableRow\">\n      <tr mat-header-row *matHeaderRowDef=\"oTableOptions.columnsInsertables; sticky: true\"\n        (keyup)=\"oTableInsertableRowComponent.handleKeyboardEvent($event)\" class=\"o-table-insertable\"> </tr>\n    </ng-container>\n    <ng-container *ngIf=\"showTotals | async\">\n      <tr mat-footer-row *matFooterRowDef=\"oTableOptions.visibleColumns; sticky: true\" class=\"o-table-aggregate\">\n      </tr>\n    </ng-container>\n  </table>\n\n</ng-template>\n\n<ng-container *ngIf=\"!contextMenuContentChild && contextMenu\">\n  <o-table-context-menu [insert]=\"insertButton\" [edit]=\"editionMode !== EDIT_MODE_NONE\" [view-detail]=\"detailMode !== DETAIL_MODE_NONE\"\n    [refresh]=\"refreshButton\" [delete]=\"deleteButton\" [filter]=\"showFilterOption\" [group-by-row]=\"groupable\">\n  </o-table-context-menu>\n</ng-container>\n\n<ng-template #cellRenderer let-row=\"row\" let-column=\"column\">\n  <div class=\"content\">\n\n    <ng-container [ngSwitch]=\"true\">\n      <ng-container *ngSwitchCase=\"column.renderer != null && (!column.editing || column.editing && !isRowSelected(row))\">\n        <ng-template *ngTemplateOutlet=\"column.renderer?.templateref; context:{ cellvalue: row[column.name], rowvalue:row }\">\n        </ng-template>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"isRowSelected(row) && column.editing\">\n        <ng-template *ngTemplateOutlet=\"column.editor?.templateref; context:{ cellvalue: row[column.name], rowvalue:row }\">\n        </ng-template>\n      </ng-container>\n\n      <ng-container *ngSwitchCase=\"column.type === 'editButtonInRow' || column.type === 'detailButtonInRow'\">\n        <div fxLayoutAlign=\"center center\" class=\"o-action-cell-renderer\" (click)=\"onDetailButtonClick(column, row, $event)\">\n          <mat-icon>{{ getDetailButtonIcon(column) }}</mat-icon>\n        </div>\n      </ng-container>\n      <ng-container *ngSwitchDefault>{{ row[column.name] }}</ng-container>\n    </ng-container>\n\n  </div>\n</ng-template>\n", styles: [".o-table{height:100%;max-height:100%;width:100%}.o-table.o-table-disabled{opacity:.4}.o-table .o-table-container{height:100%;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;align-items:flex-start;align-content:stretch;min-width:100%;min-height:400px;position:relative;padding:0 .5%}.o-table .o-table-container .o-table-body{display:flex;flex:1 1 auto}.o-table .o-table-container .o-table-body .o-table-overflow{overflow-y:auto;overflow-x:hidden;min-width:100%}.o-table .o-table-container .o-table-body.horizontal-scroll .o-table-overflow{overflow-x:auto}.o-table .o-table-container .o-table-body thead .mat-mdc-header-row th:last-child .o-table-column-resizer{display:none}.o-table .o-table-container.block-events{pointer-events:none}.o-table .o-table-container.block-events>.o-table-toolbar,.o-table .o-table-container.block-events>.o-table-body .mat-mdc-header-row{opacity:.75}.o-table .o-table-container .o-table-toolbar{height:40px}.o-table .o-table-container .o-table-toolbar>div{max-height:100%}.o-table .o-table-container .o-table-toolbar .buttons{margin:0 10px 0 4px}.o-table .o-table-container .o-table-body{max-width:100%;height:100%;overflow:hidden;position:relative}.o-table .o-table-container .o-table-body .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}.o-table .o-table-container .o-table-body.horizontal-scroll{overflow-x:auto;padding-bottom:16px}.o-table .o-table-container .o-table-body.horizontal-scroll .mat-mdc-header-cell{width:150px}.o-table .o-table-container .o-table-body .o-table-no-results{cursor:default;text-align:center}.o-table .o-table-container .o-table-body .o-table-no-results td{text-align:center}.o-table .o-table-container .mat-mdc-table{table-layout:fixed;width:100%}.o-table .o-table-container .mat-mdc-table.autoadjusted{table-layout:auto}.o-table .o-table-container .mat-mdc-table td .content,.o-table .o-table-container .mat-mdc-table th .content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table.small .mat-mdc-header-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-header-row .mat-mdc-header-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table.small .mat-mdc-row .mat-mdc-header-cell .image-avatar{width:24px;height:24px}.o-table .o-table-container .mat-mdc-table.large .column-filter-icon{margin-top:4px}.o-table .o-table-container .mat-mdc-table.large .mat-sort-header-arrow{margin-top:7px}.o-table .o-table-container .mat-mdc-table tr.mat-mdc-row.o-table-row-expanded{height:0}.o-table .o-table-container .mat-mdc-table tr.o-table-insertable td{height:1px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row{box-sizing:border-box;transition:background-color .2s;position:relative;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell{padding:0 12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell:not(.o-column-image):first-of-type,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell:not(.o-column-image):first-of-type{padding-left:24px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell:last-of-type,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell:last-of-type{padding-right:24px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row{padding-top:30px;cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row .grouping-title-wrapper,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row .grouping-title-wrapper{position:absolute;width:100%;left:0;top:0;text-align:left}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.grouping-row .grouping-aggregate,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.grouping-row .grouping-aggregate{font-weight:700;font-size:14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-bottom:8px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.empty-cell,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.empty-cell{min-height:16px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .action-cell-renderer,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .action-cell-renderer{cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-start,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-start{text-align:start}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-center,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-center{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-end,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-end{text-align:end}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell *,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell *{vertical-align:middle}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-mat-cell-multiline:not(.mat-mdc-header-cell),.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-mat-cell-multiline:not(.mat-mdc-header-cell){padding:6px 12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell.o-mat-cell-multiline .content,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell.o-mat-cell-multiline .content{overflow:initial;white-space:normal;text-overflow:unset}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .image-avatar,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .image-avatar{width:32px;height:32px;margin:1px auto;overflow:hidden;border-radius:50%;position:relative;z-index:1}.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-cell .image-avatar img,.o-table .o-table-container .mat-mdc-table .mat-mdc-row .mat-mdc-header-cell .image-avatar img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-width:inherit;max-height:inherit}.o-table .o-table-container .mat-mdc-table .o-action-cell-renderer{display:inline-block;cursor:pointer}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell{overflow:hidden;position:relative;box-sizing:border-box;padding:0 12px;vertical-align:middle}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select.mat-header-select-all-with-title{padding-right:12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:first-of-type{padding-left:0}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:not(.o-column-image){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .o-table-header-indicator-numbered{font-size:8px;position:absolute;text-align:center;display:inline-block;width:18px;height:18px;line-height:18px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;bottom:-10px;right:-9px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .column-filter-icon{cursor:pointer;font-size:18px;width:18px;height:18px;line-height:1}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .mat-sort-header-button{flex:1;display:block;place-content:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .header-title-container{cursor:default;min-height:20px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .header-title-container,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .mat-sort-header-button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.start,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.start .mat-sort-header-button{text-align:left}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.center,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.center .mat-sort-header-button{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.end,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.end .mat-sort-header-button{text-align:right}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select{box-sizing:content-box;overflow:initial}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select:not(.mat-header-select-all-with-title),.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select:not(.mat-header-select-all-with-title){width:18px}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-select .mat-checkbox-layout,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-select .mat-checkbox-layout{text-overflow:ellipsis;overflow:hidden;display:inline}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell.mat-column-expandable,.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell.mat-column-expandable{width:40px;box-sizing:content-box;padding:0 0 0 24px;overflow:initial}.o-table .o-table-container .mat-mdc-table .mat-mdc-cell .row-container-expanded{overflow:hidden;display:flex}.o-table .o-table-container .o-table-disabled-blocker{bottom:0;left:0;position:absolute;right:0;top:0;z-index:100}.o-table .spinner-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:500;visibility:visible;opacity:1;transition:opacity .25s linear}.o-table .spinner-container-scrollable{position:relative}.o-table.o-table-fixed{display:flex}.o-table.o-table-fixed .o-table-container{display:flex;flex-direction:column}.o-table.o-table-fixed .o-table-body{display:flex;flex:1}.o-table.o-table-fixed .o-table-body .o-table-overflow{flex:1;overflow-y:auto}.mat-mdc-tooltip.o-table-cell-tooltip{word-wrap:break-word;overflow:hidden;min-width:140px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i1$1.MatDialog }, { type: i0.ViewContainerRef }, { type: i0.ApplicationRef }, { type: OFormComponent, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -35004,9 +35042,8 @@ class OTableColumnComponent {
     get multiline() {
         return this._multiline;
     }
-    constructor(table, resolver, injector) {
+    constructor(table, injector) {
         this.table = table;
-        this.resolver = resolver;
         this.injector = injector;
         this._defaultSQLTypeKey = 'OTHER';
         this._searchable = true;
@@ -35079,148 +35116,143 @@ class OTableColumnComponent {
         if (!Util.isDefined(this.renderer) && Util.isDefined(this.type)) {
             const componentRef = renderersMapping[this.type];
             if (componentRef !== undefined) {
-                const factory = this.resolver.resolveComponentFactory(componentRef);
-                if (factory) {
-                    const ref = this.container.createComponent(factory);
-                    const newRenderer = ref.instance;
-                    newRenderer.filterSource = this.filterSource;
-                    newRenderer.filterFunction = this.filterFunction;
-                    switch (this.type) {
-                        case 'currency':
-                            newRenderer.currencySymbol = this.currencySymbol;
-                            newRenderer.currencySymbolPosition = this.currencySymbolPosition;
-                            newRenderer.decimalSeparator = this.decimalSeparator;
-                            newRenderer.minDecimalDigits = this.minDecimalDigits;
-                            newRenderer.maxDecimalDigits = this.maxDecimalDigits;
-                            newRenderer.grouping = this.grouping;
-                            newRenderer.thousandSeparator = this.thousandSeparator;
-                            break;
-                        case 'date':
-                            newRenderer.format = this.format;
-                            break;
-                        case 'time':
-                            newRenderer.format = this.format;
-                            break;
-                        case 'integer':
-                            newRenderer.grouping = this.grouping;
-                            newRenderer.thousandSeparator = this.thousandSeparator;
-                            break;
-                        case 'boolean':
-                            newRenderer.trueValue = this.trueValue;
-                            newRenderer.falseValue = this.falseValue;
-                            newRenderer.renderTrueValue = this.renderTrueValue;
-                            newRenderer.renderFalseValue = this.renderFalseValue;
-                            newRenderer.renderType = this.renderType;
-                            newRenderer.booleanType = this.booleanType;
-                            break;
-                        case 'percentage':
-                            newRenderer.valueBase = this.valueBase;
-                        case 'real':
-                            newRenderer.decimalSeparator = this.decimalSeparator;
-                            newRenderer.minDecimalDigits = this.minDecimalDigits;
-                            newRenderer.maxDecimalDigits = this.maxDecimalDigits;
-                            newRenderer.grouping = this.grouping;
-                            newRenderer.thousandSeparator = this.thousandSeparator;
-                            break;
-                        case 'image':
-                            newRenderer.imageType = this.imageType;
-                            newRenderer.avatar = this.avatar;
-                            newRenderer.emptyImage = this.emptyImage;
-                            break;
-                        case 'action':
-                            newRenderer.icon = this.icon;
-                            newRenderer.action = this.action;
-                            newRenderer.text = this.text;
-                            newRenderer.iconPosition = this.iconPosition;
-                            newRenderer.onClick = this.onClick;
-                            break;
-                        case 'service':
-                            newRenderer.entity = this.entity;
-                            newRenderer.service = this.service;
-                            newRenderer.columns = this.columns;
-                            newRenderer.valueColumn = this.valueColumn;
-                            newRenderer.parentKeys = this.parentKeys;
-                            newRenderer.queryMethod = this.queryMethod;
-                            newRenderer.serviceType = this.serviceType;
-                            newRenderer.translate = this.translate;
-                            break;
-                        case 'translate':
-                            newRenderer.translateArgsFn = this.translateArgsFn;
-                            break;
-                    }
-                    this.registerRenderer(newRenderer);
-                }
-            }
-        }
-    }
-    buildCellEditor(type, resolver, container, propsOrigin, registerInColumn = true) {
-        let editor;
-        const componentRef = editorsMapping[type] || editorsMapping.text;
-        if (componentRef === undefined) {
-            return editor;
-        }
-        const factory = resolver.resolveComponentFactory(componentRef);
-        if (factory) {
-            const ref = container.createComponent(factory);
-            editor = ref.instance;
-            if (propsOrigin !== undefined) {
-                switch (type) {
+                let newRenderer;
+                const ref = this.container.createComponent(componentRef);
+                newRenderer = ref.instance;
+                newRenderer.filterSource = this.filterSource;
+                newRenderer.filterFunction = this.filterFunction;
+                switch (this.type) {
+                    case 'currency':
+                        newRenderer.currencySymbol = this.currencySymbol;
+                        newRenderer.currencySymbolPosition = this.currencySymbolPosition;
+                        newRenderer.decimalSeparator = this.decimalSeparator;
+                        newRenderer.minDecimalDigits = this.minDecimalDigits;
+                        newRenderer.maxDecimalDigits = this.maxDecimalDigits;
+                        newRenderer.grouping = this.grouping;
+                        newRenderer.thousandSeparator = this.thousandSeparator;
+                        break;
                     case 'date':
-                        editor.format = propsOrigin.format;
-                        editor.locale = propsOrigin.locale;
-                        editor.oStartView = propsOrigin.oStartView;
-                        editor.oMinDate = propsOrigin.oMinDate;
-                        editor.oMaxDate = propsOrigin.oMaxDate;
-                        editor.oTouchUi = propsOrigin.oTouchUi;
-                        editor.oStartAt = propsOrigin.oStartAt;
-                        editor.filterDate = propsOrigin.filterDate;
-                        editor.dateValueType = propsOrigin.dateValueType;
+                        newRenderer.format = this.format;
                         break;
                     case 'time':
-                        editor.oDateFormat = propsOrigin.oDateFormat;
-                        editor.oHourFormat = propsOrigin.oHourFormat;
-                        editor.oDateLocale = propsOrigin.oDateLocale;
-                        editor.oMinDate = propsOrigin.oMinDate;
-                        editor.oMaxDate = propsOrigin.oMaxDate;
-                        editor.oTouchUi = propsOrigin.oTouchUi;
-                        editor.oDateStartAt = propsOrigin.oDateStartAt;
-                        editor.oDateTextInputEnabled = propsOrigin.oDateTextInputEnabled;
-                        editor.oHourMin = propsOrigin.oHourMin;
-                        editor.oHourMax = propsOrigin.oHourMax;
-                        editor.oHourTextInputEnabled = propsOrigin.oHourTextInputEnabled;
-                        editor.oHourPlaceholder = propsOrigin.oHourPlaceholder;
-                        editor.oDatePlaceholder = propsOrigin.oDatePlaceholder;
+                        newRenderer.format = this.format;
+                        break;
+                    case 'integer':
+                        newRenderer.grouping = this.grouping;
+                        newRenderer.thousandSeparator = this.thousandSeparator;
                         break;
                     case 'boolean':
-                        editor.booleanType = propsOrigin.booleanType;
-                        editor.indeterminateOnNull = propsOrigin.indeterminateOnNull;
-                        editor.autoCommit = propsOrigin.autoCommit;
-                        editor.trueValue = propsOrigin.trueValue;
-                        editor.falseValue = propsOrigin.falseValue;
+                        newRenderer.trueValue = this.trueValue;
+                        newRenderer.falseValue = this.falseValue;
+                        newRenderer.renderTrueValue = this.renderTrueValue;
+                        newRenderer.renderFalseValue = this.renderFalseValue;
+                        newRenderer.renderType = this.renderType;
+                        newRenderer.booleanType = this.booleanType;
                         break;
-                    case 'integer':
                     case 'percentage':
-                    case 'currency':
+                        newRenderer.valueBase = this.valueBase;
                     case 'real':
-                        editor.min = propsOrigin.min;
-                        editor.max = propsOrigin.max;
-                        editor.step = Util.isDefined(propsOrigin.step) ? propsOrigin.step : editor.step;
+                        newRenderer.decimalSeparator = this.decimalSeparator;
+                        newRenderer.minDecimalDigits = this.minDecimalDigits;
+                        newRenderer.maxDecimalDigits = this.maxDecimalDigits;
+                        newRenderer.grouping = this.grouping;
+                        newRenderer.thousandSeparator = this.thousandSeparator;
                         break;
                     case 'image':
+                        newRenderer.imageType = this.imageType;
+                        newRenderer.avatar = this.avatar;
+                        newRenderer.emptyImage = this.emptyImage;
                         break;
-                    default:
+                    case 'action':
+                        newRenderer.icon = this.icon;
+                        newRenderer.action = this.action;
+                        newRenderer.text = this.text;
+                        newRenderer.iconPosition = this.iconPosition;
+                        newRenderer.onClick = this.onClick;
+                        break;
+                    case 'service':
+                        newRenderer.entity = this.entity;
+                        newRenderer.service = this.service;
+                        newRenderer.columns = this.columns;
+                        newRenderer.valueColumn = this.valueColumn;
+                        newRenderer.parentKeys = this.parentKeys;
+                        newRenderer.queryMethod = this.queryMethod;
+                        newRenderer.serviceType = this.serviceType;
+                        newRenderer.translate = this.translate;
+                        break;
+                    case 'translate':
+                        newRenderer.translateArgsFn = this.translateArgsFn;
                         break;
                 }
-                editor.olabel = propsOrigin.olabel;
-                editor.type = propsOrigin.type;
+                this.registerRenderer(newRenderer);
             }
-            editor.registerInColumn = registerInColumn;
         }
+    }
+    buildCellEditor(type, container, propsOrigin, registerInColumn = true) {
+        let editor;
+        const componentRef = editorsMapping[type] || editorsMapping.text;
+        if (componentRef === undefined) {
+            return editor;
+        }
+        const ref = container.createComponent(componentRef);
+        editor = ref.instance;
+        if (propsOrigin !== undefined) {
+            switch (type) {
+                case 'date':
+                    editor.format = propsOrigin.format;
+                    editor.locale = propsOrigin.locale;
+                    editor.oStartView = propsOrigin.oStartView;
+                    editor.oMinDate = propsOrigin.oMinDate;
+                    editor.oMaxDate = propsOrigin.oMaxDate;
+                    editor.oTouchUi = propsOrigin.oTouchUi;
+                    editor.oStartAt = propsOrigin.oStartAt;
+                    editor.filterDate = propsOrigin.filterDate;
+                    editor.dateValueType = propsOrigin.dateValueType;
+                    break;
+                case 'time':
+                    editor.oDateFormat = propsOrigin.oDateFormat;
+                    editor.oHourFormat = propsOrigin.oHourFormat;
+                    editor.oDateLocale = propsOrigin.oDateLocale;
+                    editor.oMinDate = propsOrigin.oMinDate;
+                    editor.oMaxDate = propsOrigin.oMaxDate;
+                    editor.oTouchUi = propsOrigin.oTouchUi;
+                    editor.oDateStartAt = propsOrigin.oDateStartAt;
+                    editor.oDateTextInputEnabled = propsOrigin.oDateTextInputEnabled;
+                    editor.oHourMin = propsOrigin.oHourMin;
+                    editor.oHourMax = propsOrigin.oHourMax;
+                    editor.oHourTextInputEnabled = propsOrigin.oHourTextInputEnabled;
+                    editor.oHourPlaceholder = propsOrigin.oHourPlaceholder;
+                    editor.oDatePlaceholder = propsOrigin.oDatePlaceholder;
+                    break;
+                case 'boolean':
+                    editor.booleanType = propsOrigin.booleanType;
+                    editor.indeterminateOnNull = propsOrigin.indeterminateOnNull;
+                    editor.autoCommit = propsOrigin.autoCommit;
+                    editor.trueValue = propsOrigin.trueValue;
+                    editor.falseValue = propsOrigin.falseValue;
+                    break;
+                case 'integer':
+                case 'percentage':
+                case 'currency':
+                case 'real':
+                    editor.min = propsOrigin.min;
+                    editor.max = propsOrigin.max;
+                    editor.step = Util.isDefined(propsOrigin.step) ? propsOrigin.step : editor.step;
+                    break;
+                case 'image':
+                    break;
+                default:
+                    break;
+            }
+            editor.olabel = propsOrigin.olabel;
+            editor.type = propsOrigin.type;
+        }
+        editor.registerInColumn = registerInColumn;
         return editor;
     }
     createEditor() {
         if (!Util.isDefined(this.editor) && this.editable) {
-            const newEditor = this.buildCellEditor(this.type, this.resolver, this.container, this);
+            const newEditor = this.buildCellEditor(this.type, this.container, this);
             if (newEditor) {
                 newEditor.orequired = this.orequired;
                 newEditor.showPlaceHolder = this.showPlaceHolder;
@@ -35321,7 +35353,7 @@ class OTableColumnComponent {
         return this._filterSource;
     }
 }
-OTableColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableColumnComponent, deps: [{ token: forwardRef(() => OTableComponent) }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
+OTableColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableColumnComponent, deps: [{ token: forwardRef(() => OTableComponent) }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
 OTableColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableColumnComponent, selector: "o-table-column", inputs: { attr: "attr", title: "title", titleAlign: ["title-align", "titleAlign"], contentAlign: ["content-align", "contentAlign"], orderable: "orderable", searchable: "searchable", groupable: "groupable", type: "type", editable: "editable", width: "width", minWidth: ["min-width", "minWidth"], maxWidth: ["max-width", "maxWidth"], asyncLoad: ["async-load", "asyncLoad"], sqlType: ["sql-type", "sqlType"], tooltip: "tooltip", tooltipValue: ["tooltip-value", "tooltipValue"], tooltipFunction: ["tooltip-function", "tooltipFunction"], multiline: "multiline", resizable: "resizable", filterExpressionFunction: ["filter-expression-function", "filterExpressionFunction"], class: "class", angularValidatorsFn: ["validators", "angularValidatorsFn"], angularValidatorsFnErrors: ["validators-errors", "angularValidatorsFnErrors"], angularAsyncValidatorsFn: ["async-validators", "angularAsyncValidatorsFn"], trueValue: ["true-value", "trueValue"], falseValue: ["false-value", "falseValue"], booleanType: ["boolean-type", "booleanType"], renderTrueValue: ["render-true-value", "renderTrueValue"], renderFalseValue: ["render-false-value", "renderFalseValue"], renderType: ["render-type", "renderType"], currencySymbol: ["currency-symbol", "currencySymbol"], currencySymbolPosition: ["currency-symbol-position", "currencySymbolPosition"], format: "format", imageType: ["image-type", "imageType"], emptyImage: ["empty-image", "emptyImage"], avatar: "avatar", icon: "icon", svgIcon: ["svg-icon", "svgIcon"], action: "action", text: "text", iconPosition: ["icon-position", "iconPosition"], entity: "entity", service: "service", columns: "columns", translate: "translate", valueColumn: ["value-column", "valueColumn"], valueColumnType: ["value-column-type", "valueColumnType"], parentKeys: ["parent-keys", "parentKeys"], queryMethod: ["query-method", "queryMethod"], serviceType: ["service-type", "serviceType"], translateArgsFn: ["translate-params", "translateArgsFn"], orequired: ["required", "orequired"], showPlaceHolder: ["show-placeholder", "showPlaceHolder"], olabel: ["label", "olabel"], updateRecordOnEdit: ["update-record-on-edit", "updateRecordOnEdit"], showNotificationOnEdit: ["show-notification-on-edit", "showNotificationOnEdit"], enabled: "enabled", min: "min", max: "max", step: "step", locale: "locale", oStartView: ["start-view", "oStartView"], oTouchUi: ["touch-ui", "oTouchUi"], startAt: ["start-at", "startAt"], filterDate: ["filter-date", "filterDate"], dateValueType: ["date-value-type", "dateValueType"], oDateFormat: ["date-format", "oDateFormat"], oDateLocale: ["date-locale", "oDateLocale"], oDateStartView: ["date-start-view", "oDateStartView"], oMinDate: ["date-min", "oMinDate"], oMaxDate: ["date-max", "oMaxDate"], oDateTouchUi: ["date-touch-ui", "oDateTouchUi"], oDateStartAt: ["date-start-at", "oDateStartAt"], oHourFormat: ["hour-format", "oHourFormat"], oHourMin: ["hour-min", "oHourMin"], oHourMax: ["hour-max", "oHourMax"], oHourPlaceholder: ["hour-placeholder", "oHourPlaceholder"], oDatePlaceholder: ["date-placeholder", "oDatePlaceholder"] }, outputs: { onClick: "onClick", onDataLoaded: "onDataLoaded", editionStarted: "editionStarted", editionCancelled: "editionCancelled", editionCommitted: "editionCommitted", onPostUpdateRecord: "onPostUpdateRecord" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<span #container>\n</span>", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 __decorate([
     BooleanInputConverter(),
@@ -35393,7 +35425,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
         }], ctorParameters: function () { return [{ type: OTableComponent, decorators: [{
                     type: Inject,
                     args: [forwardRef(() => OTableComponent)]
-                }] }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }]; }, propDecorators: { editable: [], tooltip: [], translate: [], orequired: [], showPlaceHolder: [], updateRecordOnEdit: [], showNotificationOnEdit: [], oTouchUi: [], min: [], max: [], step: [], minDecimalDigits: [], maxDecimalDigits: [], indeterminateOnNull: [], autoCommit: [], asyncLoad: [], container: [{
+                }] }, { type: i0.Injector }]; }, propDecorators: { editable: [], tooltip: [], translate: [], orequired: [], showPlaceHolder: [], updateRecordOnEdit: [], showNotificationOnEdit: [], oTouchUi: [], min: [], max: [], step: [], minDecimalDigits: [], maxDecimalDigits: [], indeterminateOnNull: [], autoCommit: [], asyncLoad: [], container: [{
                 type: ViewChild,
                 args: ['container', { read: ViewContainerRef, static: true }]
             }] } });
@@ -35403,14 +35435,13 @@ const DEFAULT_INPUTS_O_TABLE_COLUMN_CALCULATED = [
     'functionOperation: operation-function'
 ];
 class OTableColumnCalculatedComponent extends OTableColumnComponent {
-    constructor(table, resolver, injector) {
-        super(table, resolver, injector);
+    constructor(table, injector) {
+        super(table, injector);
         this.table = table;
-        this.resolver = resolver;
         this.injector = injector;
     }
 }
-OTableColumnCalculatedComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableColumnCalculatedComponent, deps: [{ token: forwardRef(() => OTableComponent) }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
+OTableColumnCalculatedComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableColumnCalculatedComponent, deps: [{ token: forwardRef(() => OTableComponent) }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
 OTableColumnCalculatedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableColumnCalculatedComponent, selector: "o-table-column-calculated", inputs: { operation: "operation", functionOperation: ["operation-function", "functionOperation"] }, providers: [
         {
             provide: OTableColumnComponent,
@@ -35428,7 +35459,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
         }], ctorParameters: function () { return [{ type: OTableComponent, decorators: [{
                     type: Inject,
                     args: [forwardRef(() => OTableComponent)]
-                }] }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }]; } });
+                }] }, { type: i0.Injector }]; } });
 
 const O_TABLE_DIALOGS = [
     OTableApplyConfigurationDialogComponent,
@@ -35712,10 +35743,9 @@ const DEFAULT_OUTPUTS_O_TABLE_INSERTABLE_ROW = [
     'onPostInsertRecord'
 ];
 class OTableInsertableRowComponent {
-    constructor(injector, table, resolver) {
+    constructor(injector, table) {
         this.injector = injector;
         this.table = table;
-        this.resolver = resolver;
         this.columnsArray = [];
         this.requiredColumnsArray = [];
         this.onPostInsertRecord = new EventEmitter();
@@ -35754,7 +35784,7 @@ class OTableInsertableRowComponent {
             .filter((col) => this.isColumnInsertable(col)).forEach(col => {
             const columnEditorType = col.editor ? col.editor.type : col.type;
             if (col.definition) {
-                const editor = col.definition.buildCellEditor(columnEditorType, this.resolver, col.definition.container, col.definition, false);
+                const editor = col.definition.buildCellEditor(columnEditorType, col.definition.container, col.definition, false);
                 this.columnEditors[col.attr] = editor;
                 let disabledCol = !this.enabled;
                 if (!disabledCol) {
@@ -35884,7 +35914,7 @@ class OTableInsertableRowComponent {
 }
 OTableInsertableRowComponent.AVAILABLE_ROW_POSITIONS = ['first', 'last'];
 OTableInsertableRowComponent.DEFAULT_ROW_POSITION = 'last';
-OTableInsertableRowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableInsertableRowComponent, deps: [{ token: i0.Injector }, { token: forwardRef(() => OTableComponent) }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+OTableInsertableRowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableInsertableRowComponent, deps: [{ token: i0.Injector }, { token: forwardRef(() => OTableComponent) }], target: i0.ɵɵFactoryTarget.Component });
 OTableInsertableRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableInsertableRowComponent, selector: "o-table-insertable-row", inputs: { columns: "columns", requiredColumns: ["required-columns", "requiredColumns"], position: "position", showPlaceHolder: ["show-placeholder", "showPlaceHolder"], includeParentKeys: ["include-parent-keys", "includeParentKeys"] }, outputs: { onPostInsertRecord: "onPostInsertRecord" }, ngImport: i0, template: ' ', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 __decorate([
     BooleanInputConverter(),
@@ -35906,7 +35936,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: OTableComponent, decorators: [{
                     type: Inject,
                     args: [forwardRef(() => OTableComponent)]
-                }] }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { showPlaceHolder: [], includeParentKeys: [] } });
+                }] }]; }, propDecorators: { showPlaceHolder: [], includeParentKeys: [] } });
 
 const O_TABLE_HEADER_COMPONENTS = [
     OTableButtonComponent,
@@ -36401,10 +36431,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
 class AppearanceService {
     constructor(injector) {
         this.injector = injector;
+        this.darkThemeClass = 'o-dark';
         this.isDarkModeSubject = new BehaviorSubject(false);
         this.isDarkMode$ = this.isDarkModeSubject.asObservable();
         this.localStorageService = this.injector.get(LocalStorageService);
+        this._document = inject(DOCUMENT);
         const config = this.localStorageService.getStoredData();
+        this.isDarkMode$.subscribe(x => this.updateThemeClass(x));
         if (config && config["theme"] && typeof config["theme"].isDark === 'boolean') {
             const isDark = config["theme"].isDark;
             this.isDarkModeSubject.next(isDark);
@@ -36422,6 +36455,14 @@ class AppearanceService {
     isDarkMode() {
         return this.isDarkModeSubject.value;
     }
+    updateThemeClass(isDark) {
+        if (isDark) {
+            this._document.body.classList.add(this.darkThemeClass);
+        }
+        else {
+            this._document.body.classList.remove(this.darkThemeClass);
+        }
+    }
 }
 AppearanceService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AppearanceService, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
 AppearanceService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AppearanceService, providedIn: 'root' });
@@ -36532,14 +36573,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
 class OUserInfoModule {
 }
 OUserInfoModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OUserInfoModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-OUserInfoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: OUserInfoModule, declarations: [OUserInfoComponent, OUserInfoConfigurationDirective, OUserInfoConfigurationItemDirective], imports: [CommonModule, OSharedModule, RouterModule], exports: [OUserInfoComponent] });
+OUserInfoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: OUserInfoModule, declarations: [OUserInfoComponent, OUserInfoConfigurationDirective, OUserInfoConfigurationItemDirective], imports: [CommonModule, OSharedModule, RouterModule], exports: [OUserInfoComponent, OUserInfoConfigurationDirective, OUserInfoConfigurationItemDirective] });
 OUserInfoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OUserInfoModule, imports: [CommonModule, OSharedModule, RouterModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OUserInfoModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [OUserInfoComponent, OUserInfoConfigurationDirective, OUserInfoConfigurationItemDirective],
                     imports: [CommonModule, OSharedModule, RouterModule],
-                    exports: [OUserInfoComponent]
+                    exports: [OUserInfoComponent, OUserInfoConfigurationDirective, OUserInfoConfigurationItemDirective]
                 }]
         }] });
 
@@ -37253,7 +37294,7 @@ class OAppSidenavComponent {
 OAppSidenavComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OAppSidenavComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i2$2.MediaObserver }], target: i0.ɵɵFactoryTarget.Component });
 OAppSidenavComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OAppSidenavComponent, selector: "o-app-sidenav", inputs: { opened: "opened", showUserInfo: ["show-user-info", "showUserInfo"], showToggleButton: ["show-toggle-button", "showToggleButton"], openedSidenavImg: ["opened-sidenav-image", "openedSidenavImg"], closedSidenavImg: ["closed-sidenav-image", "closedSidenavImg"], layoutMode: ["layout-mode", "layoutMode"], sidenavMode: ["sidenav-mode", "sidenavMode"] }, outputs: { onSidenavOpenedChange: "onSidenavOpenedChange", onSidenavOpenedStart: "onSidenavOpenedStart", onSidenavClosedStart: "onSidenavClosedStart", onSidenavToggle: "onSidenavToggle", afterSidenavToggle: "afterSidenavToggle" }, host: { listeners: { "window:resize": "onResize()" }, properties: { "class.o-app-sidenav": "true" } }, providers: [
         { provide: OAppSidenavBase, useExisting: forwardRef(() => OAppSidenavComponent) }
-    ], viewQueries: [{ propertyName: "sidenav", first: true, predicate: MatSidenav, descendants: true }], ngImport: i0, template: "<mat-sidenav-container class=\"o-app-sidenav-container\" [class.opened]=\"sidenav.opened\"\n  [class.o-app-sidenav-mode-desktop]=\"(layoutMode || 'desktop') === 'desktop'\"\n  [class.o-app-sidenav-mode-mobile]=\"(layoutMode || 'desktop') !== 'desktop'\">\n\n  <mat-sidenav #sidenav class=\"o-app-sidenav-sidenav o-scroll\" [opened]=\"isSidenavOpened()\"\n    [mode]=\"(sidenavMode || ((layoutMode || 'desktop') === 'desktop' ? 'side' : 'over'))\" [class.mat-drawer-opened]=\"sidenav.opened\"\n    [class.mat-drawer-closed]=\"!sidenav.opened\" fxLayoutAlign=\"start stretch\" (openedChange)=\"sidenavOpenedChange()\"\n    (closedStart)=\"sidenavClosedStart()\" (openedStart)=\"sidenavOpenedStart()\">\n    <div fxFlex fxLayout=\"column\">\n      <div fxLayout=\"row\" fxLayoutAlign=\"end center\" class=\"sidenav-toggle-container\" *ngIf=\"isDesktopMode()\">\n        <mat-icon class=\"sidenav-toggle\" (click)=\"toggleSidenav()\" svgIcon=\"ontimize:menu\">menu</mat-icon>\n      </div>\n\n      <o-app-sidenav-image [opened-src]=\"openedSidenavImg\" [closed-src]=\"closedSidenavImg\"> </o-app-sidenav-image>\n      <ng-content select=\"o-app-layout-sidenav-projection-start\"></ng-content>\n      <div class=\"navMenu\">\n        <nav *ngFor=\"let menuRootItem of menuRootArray\">\n\n          <ul *ngIf=\"appMenuService.getMenuItemType(menuRootItem) !== 'group'\">\n            <o-app-sidenav-menu-item [menu-item]=\"menuRootItem\" [menu-item-type]=\"appMenuService.getMenuItemType(menuRootItem)\"\n              [sidenav-opened]=\"sidenav.opened\" (onClick)=\"onMenuItemClick()\">\n            </o-app-sidenav-menu-item>\n          </ul>\n\n          <o-app-sidenav-menu-group [menu-group]=\"menuRootItem\" [sidenav-opened]=\"sidenav.opened\" level=\"1\"\n            *ngIf=\"appMenuService.getMenuItemType(menuRootItem) === 'group'\" (onItemClick)=\"onMenuItemClick()\">\n          </o-app-sidenav-menu-group>\n\n        </nav>\n      </div>\n      <div class=\"layout-sidenav-projection-end\">\n        <ng-content select=\"o-app-layout-sidenav-projection-end\"></ng-content>\n      </div>\n    </div>\n  </mat-sidenav>\n\n  <mat-sidenav-content class=\"o-app-sidenav-content\">\n    <ng-content></ng-content>\n  </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [".o-app-sidenav.header-layout .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav{box-shadow:3px 48px 6px #0000003d}.o-app-sidenav .navMenu{flex:1;display:flex;flex-direction:column;overflow:auto}@-moz-document url-prefix(){.o-app-sidenav .navMenu{height:100%}}.o-app-sidenav .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-menu-item a{margin-left:8px}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .mat-button-focus-overlay,.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .mat-mdc-button-persistent-ripple,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .mat-button-focus-overlay,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .mat-mdc-button-persistent-ripple{display:none}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .o-app-sidenav-item,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .o-app-sidenav-item{opacity:.5}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] a,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] a{cursor:initial}.o-app-sidenav .o-app-sidenav-menugroup{transition:background-color .5s}.o-app-sidenav .o-app-sidenav-menugroup-items-container{overflow:hidden}.o-app-sidenav .o-app-sidenav-container{width:100%;height:100%}.o-app-sidenav .o-app-sidenav-container.o-app-sidenav-mode-desktop:not(.opened) .o-app-sidenav-sidenav.mat-drawer-closed{visibility:visible!important;transform:translate3d(-191px,0,0);-moz-transform:translate3d(-181px,0,0)}.o-app-sidenav .o-app-sidenav-container.o-app-sidenav-mode-desktop:not(.opened) .o-app-sidenav-content.mat-drawer-content{margin-right:48px!important;transform:translate3d(48px,0,0)!important}.o-app-sidenav .o-app-sidenav-container .o-app-sidenav-content{position:absolute;right:0;left:0;min-height:100%;display:flex;flex-direction:column}.o-app-sidenav .o-app-sidenav-container .o-app-sidenav-content router-outlet+*{flex-grow:1}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav{box-shadow:3px 0 6px #0000003d;width:240px;bottom:0;overflow:auto;height:100%}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup{transition:padding .5s 0s}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup .o-app-sidenav-menugroup-arrow{transition:.5s transform cubic-bezier(.25,.8,.25,1)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup.opened .o-app-sidenav-menugroup-arrow{transform:rotate(90deg)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup-title,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menuitem-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{padding-left:28px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{padding-left:52px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-3 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-4 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-5 a{padding-right:4px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-3 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-4 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-5 a{padding-left:52px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup mat-icon:not(.o-app-sidenav-menugroup-arrow),.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menuitem mat-icon:not(.o-app-sidenav-menugroup-arrow){margin-right:16px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closing{transform:translate3d(-191px,0,0)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed{text-align:center}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item:not(.o-user-info){cursor:pointer}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item.o-user-info:focus,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item.o-user-info:hover{color:inherit}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-item a{width:40px;max-width:40px;min-width:40px;padding-left:4px;padding-right:12px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-group:not([disabled=true]) a.o-app-sidenav-viewer-sidenav-item-selected,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-item:not([disabled=true]) a.o-app-sidenav-viewer-sidenav-item-selected{padding:0 8px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed nav{width:48px;min-width:48px;margin-left:auto}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-image .o-app-sidenav-image-container{padding:0;text-align:end;max-height:36px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-image .o-app-sidenav-image-container .o-app-sidenav-image{max-height:36px;margin-right:8px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container{padding-bottom:16px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .sidenav-toggle-container{height:48px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container nav a{border-radius:0;box-sizing:border-box;display:block;line-height:48px;height:auto;font-size:14px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container nav a>.mat-icon{vertical-align:baseline}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container ul{list-style-type:none;margin:0;padding:0}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container ul li{margin:0;padding:0}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .sidenav-toggle{padding:4px 12px 8px;cursor:pointer}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a{font-size:14px;line-height:48px;height:48px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{font-size:12px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a{font-size:12px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{font-size:11px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a .mat-icon,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a .mat-icon{font-size:20px;height:20px;width:20px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menugroup-arrow{display:flex}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6$3.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i6$3.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6$3.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "component", type: OAppSidenavMenuGroupComponent, selector: "o-app-sidenav-menu-group", inputs: ["menu-group", "sidenav-opened", "level"], outputs: ["onItemClick"] }, { kind: "component", type: OAppSidenavImageComponent, selector: "o-app-sidenav-image", inputs: ["opened-src", "closed-src"] }, { kind: "component", type: OAppSidenavMenuItemComponent, selector: "o-app-sidenav-menu-item", inputs: ["menu-item", "menu-item-type", "sidenav-opened", "disabled"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    ], viewQueries: [{ propertyName: "sidenav", first: true, predicate: MatSidenav, descendants: true }], ngImport: i0, template: "<mat-sidenav-container class=\"o-app-sidenav-container\" [class.opened]=\"sidenav.opened\"\n  [class.o-app-sidenav-mode-desktop]=\"(layoutMode || 'desktop') === 'desktop'\"\n  [class.o-app-sidenav-mode-mobile]=\"(layoutMode || 'desktop') !== 'desktop'\">\n\n  <mat-sidenav #sidenav class=\"o-app-sidenav-sidenav o-scroll\" [opened]=\"isSidenavOpened()\"\n    [mode]=\"(sidenavMode || ((layoutMode || 'desktop') === 'desktop' ? 'side' : 'over'))\" [class.mat-drawer-opened]=\"sidenav.opened\"\n    [class.mat-drawer-closed]=\"!sidenav.opened\" fxLayoutAlign=\"start stretch\" (openedChange)=\"sidenavOpenedChange()\"\n    (closedStart)=\"sidenavClosedStart()\" (openedStart)=\"sidenavOpenedStart()\">\n    <div fxFlex fxLayout=\"column\">\n      <div fxLayout=\"row\" fxLayoutAlign=\"end center\" class=\"sidenav-toggle-container\" *ngIf=\"isDesktopMode()\">\n        <mat-icon class=\"sidenav-toggle\" (click)=\"toggleSidenav()\" svgIcon=\"ontimize:menu\">menu</mat-icon>\n      </div>\n\n      <o-app-sidenav-image [opened-src]=\"openedSidenavImg\" [closed-src]=\"closedSidenavImg\"> </o-app-sidenav-image>\n      <ng-content select=\"o-app-layout-sidenav-projection-start\"></ng-content>\n      <div class=\"navMenu\">\n        <nav *ngFor=\"let menuRootItem of menuRootArray\">\n\n          <ul *ngIf=\"appMenuService.getMenuItemType(menuRootItem) !== 'group'\">\n            <o-app-sidenav-menu-item [menu-item]=\"menuRootItem\" [menu-item-type]=\"appMenuService.getMenuItemType(menuRootItem)\"\n              [sidenav-opened]=\"sidenav.opened\" (onClick)=\"onMenuItemClick()\">\n            </o-app-sidenav-menu-item>\n          </ul>\n\n          <o-app-sidenav-menu-group [menu-group]=\"menuRootItem\" [sidenav-opened]=\"sidenav.opened\" level=\"1\"\n            *ngIf=\"appMenuService.getMenuItemType(menuRootItem) === 'group'\" (onItemClick)=\"onMenuItemClick()\">\n          </o-app-sidenav-menu-group>\n\n        </nav>\n      </div>\n      <div class=\"layout-sidenav-projection-end\">\n        <ng-content select=\"o-app-layout-sidenav-projection-end\"></ng-content>\n      </div>\n    </div>\n  </mat-sidenav>\n\n  <mat-sidenav-content class=\"o-app-sidenav-content\">\n    <ng-content></ng-content>\n  </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [".o-app-sidenav.header-layout .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav{box-shadow:3px 48px 6px #0000003d}.o-app-sidenav .navMenu{flex:1;display:flex;flex-direction:column;overflow:auto}@-moz-document url-prefix(){.o-app-sidenav .navMenu{height:100%}}.o-app-sidenav .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-menu-item a{margin-left:8px}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .mat-button-focus-overlay,.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .mat-mdc-button-persistent-ripple,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .mat-button-focus-overlay,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .mat-mdc-button-persistent-ripple{display:none}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .o-app-sidenav-item,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .o-app-sidenav-item{opacity:.5}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] a,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] a{cursor:initial}.o-app-sidenav .o-app-sidenav-menugroup{transition:background-color .5s}.o-app-sidenav .o-app-sidenav-menugroup-items-container{overflow:hidden}.o-app-sidenav .o-app-sidenav-container{width:100%;height:100%}.o-app-sidenav .o-app-sidenav-container.o-app-sidenav-mode-desktop:not(.opened) .o-app-sidenav-sidenav.mat-drawer-closed{visibility:visible!important;transform:translate3d(-191px,0,0);-moz-transform:translate3d(-181px,0,0)}.o-app-sidenav .o-app-sidenav-container.o-app-sidenav-mode-desktop:not(.opened) .o-app-sidenav-content.mat-drawer-content{margin-right:48px!important;transform:translate3d(48px,0,0)!important}.o-app-sidenav .o-app-sidenav-container .o-app-sidenav-content{position:absolute;right:0;left:0;min-height:100%;display:flex;flex-direction:column}.o-app-sidenav .o-app-sidenav-container .o-app-sidenav-content router-outlet+*{flex-grow:1}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav{box-shadow:3px 0 6px #0000003d;width:240px;bottom:0;overflow:auto;height:100%}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup{transition:padding .5s 0s}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup .o-app-sidenav-menugroup-arrow{transition:.5s transform cubic-bezier(.25,.8,.25,1)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup.opened .o-app-sidenav-menugroup-arrow{transform:rotate(90deg)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup-title,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menuitem-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{padding-left:28px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{padding-left:52px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-3 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-4 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-5 a{padding-right:4px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-3 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-4 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-5 a{padding-left:52px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup mat-icon:not(.o-app-sidenav-menugroup-arrow),.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menuitem mat-icon:not(.o-app-sidenav-menugroup-arrow){margin-right:16px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closing{transform:translate3d(-191px,0,0)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed{text-align:center}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item:not(.o-user-info){cursor:pointer}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item.o-user-info:focus,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item.o-user-info:hover{color:inherit}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-group:not([disabled=true]) a.o-app-sidenav-viewer-sidenav-item-selected,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-item:not([disabled=true]) a.o-app-sidenav-viewer-sidenav-item-selected{padding:0 8px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed nav{width:48px;min-width:48px;margin-left:auto}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-image .o-app-sidenav-image-container{padding:0;text-align:end;max-height:36px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-image .o-app-sidenav-image-container .o-app-sidenav-image{max-height:36px;margin-right:8px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container{padding-bottom:16px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .sidenav-toggle-container{height:48px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container nav a{border-radius:0;box-sizing:border-box;display:block;line-height:48px;height:auto;font-size:14px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container nav a>.mat-icon{vertical-align:middle;height:24px;width:24px;font-size:24px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container ul{list-style-type:none;margin:0;padding:0}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container ul li{margin:0;padding:0}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .sidenav-toggle{padding:4px 12px 8px;cursor:pointer}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a{font-size:14px;line-height:48px;height:48px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{font-size:12px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a .mat-mdc-button-touch-target,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a .mat-mdc-button-touch-target{height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a{font-size:12px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a .mat-mdc-button-touch-target{height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{font-size:11px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a .mat-mdc-button-touch-target,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a .mat-mdc-button-touch-target{height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a .mat-icon,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a .mat-icon{font-size:20px;height:20px;width:20px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menugroup-arrow{display:flex}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6$3.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i6$3.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6$3.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "component", type: OAppSidenavMenuGroupComponent, selector: "o-app-sidenav-menu-group", inputs: ["menu-group", "sidenav-opened", "level"], outputs: ["onItemClick"] }, { kind: "component", type: OAppSidenavImageComponent, selector: "o-app-sidenav-image", inputs: ["opened-src", "closed-src"] }, { kind: "component", type: OAppSidenavMenuItemComponent, selector: "o-app-sidenav-menu-item", inputs: ["menu-item", "menu-item-type", "sidenav-opened", "disabled"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     BooleanInputConverter(),
     __metadata("design:type", Boolean)
@@ -37264,7 +37305,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                         '[class.o-app-sidenav]': 'true'
                     }, providers: [
                         { provide: OAppSidenavBase, useExisting: forwardRef(() => OAppSidenavComponent) }
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-sidenav-container class=\"o-app-sidenav-container\" [class.opened]=\"sidenav.opened\"\n  [class.o-app-sidenav-mode-desktop]=\"(layoutMode || 'desktop') === 'desktop'\"\n  [class.o-app-sidenav-mode-mobile]=\"(layoutMode || 'desktop') !== 'desktop'\">\n\n  <mat-sidenav #sidenav class=\"o-app-sidenav-sidenav o-scroll\" [opened]=\"isSidenavOpened()\"\n    [mode]=\"(sidenavMode || ((layoutMode || 'desktop') === 'desktop' ? 'side' : 'over'))\" [class.mat-drawer-opened]=\"sidenav.opened\"\n    [class.mat-drawer-closed]=\"!sidenav.opened\" fxLayoutAlign=\"start stretch\" (openedChange)=\"sidenavOpenedChange()\"\n    (closedStart)=\"sidenavClosedStart()\" (openedStart)=\"sidenavOpenedStart()\">\n    <div fxFlex fxLayout=\"column\">\n      <div fxLayout=\"row\" fxLayoutAlign=\"end center\" class=\"sidenav-toggle-container\" *ngIf=\"isDesktopMode()\">\n        <mat-icon class=\"sidenav-toggle\" (click)=\"toggleSidenav()\" svgIcon=\"ontimize:menu\">menu</mat-icon>\n      </div>\n\n      <o-app-sidenav-image [opened-src]=\"openedSidenavImg\" [closed-src]=\"closedSidenavImg\"> </o-app-sidenav-image>\n      <ng-content select=\"o-app-layout-sidenav-projection-start\"></ng-content>\n      <div class=\"navMenu\">\n        <nav *ngFor=\"let menuRootItem of menuRootArray\">\n\n          <ul *ngIf=\"appMenuService.getMenuItemType(menuRootItem) !== 'group'\">\n            <o-app-sidenav-menu-item [menu-item]=\"menuRootItem\" [menu-item-type]=\"appMenuService.getMenuItemType(menuRootItem)\"\n              [sidenav-opened]=\"sidenav.opened\" (onClick)=\"onMenuItemClick()\">\n            </o-app-sidenav-menu-item>\n          </ul>\n\n          <o-app-sidenav-menu-group [menu-group]=\"menuRootItem\" [sidenav-opened]=\"sidenav.opened\" level=\"1\"\n            *ngIf=\"appMenuService.getMenuItemType(menuRootItem) === 'group'\" (onItemClick)=\"onMenuItemClick()\">\n          </o-app-sidenav-menu-group>\n\n        </nav>\n      </div>\n      <div class=\"layout-sidenav-projection-end\">\n        <ng-content select=\"o-app-layout-sidenav-projection-end\"></ng-content>\n      </div>\n    </div>\n  </mat-sidenav>\n\n  <mat-sidenav-content class=\"o-app-sidenav-content\">\n    <ng-content></ng-content>\n  </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [".o-app-sidenav.header-layout .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav{box-shadow:3px 48px 6px #0000003d}.o-app-sidenav .navMenu{flex:1;display:flex;flex-direction:column;overflow:auto}@-moz-document url-prefix(){.o-app-sidenav .navMenu{height:100%}}.o-app-sidenav .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-menu-item a{margin-left:8px}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .mat-button-focus-overlay,.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .mat-mdc-button-persistent-ripple,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .mat-button-focus-overlay,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .mat-mdc-button-persistent-ripple{display:none}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .o-app-sidenav-item,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .o-app-sidenav-item{opacity:.5}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] a,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] a{cursor:initial}.o-app-sidenav .o-app-sidenav-menugroup{transition:background-color .5s}.o-app-sidenav .o-app-sidenav-menugroup-items-container{overflow:hidden}.o-app-sidenav .o-app-sidenav-container{width:100%;height:100%}.o-app-sidenav .o-app-sidenav-container.o-app-sidenav-mode-desktop:not(.opened) .o-app-sidenav-sidenav.mat-drawer-closed{visibility:visible!important;transform:translate3d(-191px,0,0);-moz-transform:translate3d(-181px,0,0)}.o-app-sidenav .o-app-sidenav-container.o-app-sidenav-mode-desktop:not(.opened) .o-app-sidenav-content.mat-drawer-content{margin-right:48px!important;transform:translate3d(48px,0,0)!important}.o-app-sidenav .o-app-sidenav-container .o-app-sidenav-content{position:absolute;right:0;left:0;min-height:100%;display:flex;flex-direction:column}.o-app-sidenav .o-app-sidenav-container .o-app-sidenav-content router-outlet+*{flex-grow:1}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav{box-shadow:3px 0 6px #0000003d;width:240px;bottom:0;overflow:auto;height:100%}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup{transition:padding .5s 0s}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup .o-app-sidenav-menugroup-arrow{transition:.5s transform cubic-bezier(.25,.8,.25,1)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup.opened .o-app-sidenav-menugroup-arrow{transform:rotate(90deg)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup-title,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menuitem-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{padding-left:28px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{padding-left:52px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-3 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-4 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-5 a{padding-right:4px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-3 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-4 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-5 a{padding-left:52px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup mat-icon:not(.o-app-sidenav-menugroup-arrow),.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menuitem mat-icon:not(.o-app-sidenav-menugroup-arrow){margin-right:16px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closing{transform:translate3d(-191px,0,0)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed{text-align:center}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item:not(.o-user-info){cursor:pointer}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item.o-user-info:focus,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item.o-user-info:hover{color:inherit}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-item a{width:40px;max-width:40px;min-width:40px;padding-left:4px;padding-right:12px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-group:not([disabled=true]) a.o-app-sidenav-viewer-sidenav-item-selected,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-item:not([disabled=true]) a.o-app-sidenav-viewer-sidenav-item-selected{padding:0 8px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed nav{width:48px;min-width:48px;margin-left:auto}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-image .o-app-sidenav-image-container{padding:0;text-align:end;max-height:36px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-image .o-app-sidenav-image-container .o-app-sidenav-image{max-height:36px;margin-right:8px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container{padding-bottom:16px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .sidenav-toggle-container{height:48px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container nav a{border-radius:0;box-sizing:border-box;display:block;line-height:48px;height:auto;font-size:14px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container nav a>.mat-icon{vertical-align:baseline}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container ul{list-style-type:none;margin:0;padding:0}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container ul li{margin:0;padding:0}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .sidenav-toggle{padding:4px 12px 8px;cursor:pointer}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a{font-size:14px;line-height:48px;height:48px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{font-size:12px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a{font-size:12px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{font-size:11px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a .mat-icon,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a .mat-icon{font-size:20px;height:20px;width:20px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menugroup-arrow{display:flex}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-sidenav-container class=\"o-app-sidenav-container\" [class.opened]=\"sidenav.opened\"\n  [class.o-app-sidenav-mode-desktop]=\"(layoutMode || 'desktop') === 'desktop'\"\n  [class.o-app-sidenav-mode-mobile]=\"(layoutMode || 'desktop') !== 'desktop'\">\n\n  <mat-sidenav #sidenav class=\"o-app-sidenav-sidenav o-scroll\" [opened]=\"isSidenavOpened()\"\n    [mode]=\"(sidenavMode || ((layoutMode || 'desktop') === 'desktop' ? 'side' : 'over'))\" [class.mat-drawer-opened]=\"sidenav.opened\"\n    [class.mat-drawer-closed]=\"!sidenav.opened\" fxLayoutAlign=\"start stretch\" (openedChange)=\"sidenavOpenedChange()\"\n    (closedStart)=\"sidenavClosedStart()\" (openedStart)=\"sidenavOpenedStart()\">\n    <div fxFlex fxLayout=\"column\">\n      <div fxLayout=\"row\" fxLayoutAlign=\"end center\" class=\"sidenav-toggle-container\" *ngIf=\"isDesktopMode()\">\n        <mat-icon class=\"sidenav-toggle\" (click)=\"toggleSidenav()\" svgIcon=\"ontimize:menu\">menu</mat-icon>\n      </div>\n\n      <o-app-sidenav-image [opened-src]=\"openedSidenavImg\" [closed-src]=\"closedSidenavImg\"> </o-app-sidenav-image>\n      <ng-content select=\"o-app-layout-sidenav-projection-start\"></ng-content>\n      <div class=\"navMenu\">\n        <nav *ngFor=\"let menuRootItem of menuRootArray\">\n\n          <ul *ngIf=\"appMenuService.getMenuItemType(menuRootItem) !== 'group'\">\n            <o-app-sidenav-menu-item [menu-item]=\"menuRootItem\" [menu-item-type]=\"appMenuService.getMenuItemType(menuRootItem)\"\n              [sidenav-opened]=\"sidenav.opened\" (onClick)=\"onMenuItemClick()\">\n            </o-app-sidenav-menu-item>\n          </ul>\n\n          <o-app-sidenav-menu-group [menu-group]=\"menuRootItem\" [sidenav-opened]=\"sidenav.opened\" level=\"1\"\n            *ngIf=\"appMenuService.getMenuItemType(menuRootItem) === 'group'\" (onItemClick)=\"onMenuItemClick()\">\n          </o-app-sidenav-menu-group>\n\n        </nav>\n      </div>\n      <div class=\"layout-sidenav-projection-end\">\n        <ng-content select=\"o-app-layout-sidenav-projection-end\"></ng-content>\n      </div>\n    </div>\n  </mat-sidenav>\n\n  <mat-sidenav-content class=\"o-app-sidenav-content\">\n    <ng-content></ng-content>\n  </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [".o-app-sidenav.header-layout .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav{box-shadow:3px 48px 6px #0000003d}.o-app-sidenav .navMenu{flex:1;display:flex;flex-direction:column;overflow:auto}@-moz-document url-prefix(){.o-app-sidenav .navMenu{height:100%}}.o-app-sidenav .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-menu-item a{margin-left:8px}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .mat-button-focus-overlay,.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .mat-mdc-button-persistent-ripple,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .mat-button-focus-overlay,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .mat-mdc-button-persistent-ripple{display:none}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] .o-app-sidenav-item,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] .o-app-sidenav-item{opacity:.5}.o-app-sidenav .o-app-sidenav-menu-group[disabled=true] a,.o-app-sidenav .o-app-sidenav-menu-item[disabled=true] a{cursor:initial}.o-app-sidenav .o-app-sidenav-menugroup{transition:background-color .5s}.o-app-sidenav .o-app-sidenav-menugroup-items-container{overflow:hidden}.o-app-sidenav .o-app-sidenav-container{width:100%;height:100%}.o-app-sidenav .o-app-sidenav-container.o-app-sidenav-mode-desktop:not(.opened) .o-app-sidenav-sidenav.mat-drawer-closed{visibility:visible!important;transform:translate3d(-191px,0,0);-moz-transform:translate3d(-181px,0,0)}.o-app-sidenav .o-app-sidenav-container.o-app-sidenav-mode-desktop:not(.opened) .o-app-sidenav-content.mat-drawer-content{margin-right:48px!important;transform:translate3d(48px,0,0)!important}.o-app-sidenav .o-app-sidenav-container .o-app-sidenav-content{position:absolute;right:0;left:0;min-height:100%;display:flex;flex-direction:column}.o-app-sidenav .o-app-sidenav-container .o-app-sidenav-content router-outlet+*{flex-grow:1}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav{box-shadow:3px 0 6px #0000003d;width:240px;bottom:0;overflow:auto;height:100%}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup{transition:padding .5s 0s}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup .o-app-sidenav-menugroup-arrow{transition:.5s transform cubic-bezier(.25,.8,.25,1)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup.opened .o-app-sidenav-menugroup-arrow{transform:rotate(90deg)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup-title,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menuitem-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{padding-left:28px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{padding-left:52px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-2 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-3 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-4 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-5 a{padding-right:4px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-3 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-4 a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menu-group-level-5 a{padding-left:52px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menugroup mat-icon:not(.o-app-sidenav-menugroup-arrow),.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav:not(.mat-drawer-closed) .o-app-sidenav-menuitem mat-icon:not(.o-app-sidenav-menugroup-arrow){margin-right:16px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closing{transform:translate3d(-191px,0,0)}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed{text-align:center}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item:not(.o-user-info){cursor:pointer}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item.o-user-info:focus,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-item.o-user-info:hover{color:inherit}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-group:not([disabled=true]) a.o-app-sidenav-viewer-sidenav-item-selected,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-menu-item:not([disabled=true]) a.o-app-sidenav-viewer-sidenav-item-selected{padding:0 8px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed nav{width:48px;min-width:48px;margin-left:auto}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-image .o-app-sidenav-image-container{padding:0;text-align:end;max-height:36px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav.mat-drawer-closed .o-app-sidenav-image .o-app-sidenav-image-container .o-app-sidenav-image{max-height:36px;margin-right:8px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container{padding-bottom:16px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .sidenav-toggle-container{height:48px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container nav a{border-radius:0;box-sizing:border-box;display:block;line-height:48px;height:auto;font-size:14px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container nav a>.mat-icon{vertical-align:middle;height:24px;width:24px;font-size:24px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container ul{list-style-type:none;margin:0;padding:0}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container ul li{margin:0;padding:0}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .sidenav-toggle{padding:4px 12px 8px;cursor:pointer}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a{font-size:14px;line-height:48px;height:48px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{font-size:12px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a .mat-mdc-button-touch-target,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-1 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a .mat-mdc-button-touch-target{height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a{font-size:12px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a .mat-mdc-button-touch-target{height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a{font-size:11px;line-height:40px;height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a .mat-mdc-button-touch-target,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a .mat-mdc-button-touch-target{height:40px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-group a .mat-icon,.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menu-group-level-2 a+.o-app-sidenav-menugroup-items-container .o-app-sidenav-menu-item a .mat-icon{font-size:20px;height:20px;width:20px}.o-app-sidenav .o-app-sidenav-container .mat-drawer.o-app-sidenav-sidenav .mat-drawer-inner-container .o-app-sidenav-menugroup-arrow{display:flex}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.Router }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i2$2.MediaObserver }]; }, propDecorators: { sidenav: [{
                 type: ViewChild,
                 args: [MatSidenav]
@@ -37583,14 +37624,15 @@ class OFormLayoutDialogOptionsDirective {
             closeOnNavigation: this._closeOnNavigation,
             title: this.title,
             labelColumns: this.labelColumns,
-            separator: this.separator
+            separator: this.separator,
+            dialogTitleSeparator: this.dialogTitleSeparator
         };
         Object.keys(result).forEach(key => result[key] == null ? delete result[key] : {});
         return result;
     }
 }
 OFormLayoutDialogOptionsDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutDialogOptionsDirective, deps: [{ token: OFormLayoutManagerComponent }], target: i0.ɵɵFactoryTarget.Directive });
-OFormLayoutDialogOptionsDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: OFormLayoutDialogOptionsDirective, selector: "o-form-layout-dialog-options, o-form-layout-manager[mode=\"dialog\"]", inputs: { width: "width", minWidth: ["min-width", "minWidth"], maxWidth: ["max-width", "maxWidth"], height: "height", minHeight: ["min-height", "minHeight"], maxHeight: ["max-height", "maxHeight"], class: "class", position: "position", backdropClass: ["backdrop-class", "backdropClass"], closeOnNavigation: ["close-on-navigation", "closeOnNavigation"], disableClose: ["disable-close", "disableClose"], title: "title", labelColumns: ["label-columns", "labelColumns"], separator: "separator" }, usesOnChanges: true, ngImport: i0 });
+OFormLayoutDialogOptionsDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: OFormLayoutDialogOptionsDirective, selector: "o-form-layout-dialog-options, o-form-layout-manager[mode=\"dialog\"]", inputs: { width: "width", minWidth: ["min-width", "minWidth"], maxWidth: ["max-width", "maxWidth"], height: "height", minHeight: ["min-height", "minHeight"], maxHeight: ["max-height", "maxHeight"], class: "class", position: "position", backdropClass: ["backdrop-class", "backdropClass"], closeOnNavigation: ["close-on-navigation", "closeOnNavigation"], disableClose: ["disable-close", "disableClose"], title: "title", labelColumns: ["label-columns", "labelColumns"], separator: "separator", dialogTitleSeparator: ["dialog-title-separator", "dialogTitleSeparator"] }, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OFormLayoutDialogOptionsDirective, decorators: [{
             type: Directive,
             args: [{
@@ -37632,6 +37674,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                 args: ['label-columns']
             }], separator: [{
                 type: Input
+            }], dialogTitleSeparator: [{
+                type: Input,
+                args: ['dialog-title-separator']
             }] } });
 
 class OFormLayoutSplitPaneOptionsDirective {
@@ -38099,5 +38144,5 @@ function ontimizePostBootstrap(ngModuleRef) {
 class ODialogConfig {
 }
 
-export { APP_CONFIG, AbstractComponentStateClass, AbstractComponentStateService, AbstractOServiceBaseComponent, AbstractOServiceComponent, AbstractServiceComponentStateClass, AppConfig, AppConfigFactory, AppMenuService, AppearanceService, AuthGuardService, AuthService, Base64, BaseService, BaseServiceResponse, BooleanConverter, BooleanInputConverter, CKEditorComponent, CKEditorModule, CanActivateFormLayoutChildGuard, CanDeactivateFormGuard, Codes, ColumnValueFilterOperator, ColumnsFilterPipe, ComponentStateServiceProvider, CurrencyService, DEFAULT_CONTEXT_MENU_CONTENT_INPUTS, DEFAULT_CONTEXT_MENU_CONTENT_ITEM_INPUTS, DEFAULT_CONTEXT_MENU_CONTENT_OUTPUTS, DEFAULT_CONTEXT_MENU_DIRECTIVE_INPUTS, DEFAULT_CONTEXT_MENU_ITEM_INPUTS, DEFAULT_CONTEXT_MENU_ITEM_OUTPUTS, DEFAULT_DUAL_LIST_SELECTOR, DEFAULT_DUAL_LIST_SELECTOR_DATE_ITEM, DEFAULT_INPUTS_O_APP_HEADER, DEFAULT_INPUTS_O_APP_LAYOUT, DEFAULT_INPUTS_O_APP_LAYOUT_HEADER, DEFAULT_INPUTS_O_APP_LAYOUT_SIDENAV, DEFAULT_INPUTS_O_APP_SIDENAV, DEFAULT_INPUTS_O_APP_SIDENAV_IMAGE, DEFAULT_INPUTS_O_APP_SIDENAV_MENU_GROUP, DEFAULT_INPUTS_O_APP_SIDENAV_MENU_ITEM, DEFAULT_INPUTS_O_BAR_MENU, DEFAULT_INPUTS_O_BAR_MENU_ITEM, DEFAULT_INPUTS_O_BAR_MENU_NESTED, DEFAULT_INPUTS_O_BASE_MENU_ITEM, DEFAULT_INPUTS_O_BASE_TABLE_CELL_RENDERER, DEFAULT_INPUTS_O_BREADCRUMB, DEFAULT_INPUTS_O_BUTTON, DEFAULT_INPUTS_O_BUTTON_TOGGLE, DEFAULT_INPUTS_O_BUTTON_TOGGLE_GROUP, DEFAULT_INPUTS_O_CARD_RENDERER, DEFAULT_INPUTS_O_CHECKBOX, DEFAULT_INPUTS_O_COMBO, DEFAULT_INPUTS_O_COMBO_RENDERER, DEFAULT_INPUTS_O_COMBO_RENDERER_BOOLEAN, DEFAULT_INPUTS_O_COMBO_RENDERER_CURRENCY, DEFAULT_INPUTS_O_COMBO_RENDERER_DATE, DEFAULT_INPUTS_O_COMBO_RENDERER_ICON, DEFAULT_INPUTS_O_COMBO_RENDERER_INTEGER, DEFAULT_INPUTS_O_COMBO_RENDERER_PERCENTAGE, DEFAULT_INPUTS_O_COMBO_RENDERER_REAL, DEFAULT_INPUTS_O_CONTAINER, DEFAULT_INPUTS_O_CONTAINER_COLLAPSIBLE, DEFAULT_INPUTS_O_CONTEXT_MENU_ITEMS, DEFAULT_INPUTS_O_CURRENCY_INPUT, DEFAULT_INPUTS_O_DATA_TOOLBAR, DEFAULT_INPUTS_O_DATERANGE_INPUT, DEFAULT_INPUTS_O_DATE_INPUT, DEFAULT_INPUTS_O_ERROR, DEFAULT_INPUTS_O_FILE_INPUT, DEFAULT_INPUTS_O_FILTER_BUILDER, DEFAULT_INPUTS_O_FILTER_BUILDER_MENU, DEFAULT_INPUTS_O_FORM, DEFAULT_INPUTS_O_FORM_CONTAINER, DEFAULT_INPUTS_O_FORM_DATA_COMPONENT, DEFAULT_INPUTS_O_FORM_LAYOUT_MANAGER, DEFAULT_INPUTS_O_FORM_LAYOUT_SPLIT_PANE, DEFAULT_INPUTS_O_FORM_LAYOUT_TABGROUP, DEFAULT_INPUTS_O_FORM_SERVICE_COMPONENT, DEFAULT_INPUTS_O_FORM_TOOLBAR, DEFAULT_INPUTS_O_GRID, DEFAULT_INPUTS_O_GRID_ITEM, DEFAULT_INPUTS_O_HOUR_INPUT, DEFAULT_INPUTS_O_HTML_INPUT, DEFAULT_INPUTS_O_IMAGE, DEFAULT_INPUTS_O_INTEGER_INPUT, DEFAULT_INPUTS_O_LANGUAGE_SELECTOR, DEFAULT_INPUTS_O_LIST, DEFAULT_INPUTS_O_LISTPICKER_RENDERER, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_CURRENCY, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_DATE, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_INTEGER, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_PERCENTAGE, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_REAL, DEFAULT_INPUTS_O_LIST_ITEM_AVATAR, DEFAULT_INPUTS_O_LIST_ITEM_CARD_IMAGE, DEFAULT_INPUTS_O_LIST_ITEM_TEXT, DEFAULT_INPUTS_O_LIST_PICKER, DEFAULT_INPUTS_O_LIST_PICKER_DIALOG, DEFAULT_INPUTS_O_LOCALE_BAR_MENU_ITEM, DEFAULT_INPUTS_O_LOCKER, DEFAULT_INPUTS_O_MENU_CARD, DEFAULT_INPUTS_O_MENU_LAYOUT, DEFAULT_INPUTS_O_PASSWORD_INPUT, DEFAULT_INPUTS_O_PERCENT_INPUT, DEFAULT_INPUTS_O_PHONE_INPUT, DEFAULT_INPUTS_O_RADIO, DEFAULT_INPUTS_O_REAL_INPUT, DEFAULT_INPUTS_O_SEARCH_INPUT, DEFAULT_INPUTS_O_SERVICE_BASE_COMPONENT, DEFAULT_INPUTS_O_SERVICE_COMPONENT, DEFAULT_INPUTS_O_SLIDER_INPUT, DEFAULT_INPUTS_O_SLIDETOGGLE, DEFAULT_INPUTS_O_TABLE, DEFAULT_INPUTS_O_TABLE_BUTTON, DEFAULT_INPUTS_O_TABLE_BUTTONS, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR_BOOLEAN, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR_DATE, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR_INTEGER, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR_TIME, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_ACTION, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_BOOLEAN, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_CURRENCY, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_DATE, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_IMAGE, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_INTEGER, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_PERCENTAGE, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_REAL, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_SERVICE, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_TIME, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_TRANSLATE, DEFAULT_INPUTS_O_TABLE_COLUMN, DEFAULT_INPUTS_O_TABLE_COLUMN_CALCULATED, DEFAULT_INPUTS_O_TABLE_COLUMN_FILTER, DEFAULT_INPUTS_O_TABLE_COLUMN_FILTER_COLUMN, DEFAULT_INPUTS_O_TABLE_COLUMN_GROUPING, DEFAULT_INPUTS_O_TABLE_COLUMN_GROUPING_COLUMN, DEFAULT_INPUTS_O_TABLE_COLUMN_RESIZER, DEFAULT_INPUTS_O_TABLE_COLUMN_SELECTALL, DEFAULT_INPUTS_O_TABLE_EXPORT_BUTTON, DEFAULT_INPUTS_O_TABLE_HEADER, DEFAULT_INPUTS_O_TABLE_INSERTABLE_ROW, DEFAULT_INPUTS_O_TABLE_MENU, DEFAULT_INPUTS_O_TABLE_OPTION, DEFAULT_INPUTS_O_TABLE_QUICKFILTER, DEFAULT_INPUTS_O_TABLE_ROW_EXPANDABLE, DEFAULT_INPUTS_O_TEXTAREA_INPUT, DEFAULT_INPUTS_O_TEXT_INPUT, DEFAULT_INPUTS_O_TEXT_RENDERER, DEFAULT_INPUTS_O_TIME_INPUT, DEFAULT_INPUTS_O_USER_INFO, DEFAULT_INPUTS_O_VALIDATOR, DEFAULT_INPUT_O_EXPANDABLE_CONTAINER, DEFAULT_OUTPUTS_LANGUAGE_SELECTOR, DEFAULT_OUTPUTS_O_APP_HEADER, DEFAULT_OUTPUTS_O_APP_LAYOUT, DEFAULT_OUTPUTS_O_APP_SIDENAV, DEFAULT_OUTPUTS_O_APP_SIDENAV_IMAGE, DEFAULT_OUTPUTS_O_APP_SIDENAV_MENU_GROUP, DEFAULT_OUTPUTS_O_APP_SIDENAV_MENU_ITEM, DEFAULT_OUTPUTS_O_BUTTON, DEFAULT_OUTPUTS_O_BUTTON_TOGGLE, DEFAULT_OUTPUTS_O_BUTTON_TOGGLE_GROUP, DEFAULT_OUTPUTS_O_CARD_RENDERER, DEFAULT_OUTPUTS_O_CONTAINER_COLLAPSIBLE, DEFAULT_OUTPUTS_O_CONTEXT_MENU, DEFAULT_OUTPUTS_O_DATERANGE_INPUT, DEFAULT_OUTPUTS_O_FILE_INPUT, DEFAULT_OUTPUTS_O_FILTER_BUILDER, DEFAULT_OUTPUTS_O_FORM, DEFAULT_OUTPUTS_O_FORM_DATA_COMPONENT, DEFAULT_OUTPUTS_O_FORM_LAYOUT_MANAGER, DEFAULT_OUTPUTS_O_FORM_LAYOUT_SPLIT_PANE, DEFAULT_OUTPUTS_O_FORM_LAYOUT_TABGROUP, DEFAULT_OUTPUTS_O_FORM_SERVICE_COMPONENT, DEFAULT_OUTPUTS_O_FORM_TOOLBAR, DEFAULT_OUTPUTS_O_HTML_INPUT, DEFAULT_OUTPUTS_O_LIST, DEFAULT_OUTPUTS_O_LIST_ITEM_CARD_IMAGE, DEFAULT_OUTPUTS_O_LIST_PICKER, DEFAULT_OUTPUTS_O_MENU_CARD, DEFAULT_OUTPUTS_O_MENU_LAYOUT, DEFAULT_OUTPUTS_O_PERCENT_INPUT, DEFAULT_OUTPUTS_O_SEARCH_INPUT, DEFAULT_OUTPUTS_O_SERVICE_COMPONENT, DEFAULT_OUTPUTS_O_TABLE, DEFAULT_OUTPUTS_O_TABLE_BUTTON, DEFAULT_OUTPUTS_O_TABLE_BUTTONS, DEFAULT_OUTPUTS_O_TABLE_CELL_EDITOR, DEFAULT_OUTPUTS_O_TABLE_CELL_RENDERER_ACTION, DEFAULT_OUTPUTS_O_TABLE_CELL_RENDERER_IMAGE, DEFAULT_OUTPUTS_O_TABLE_CELL_RENDERER_SERVICE, DEFAULT_OUTPUTS_O_TABLE_COLUMN, DEFAULT_OUTPUTS_O_TABLE_COLUMN_FILTER, DEFAULT_OUTPUTS_O_TABLE_COLUMN_GROUPING, DEFAULT_OUTPUTS_O_TABLE_COLUMN_RESIZER, DEFAULT_OUTPUTS_O_TABLE_EXPORT_BUTTON, DEFAULT_OUTPUTS_O_TABLE_INSERTABLE_ROW, DEFAULT_OUTPUTS_O_TABLE_MENU, DEFAULT_OUTPUTS_O_TABLE_OPTION, DEFAULT_OUTPUTS_O_TABLE_QUICKFILTER, DEFAULT_OUTPUTS_O_TABLE_ROW_EXPANDABLE, DEFAULT_OUTPUTS_O_TEXT_RENDERER, DEFAULT_OUTPUTS_O_USER_INFO, DEFAULT_PAGINATOR_TABLE, DEFAULT_TABLE_COLUMN_AGGREGATE, DEFAULT_TABLE_CONTEXT_MENU_INPUTS, DaterangepickerComponent, DefaultComponentStateClass, DefaultComponentStateService, DefaultOServiceBaseComponent, DefaultOTableDataSource, DefaultOTableOptions, DefaultServiceComponentStateClass, DefaultServiceComponentStateService, DialogService, Error403Component, ExportDataServiceProvider, FilterExpressionUtils, IconService, ListItem, LocalStorageService, LoginStorageService, MomentService, NavigationService, NumberConverter, NumberInputConverter, NumberService, OAppHeaderComponent, OAppHeaderModule, OAppLayoutComponent, OAppLayoutHeaderComponent, OAppLayoutModule, OAppLayoutSidenavComponent, OAppSidenavComponent, OAppSidenavImageComponent, OAppSidenavMenuGroupComponent, OAppSidenavMenuItemComponent, OAppSidenavModule, OBarMenuComponent, OBarMenuGroupComponent, OBarMenuItemComponent, OBarMenuModule, OBarMenuNestedComponent, OBarMenuSeparatorComponent, OBaseComponent, OBaseMenuItemClass, OBaseTableCellEditor, OBaseTableCellRenderer, OBaseTablePaginator, OBreadcrumbComponent, OBreadcrumbModule, OBreadcrumbService, OButtonComponent, OButtonModule, OButtonToggleComponent, OButtonToggleGroupComponent, OButtonToggleModule, OCardMenuItemComponent, OCardMenuItemModule, OCardMenuLayoutComponent, OCardMenuLayoutModule, OCheckboxComponent, OCheckboxModule, OColumn, OColumnCollapsibleComponent, OColumnCollapsibleModule, OColumnComponent, OColumnModule, OComboComponent, OComboCustomRenderer, OComboModule, OComboRendererBooleanComponent, OComboRendererCurrencyComponent, OComboRendererDateComponent, OComboRendererIconComponent, OComboRendererIntegerComponent, OComboRendererPercentageComponent, OComboRendererRealComponent, OComboSearchComponent, OComponentMenuBaseItem, OContainerCollapsibleComponent, OContainerComponent, OContextMenuComponent, OContextMenuContentComponent, OContextMenuDirective, OContextMenuGroupComponent, OContextMenuItemComponent, OContextMenuModule, OContextMenuSeparatorComponent, OContextMenuService, OCurrencyInputComponent, OCurrencyInputModule, OCurrencyPipe, OCustomMaterialModule, ODataToolbarComponent, ODataToolbarModule, ODateInputComponent, ODateInputModule, ODateRangeInputComponent, ODateRangeInputModule, ODaterangepickerDirective, ODialogComponent, ODialogConfig, ODualListSelectorComponent, ODualListSelectorDateItemComponent, ODualListSelectorModule, OEmailInputComponent, OEmailInputModule, OErrorComponent, OErrorDialogManager, OExpandableContainerComponent, OExpandableContainerModule, OFileDragAndDropDirective, OFileInputComponent, OFileInputModule, OFileItem, OFileUploader, OFilterBuilderClearDirective, OFilterBuilderComponent, OFilterBuilderMenuComponent, OFilterBuilderModule, OFilterBuilderQueryDirective, OFormCacheClass, OFormComponent, OFormContainerComponent, OFormContainerModule, OFormControl, OFormDataComponent, OFormLayoutDialogComponent, OFormLayoutDialogOptionsDirective, OFormLayoutManagerComponent, OFormLayoutManagerComponentStateClass, OFormLayoutManagerComponentStateService, OFormLayoutManagerContentDirective, OFormLayoutManagerModule, OFormLayoutManagerService, OFormLayoutSplitPaneComponent, OFormLayoutSplitPaneOptionsDirective, OFormLayoutTabGroupComponent, OFormLayoutTabGroupOptionsDirective, OFormMessageService, OFormModule, OFormNavigationClass, OFormNavigationComponent, OFormServiceComponent, OFormToolbarComponent, OFormToolbarModule, OFormValue, OFullScreenDialogComponent, OGridComponent, OGridComponentStateClass, OGridComponentStateService, OGridItemComponent, OGridItemDirective, OGridModule, OHTMLInputComponent, OHTMLInputModule, OHiddenDirective, OHourInputComponent, OHourInputModule, OIconPipe, OImageComponent, OImageModule, OIntegerInputComponent, OIntegerInputModule, OIntegerPipe, OKeyboardListenerDirective, OLanguageSelectorComponent, OLanguageSelectorModule, OListComponent, OListComponentStateClass, OListComponentStateService, OListItemAvatarComponent, OListItemCardComponent, OListItemCardImageComponent, OListItemCardRenderer, OListItemComponent, OListItemDirective, OListItemTextComponent, OListItemTextRenderer, OListModule, OListPickerComponent, OListPickerCustomRenderer, OListPickerDialogComponent, OListPickerModule, OListPickerRendererCurrencyComponent, OListPickerRendererDateComponent, OListPickerRendererIntegerComponent, OListPickerRendererPercentageComponent, OListPickerRendererRealComponent, OLoadFilterDialogComponent, OLocaleBarMenuItemComponent, OLockerDirective, OMatErrorDirective, OMatPrefix, OMatSort, OMatSortHeader, OMatSortModule, OMatSuffix, OModulesInfoService, OMomentPipe, ONIFInputComponent, ONIFInputModule, ONTIMIZE_MODULES, ONTIMIZE_PROVIDERS, ONavigationItem, OPasswordInputComponent, OPasswordInputModule, OPercentInputComponent, OPercentInputModule, OPercentPipe, OPermissionsModule, OPhoneInputComponent, OPhoneInputModule, ORadioComponent, ORadioModule, ORealInputComponent, ORealInputModule, ORealPipe, ORemoteConfigurationService, ORowCollapsibleComponent, ORowCollapsibleModule, ORowComponent, ORowModule, OSafePipe, OSearchInputComponent, OSearchInputModule, OServiceBaseComponent, OServiceComponent, OSharedModule, OSlideToggleComponent, OSlideToggleModule, OSliderComponent, OSliderModule, OSnackBarComponent, OSnackBarConfig, OStoreFilterDialogComponent, OTabGroupDirective, OTableApplyConfigurationDialogComponent, OTableBase, OTableBaseDialogClass, OTableButtonComponent, OTableButtonsComponent, OTableCellEditorBooleanComponent, OTableCellEditorDateComponent, OTableCellEditorEmailComponent, OTableCellEditorIntegerComponent, OTableCellEditorRealComponent, OTableCellEditorTextComponent, OTableCellEditorTimeComponent, OTableCellRendererActionComponent, OTableCellRendererBooleanComponent, OTableCellRendererCurrencyComponent, OTableCellRendererDateComponent, OTableCellRendererImageComponent, OTableCellRendererIntegerComponent, OTableCellRendererPercentageComponent, OTableCellRendererRealComponent, OTableCellRendererServiceComponent, OTableCellRendererTimeComponent, OTableCellRendererTranslateComponent, OTableColumnAggregateComponent, OTableColumnCalculatedComponent, OTableColumnComponent, OTableColumnResizerComponent, OTableColumnSelectAllDirective, OTableColumnsFilterColumnComponent, OTableColumnsFilterComponent, OTableColumnsGroupingColumnComponent, OTableColumnsGroupingComponent, OTableComponent, OTableComponentStateClass, OTableComponentStateService, OTableContextMenuComponent, OTableDao, OTableDataSourceService, OTableExpandedFooterDirective, OTableExportButtonComponent, OTableExportButtonService, OTableExportConfiguration, OTableExportDialogComponent, OTableFilterByColumnDataDialogComponent, OTableGroupByColumnsDialogComponent, OTableGroupedRow, OTableHeaderComponent, OTableHeaderSelectAllComponent, OTableInsertableRowComponent, OTableMatPaginatorIntl, OTableMenuComponent, OTableModule, OTableOptionComponent, OTablePaginatorComponent, OTableQuickfilterComponent, OTableRowClassPipe, OTableRowDirective, OTableRowExpandableComponent, OTableRowExpandedChange, OTableStoreConfigurationDialogComponent, OTableVirtualScrollStrategy, OTableVisibleColumnsDialogComponent, OTextInputComponent, OTextInputModule, OTextareaInputComponent, OTextareaInputModule, OTimeInputComponent, OTimeInputModule, OTranslateHttpLoader, OTranslateModule, OTranslateParser, OTranslatePipe, OTranslateService, OUserInfoComponent, OUserInfoModule, OUserInfoService, OValidatorComponent, OValidators, OValueChangeEvent, OWrapperContentMenuComponent, O_AUTH_SERVICE, O_CHART_ON_DEMAND_SERVICE, O_COMPONENT_STATE_SERVICE, O_DATA_SERVICE, O_ERROR_DIALOG_MANAGER, O_EXPORT_DATA_SERVICE, O_EXPORT_SERVICE, O_FILE_SERVICE, O_FORM_MESSAGE_SERVICE, O_INPUTS_OPTIONS, O_MAT_ERROR_OPTIONS, O_PERMISSION_SERVICE, O_REPORT_SERVICE, O_TABLE_CELL_EDITORS, O_TABLE_CELL_EDITORS_INPUTS, O_TABLE_CELL_EDITORS_OUTPUTS, O_TABLE_CELL_RENDERERS, O_TABLE_CELL_RENDERERS_INPUTS, O_TABLE_CELL_RENDERERS_OUTPUTS, O_TABLE_GLOBAL_CONFIG, O_TRANSLATE_SERVICE, ObservableWrapper, OnRangeChangeVirtualScroll, OntimizeAuthService, OntimizeAuthServiceProvider, OntimizeBaseService, OntimizeEEPermissionsService, OntimizeEEService, OntimizeExportDataProviderService, OntimizeExportDataProviderService3X, OntimizeExportService, OntimizeExportService3X, OntimizeExportServiceProvider, OntimizeFileService, OntimizeMatDateFormats, OntimizeMatIconRegistry, OntimizeMomentDateAdapter, OntimizePermissionsService, OntimizeService, OntimizeServiceProvider, OntimizeServiceResponse, OntimizeServiceResponseAdapter, OntimizeServiceResponseParser, OntimizeWebModule, OntimizeWebTranslateModule, OrderByPipe, PermissionsGuardService, PermissionsService, PermissionsUtils, SQLTypes, ServiceUtils, ShareCanActivateChildService, SideEnum, SnackBarService, StringConverter, TWELVE_HOUR_FORMAT_PATTERN, TWENTY_FOUR_HOUR_FORMAT_PATTERN, TableFilterByColumnDialogResult, Util, _getInjectionTokenValue, appConfigFactory, authServiceFactory, componentStateFactory, dataServiceFactory, dateFormatFactory, editorsMapping, exportDataFactory, exportServiceFactory, fileServiceFactory, getPermissionsServiceProvider, noop, ontimizePostBootstrap, permissionsServiceFactory, renderersMapping, translateServiceFactory };
+export { APP_CONFIG, AbstractComponentStateClass, AbstractComponentStateService, AbstractOServiceBaseComponent, AbstractOServiceComponent, AbstractServiceComponentStateClass, AppConfig, AppConfigFactory, AppMenuService, AppearanceService, AuthGuardService, AuthService, Base64, BaseService, BaseServiceResponse, BooleanConverter, BooleanInputConverter, CKEditorComponent, CKEditorModule, CanActivateFormLayoutChildGuard, CanDeactivateFormGuard, Codes, ColumnValueFilterOperator, ColumnsFilterPipe, ComponentStateServiceProvider, CurrencyService, DEFAULT_CONTEXT_MENU_CONTENT_INPUTS, DEFAULT_CONTEXT_MENU_CONTENT_ITEM_INPUTS, DEFAULT_CONTEXT_MENU_CONTENT_OUTPUTS, DEFAULT_CONTEXT_MENU_DIRECTIVE_INPUTS, DEFAULT_CONTEXT_MENU_ITEM_INPUTS, DEFAULT_CONTEXT_MENU_ITEM_OUTPUTS, DEFAULT_DUAL_LIST_SELECTOR, DEFAULT_DUAL_LIST_SELECTOR_DATE_ITEM, DEFAULT_INPUTS_O_APP_HEADER, DEFAULT_INPUTS_O_APP_LAYOUT, DEFAULT_INPUTS_O_APP_LAYOUT_HEADER, DEFAULT_INPUTS_O_APP_LAYOUT_SIDENAV, DEFAULT_INPUTS_O_APP_SIDENAV, DEFAULT_INPUTS_O_APP_SIDENAV_IMAGE, DEFAULT_INPUTS_O_APP_SIDENAV_MENU_GROUP, DEFAULT_INPUTS_O_APP_SIDENAV_MENU_ITEM, DEFAULT_INPUTS_O_BAR_MENU, DEFAULT_INPUTS_O_BAR_MENU_ITEM, DEFAULT_INPUTS_O_BAR_MENU_NESTED, DEFAULT_INPUTS_O_BASE_MENU_ITEM, DEFAULT_INPUTS_O_BASE_TABLE_CELL_RENDERER, DEFAULT_INPUTS_O_BREADCRUMB, DEFAULT_INPUTS_O_BUTTON, DEFAULT_INPUTS_O_BUTTON_TOGGLE, DEFAULT_INPUTS_O_BUTTON_TOGGLE_GROUP, DEFAULT_INPUTS_O_CARD_RENDERER, DEFAULT_INPUTS_O_CHECKBOX, DEFAULT_INPUTS_O_COMBO, DEFAULT_INPUTS_O_COMBO_RENDERER, DEFAULT_INPUTS_O_COMBO_RENDERER_BOOLEAN, DEFAULT_INPUTS_O_COMBO_RENDERER_CURRENCY, DEFAULT_INPUTS_O_COMBO_RENDERER_DATE, DEFAULT_INPUTS_O_COMBO_RENDERER_ICON, DEFAULT_INPUTS_O_COMBO_RENDERER_INTEGER, DEFAULT_INPUTS_O_COMBO_RENDERER_PERCENTAGE, DEFAULT_INPUTS_O_COMBO_RENDERER_REAL, DEFAULT_INPUTS_O_CONTAINER, DEFAULT_INPUTS_O_CONTAINER_COLLAPSIBLE, DEFAULT_INPUTS_O_CONTEXT_MENU_ITEMS, DEFAULT_INPUTS_O_CURRENCY_INPUT, DEFAULT_INPUTS_O_DATA_TOOLBAR, DEFAULT_INPUTS_O_DATERANGE_INPUT, DEFAULT_INPUTS_O_DATE_INPUT, DEFAULT_INPUTS_O_ERROR, DEFAULT_INPUTS_O_FILE_INPUT, DEFAULT_INPUTS_O_FILTER_BUILDER, DEFAULT_INPUTS_O_FILTER_BUILDER_MENU, DEFAULT_INPUTS_O_FORM, DEFAULT_INPUTS_O_FORM_CONTAINER, DEFAULT_INPUTS_O_FORM_DATA_COMPONENT, DEFAULT_INPUTS_O_FORM_LAYOUT_MANAGER, DEFAULT_INPUTS_O_FORM_LAYOUT_SPLIT_PANE, DEFAULT_INPUTS_O_FORM_LAYOUT_TABGROUP, DEFAULT_INPUTS_O_FORM_SERVICE_COMPONENT, DEFAULT_INPUTS_O_FORM_TOOLBAR, DEFAULT_INPUTS_O_GRID, DEFAULT_INPUTS_O_GRID_ITEM, DEFAULT_INPUTS_O_HOUR_INPUT, DEFAULT_INPUTS_O_HTML_INPUT, DEFAULT_INPUTS_O_IMAGE, DEFAULT_INPUTS_O_INTEGER_INPUT, DEFAULT_INPUTS_O_LANGUAGE_SELECTOR, DEFAULT_INPUTS_O_LIST, DEFAULT_INPUTS_O_LISTPICKER_RENDERER, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_CURRENCY, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_DATE, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_INTEGER, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_PERCENTAGE, DEFAULT_INPUTS_O_LISTPICKER_RENDERER_REAL, DEFAULT_INPUTS_O_LIST_ITEM_AVATAR, DEFAULT_INPUTS_O_LIST_ITEM_CARD_IMAGE, DEFAULT_INPUTS_O_LIST_ITEM_TEXT, DEFAULT_INPUTS_O_LIST_PICKER, DEFAULT_INPUTS_O_LIST_PICKER_DIALOG, DEFAULT_INPUTS_O_LOCALE_BAR_MENU_ITEM, DEFAULT_INPUTS_O_LOCKER, DEFAULT_INPUTS_O_MENU_CARD, DEFAULT_INPUTS_O_MENU_LAYOUT, DEFAULT_INPUTS_O_PASSWORD_INPUT, DEFAULT_INPUTS_O_PERCENT_INPUT, DEFAULT_INPUTS_O_PHONE_INPUT, DEFAULT_INPUTS_O_RADIO, DEFAULT_INPUTS_O_REAL_INPUT, DEFAULT_INPUTS_O_SEARCH_INPUT, DEFAULT_INPUTS_O_SERVICE_BASE_COMPONENT, DEFAULT_INPUTS_O_SERVICE_COMPONENT, DEFAULT_INPUTS_O_SLIDER_INPUT, DEFAULT_INPUTS_O_SLIDETOGGLE, DEFAULT_INPUTS_O_TABLE, DEFAULT_INPUTS_O_TABLE_BUTTON, DEFAULT_INPUTS_O_TABLE_BUTTONS, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR_BOOLEAN, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR_DATE, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR_INTEGER, DEFAULT_INPUTS_O_TABLE_CELL_EDITOR_TIME, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_ACTION, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_BOOLEAN, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_CURRENCY, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_DATE, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_IMAGE, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_INTEGER, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_PERCENTAGE, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_REAL, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_SERVICE, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_TIME, DEFAULT_INPUTS_O_TABLE_CELL_RENDERER_TRANSLATE, DEFAULT_INPUTS_O_TABLE_COLUMN, DEFAULT_INPUTS_O_TABLE_COLUMN_CALCULATED, DEFAULT_INPUTS_O_TABLE_COLUMN_FILTER, DEFAULT_INPUTS_O_TABLE_COLUMN_FILTER_COLUMN, DEFAULT_INPUTS_O_TABLE_COLUMN_GROUPING, DEFAULT_INPUTS_O_TABLE_COLUMN_GROUPING_COLUMN, DEFAULT_INPUTS_O_TABLE_COLUMN_RESIZER, DEFAULT_INPUTS_O_TABLE_COLUMN_SELECTALL, DEFAULT_INPUTS_O_TABLE_EXPORT_BUTTON, DEFAULT_INPUTS_O_TABLE_HEADER, DEFAULT_INPUTS_O_TABLE_INSERTABLE_ROW, DEFAULT_INPUTS_O_TABLE_MENU, DEFAULT_INPUTS_O_TABLE_OPTION, DEFAULT_INPUTS_O_TABLE_QUICKFILTER, DEFAULT_INPUTS_O_TABLE_ROW_EXPANDABLE, DEFAULT_INPUTS_O_TEXTAREA_INPUT, DEFAULT_INPUTS_O_TEXT_INPUT, DEFAULT_INPUTS_O_TEXT_RENDERER, DEFAULT_INPUTS_O_TIME_INPUT, DEFAULT_INPUTS_O_USER_INFO, DEFAULT_INPUTS_O_USER_INFO_MENU, DEFAULT_INPUTS_O_USER_INFO_MENU_ITEM, DEFAULT_INPUTS_O_VALIDATOR, DEFAULT_INPUT_O_EXPANDABLE_CONTAINER, DEFAULT_OUTPUTS_LANGUAGE_SELECTOR, DEFAULT_OUTPUTS_O_APP_HEADER, DEFAULT_OUTPUTS_O_APP_LAYOUT, DEFAULT_OUTPUTS_O_APP_SIDENAV, DEFAULT_OUTPUTS_O_APP_SIDENAV_IMAGE, DEFAULT_OUTPUTS_O_APP_SIDENAV_MENU_GROUP, DEFAULT_OUTPUTS_O_APP_SIDENAV_MENU_ITEM, DEFAULT_OUTPUTS_O_BUTTON, DEFAULT_OUTPUTS_O_BUTTON_TOGGLE, DEFAULT_OUTPUTS_O_BUTTON_TOGGLE_GROUP, DEFAULT_OUTPUTS_O_CARD_RENDERER, DEFAULT_OUTPUTS_O_CONTAINER_COLLAPSIBLE, DEFAULT_OUTPUTS_O_CONTEXT_MENU, DEFAULT_OUTPUTS_O_DATERANGE_INPUT, DEFAULT_OUTPUTS_O_FILE_INPUT, DEFAULT_OUTPUTS_O_FILTER_BUILDER, DEFAULT_OUTPUTS_O_FORM, DEFAULT_OUTPUTS_O_FORM_DATA_COMPONENT, DEFAULT_OUTPUTS_O_FORM_LAYOUT_MANAGER, DEFAULT_OUTPUTS_O_FORM_LAYOUT_SPLIT_PANE, DEFAULT_OUTPUTS_O_FORM_LAYOUT_TABGROUP, DEFAULT_OUTPUTS_O_FORM_SERVICE_COMPONENT, DEFAULT_OUTPUTS_O_FORM_TOOLBAR, DEFAULT_OUTPUTS_O_HTML_INPUT, DEFAULT_OUTPUTS_O_LIST, DEFAULT_OUTPUTS_O_LIST_ITEM_CARD_IMAGE, DEFAULT_OUTPUTS_O_LIST_PICKER, DEFAULT_OUTPUTS_O_MENU_CARD, DEFAULT_OUTPUTS_O_MENU_LAYOUT, DEFAULT_OUTPUTS_O_PERCENT_INPUT, DEFAULT_OUTPUTS_O_SEARCH_INPUT, DEFAULT_OUTPUTS_O_SERVICE_COMPONENT, DEFAULT_OUTPUTS_O_TABLE, DEFAULT_OUTPUTS_O_TABLE_BUTTON, DEFAULT_OUTPUTS_O_TABLE_BUTTONS, DEFAULT_OUTPUTS_O_TABLE_CELL_EDITOR, DEFAULT_OUTPUTS_O_TABLE_CELL_RENDERER_ACTION, DEFAULT_OUTPUTS_O_TABLE_CELL_RENDERER_IMAGE, DEFAULT_OUTPUTS_O_TABLE_CELL_RENDERER_SERVICE, DEFAULT_OUTPUTS_O_TABLE_COLUMN, DEFAULT_OUTPUTS_O_TABLE_COLUMN_FILTER, DEFAULT_OUTPUTS_O_TABLE_COLUMN_GROUPING, DEFAULT_OUTPUTS_O_TABLE_COLUMN_RESIZER, DEFAULT_OUTPUTS_O_TABLE_EXPORT_BUTTON, DEFAULT_OUTPUTS_O_TABLE_INSERTABLE_ROW, DEFAULT_OUTPUTS_O_TABLE_MENU, DEFAULT_OUTPUTS_O_TABLE_OPTION, DEFAULT_OUTPUTS_O_TABLE_QUICKFILTER, DEFAULT_OUTPUTS_O_TABLE_ROW_EXPANDABLE, DEFAULT_OUTPUTS_O_TEXT_RENDERER, DEFAULT_OUTPUTS_O_USER_INFO, DEFAULT_OUTPUTS_O_USER_INFO_MENU, DEFAULT_PAGINATOR_TABLE, DEFAULT_TABLE_COLUMN_AGGREGATE, DEFAULT_TABLE_CONTEXT_MENU_INPUTS, DaterangepickerComponent, DefaultComponentStateClass, DefaultComponentStateService, DefaultOServiceBaseComponent, DefaultOTableDataSource, DefaultOTableOptions, DefaultServiceComponentStateClass, DefaultServiceComponentStateService, DialogService, Error403Component, ExportDataServiceProvider, FilterExpressionUtils, IconService, ListItem, LocalStorageService, LoginStorageService, MomentService, NavigationService, NumberConverter, NumberInputConverter, NumberService, OAppHeaderComponent, OAppHeaderModule, OAppLayoutComponent, OAppLayoutHeaderComponent, OAppLayoutModule, OAppLayoutSidenavComponent, OAppSidenavComponent, OAppSidenavImageComponent, OAppSidenavMenuGroupComponent, OAppSidenavMenuItemComponent, OAppSidenavModule, OBarMenuComponent, OBarMenuGroupComponent, OBarMenuItemComponent, OBarMenuModule, OBarMenuNestedComponent, OBarMenuSeparatorComponent, OBaseComponent, OBaseMenuItemClass, OBaseTableCellEditor, OBaseTableCellRenderer, OBaseTablePaginator, OBreadcrumbComponent, OBreadcrumbModule, OBreadcrumbService, OButtonComponent, OButtonModule, OButtonToggleComponent, OButtonToggleGroupComponent, OButtonToggleModule, OCardMenuItemComponent, OCardMenuItemModule, OCardMenuLayoutComponent, OCardMenuLayoutModule, OCheckboxComponent, OCheckboxModule, OColumn, OColumnCollapsibleComponent, OColumnCollapsibleModule, OColumnComponent, OColumnModule, OComboComponent, OComboCustomRenderer, OComboModule, OComboRendererBooleanComponent, OComboRendererCurrencyComponent, OComboRendererDateComponent, OComboRendererIconComponent, OComboRendererIntegerComponent, OComboRendererPercentageComponent, OComboRendererRealComponent, OComboSearchComponent, OComponentMenuBaseItem, OContainerCollapsibleComponent, OContainerComponent, OContextMenuComponent, OContextMenuContentComponent, OContextMenuDirective, OContextMenuGroupComponent, OContextMenuItemComponent, OContextMenuModule, OContextMenuSeparatorComponent, OContextMenuService, OCurrencyInputComponent, OCurrencyInputModule, OCurrencyPipe, OCustomMaterialModule, ODataToolbarComponent, ODataToolbarModule, ODateInputComponent, ODateInputModule, ODateRangeInputComponent, ODateRangeInputModule, ODaterangepickerDirective, ODialogComponent, ODialogConfig, ODualListSelectorComponent, ODualListSelectorDateItemComponent, ODualListSelectorModule, OEmailInputComponent, OEmailInputModule, OErrorComponent, OErrorDialogManager, OExpandableContainerComponent, OExpandableContainerModule, OFileDragAndDropDirective, OFileInputComponent, OFileInputModule, OFileItem, OFileUploader, OFilterBuilderClearDirective, OFilterBuilderComponent, OFilterBuilderMenuComponent, OFilterBuilderModule, OFilterBuilderQueryDirective, OFormCacheClass, OFormComponent, OFormContainerComponent, OFormContainerModule, OFormControl, OFormDataComponent, OFormLayoutDialogComponent, OFormLayoutDialogOptionsDirective, OFormLayoutManagerComponent, OFormLayoutManagerComponentStateClass, OFormLayoutManagerComponentStateService, OFormLayoutManagerContentDirective, OFormLayoutManagerModule, OFormLayoutManagerService, OFormLayoutSplitPaneComponent, OFormLayoutSplitPaneOptionsDirective, OFormLayoutTabGroupComponent, OFormLayoutTabGroupOptionsDirective, OFormMessageService, OFormModule, OFormNavigationClass, OFormNavigationComponent, OFormServiceComponent, OFormToolbarComponent, OFormToolbarModule, OFormValue, OFullScreenDialogComponent, OGridComponent, OGridComponentStateClass, OGridComponentStateService, OGridItemComponent, OGridItemDirective, OGridModule, OHTMLInputComponent, OHTMLInputModule, OHiddenDirective, OHourInputComponent, OHourInputModule, OIconPipe, OImageComponent, OImageModule, OIntegerInputComponent, OIntegerInputModule, OIntegerPipe, OKeyboardListenerDirective, OLanguageSelectorComponent, OLanguageSelectorModule, OListComponent, OListComponentStateClass, OListComponentStateService, OListItemAvatarComponent, OListItemCardComponent, OListItemCardImageComponent, OListItemCardRenderer, OListItemComponent, OListItemDirective, OListItemTextComponent, OListItemTextRenderer, OListModule, OListPickerComponent, OListPickerCustomRenderer, OListPickerDialogComponent, OListPickerModule, OListPickerRendererCurrencyComponent, OListPickerRendererDateComponent, OListPickerRendererIntegerComponent, OListPickerRendererPercentageComponent, OListPickerRendererRealComponent, OLoadFilterDialogComponent, OLocaleBarMenuItemComponent, OLockerDirective, OMatErrorDirective, OMatPrefix, OMatSort, OMatSortHeader, OMatSortModule, OMatSuffix, OModulesInfoService, OMomentPipe, ONIFInputComponent, ONIFInputModule, ONTIMIZE_MODULES, ONTIMIZE_PROVIDERS, ONavigationItem, OPasswordInputComponent, OPasswordInputModule, OPercentInputComponent, OPercentInputModule, OPercentPipe, OPermissionsModule, OPhoneInputComponent, OPhoneInputModule, ORadioComponent, ORadioModule, ORealInputComponent, ORealInputModule, ORealPipe, ORemoteConfigurationService, ORowCollapsibleComponent, ORowCollapsibleModule, ORowComponent, ORowModule, OSafePipe, OSearchInputComponent, OSearchInputModule, OServiceBaseComponent, OServiceComponent, OSharedModule, OSlideToggleComponent, OSlideToggleModule, OSliderComponent, OSliderModule, OSnackBarComponent, OSnackBarConfig, OStoreFilterDialogComponent, OTabGroupDirective, OTableApplyConfigurationDialogComponent, OTableBase, OTableBaseDialogClass, OTableButtonComponent, OTableButtonsComponent, OTableCellEditorBooleanComponent, OTableCellEditorDateComponent, OTableCellEditorEmailComponent, OTableCellEditorIntegerComponent, OTableCellEditorRealComponent, OTableCellEditorTextComponent, OTableCellEditorTimeComponent, OTableCellRendererActionComponent, OTableCellRendererBooleanComponent, OTableCellRendererCurrencyComponent, OTableCellRendererDateComponent, OTableCellRendererImageComponent, OTableCellRendererIntegerComponent, OTableCellRendererPercentageComponent, OTableCellRendererRealComponent, OTableCellRendererServiceComponent, OTableCellRendererTimeComponent, OTableCellRendererTranslateComponent, OTableColumnAggregateComponent, OTableColumnCalculatedComponent, OTableColumnComponent, OTableColumnResizerComponent, OTableColumnSelectAllDirective, OTableColumnsFilterColumnComponent, OTableColumnsFilterComponent, OTableColumnsGroupingColumnComponent, OTableColumnsGroupingComponent, OTableComponent, OTableComponentStateClass, OTableComponentStateService, OTableContextMenuComponent, OTableDao, OTableDataSourceService, OTableExpandedFooterDirective, OTableExportButtonComponent, OTableExportButtonService, OTableExportConfiguration, OTableExportDialogComponent, OTableFilterByColumnDataDialogComponent, OTableGroupByColumnsDialogComponent, OTableGroupedRow, OTableHeaderComponent, OTableHeaderSelectAllComponent, OTableInsertableRowComponent, OTableMatPaginatorIntl, OTableMenuComponent, OTableModule, OTableOptionComponent, OTablePaginatorComponent, OTableQuickfilterComponent, OTableRowClassPipe, OTableRowDirective, OTableRowExpandableComponent, OTableRowExpandedChange, OTableStoreConfigurationDialogComponent, OTableVirtualScrollStrategy, OTableVisibleColumnsDialogComponent, OTextInputComponent, OTextInputModule, OTextareaInputComponent, OTextareaInputModule, OTimeInputComponent, OTimeInputModule, OTranslateHttpLoader, OTranslateModule, OTranslateParser, OTranslatePipe, OTranslateService, OUserInfoComponent, OUserInfoConfigurationDirective, OUserInfoConfigurationItemDirective, OUserInfoModule, OUserInfoService, OValidatorComponent, OValidators, OValueChangeEvent, OWrapperContentMenuComponent, O_AUTH_SERVICE, O_CHART_ON_DEMAND_SERVICE, O_COMPONENT_STATE_SERVICE, O_DATA_SERVICE, O_ERROR_DIALOG_MANAGER, O_EXPORT_DATA_SERVICE, O_EXPORT_SERVICE, O_FILE_SERVICE, O_FORM_MESSAGE_SERVICE, O_INPUTS_OPTIONS, O_MAT_ERROR_OPTIONS, O_PERMISSION_SERVICE, O_REPORT_SERVICE, O_TABLE_CELL_EDITORS, O_TABLE_CELL_EDITORS_INPUTS, O_TABLE_CELL_EDITORS_OUTPUTS, O_TABLE_CELL_RENDERERS, O_TABLE_CELL_RENDERERS_INPUTS, O_TABLE_CELL_RENDERERS_OUTPUTS, O_TABLE_GLOBAL_CONFIG, O_TRANSLATE_SERVICE, ObservableWrapper, OnRangeChangeVirtualScroll, OntimizeAuthService, OntimizeAuthServiceProvider, OntimizeBaseService, OntimizeEEPermissionsService, OntimizeEEService, OntimizeExportDataProviderService, OntimizeExportDataProviderService3X, OntimizeExportService, OntimizeExportService3X, OntimizeExportServiceProvider, OntimizeFileService, OntimizeMatDateFormats, OntimizeMatIconRegistry, OntimizeMomentDateAdapter, OntimizePermissionsService, OntimizeService, OntimizeServiceProvider, OntimizeServiceResponse, OntimizeServiceResponseAdapter, OntimizeServiceResponseParser, OntimizeWebModule, OntimizeWebTranslateModule, OrderByPipe, PermissionsGuardService, PermissionsService, PermissionsUtils, SQLTypes, ServiceUtils, ShareCanActivateChildService, SideEnum, SnackBarService, StringConverter, TWELVE_HOUR_FORMAT_PATTERN, TWENTY_FOUR_HOUR_FORMAT_PATTERN, TableFilterByColumnDialogResult, Util, _getInjectionTokenValue, appConfigFactory, authServiceFactory, componentStateFactory, dataServiceFactory, dateFormatFactory, editorsMapping, exportDataFactory, exportServiceFactory, fileServiceFactory, getPermissionsServiceProvider, noop, ontimizePostBootstrap, permissionsServiceFactory, renderersMapping, translateServiceFactory };
 //# sourceMappingURL=ontimize-web-ngx.mjs.map